/* A restrained editorial homepage, aligned to one reading grid. */
:root {
    color-scheme: light;
    --home-ink: #292d2f;
    --home-muted: #6b7274;
    --home-accent: #39716d;
    --home-line: #cbd2cf;
    --home-width: 1000px;
}
* { box-sizing: border-box; }
html { margin: 0; scroll-padding-top: 90px; scrollbar-gutter: stable; }
body.personal-home { margin: 0; color: var(--home-ink); background: #fff; -webkit-font-smoothing: antialiased; }
.personal-home h1, .personal-home h2, .personal-home h3, .personal-home p { margin: 0; }
.personal-home a { color: inherit; text-decoration: none; }
.personal-home a:hover { color: var(--home-accent); }
.home-shell { width: min(var(--home-width), calc(100% - 64px)); margin-inline: auto; }
.home-skip-link { position: fixed; top: 12px; left: 16px; z-index: 1100; padding: 8px 16px; background: #fff; border: 2px solid var(--home-line); transform: translateY(-180%); }
.home-skip-link:focus { transform: none; }
#main-content:focus { outline: none; }

/* Override shared theme declarations in their own layer, for this page only. */
@layer site-theme {
    .personal-home .landing-nav { padding-inline: max(32px, calc((100% - var(--home-width)) / 2)) !important; border-bottom: 0 !important; }
    .personal-home .landing-nav-links { gap: 22px !important; }
    .personal-home .landing-nav-links a::after { display: none !important; }
    .personal-home .landing-brand { display: inline-flex; align-items: center; min-height: 44px; }
    .personal-home .home-welcome { color: #555e60 !important; font-size: 16px !important; line-height: 1.85 !important; }
    @media (min-width: 821px) and (max-width: 1100px) {
        .personal-home .landing-nav-links { gap: 15px !important; }
    }
    @media (max-width: 820px) {
        .personal-home .landing-nav { padding-inline: 24px !important; }
        .personal-home .landing-nav-links { gap: 0 !important; }
        .personal-home .landing-nav-toggle { width: 44px !important; height: 44px !important; flex-basis: 44px !important; }
        .personal-home .landing-nav-toggle span:not(.visually-hidden) { height: 2px !important; }
        .personal-home .landing-nav-toggle[aria-expanded="true"] span:first-child { transform: translateY(4px) rotate(45deg) !important; }
        .personal-home .landing-nav-toggle[aria-expanded="true"] span:nth-child(2) { transform: translateY(-4px) rotate(-45deg) !important; }
    }
    @media (max-width: 580px) {
        .personal-home .landing-nav { padding-inline: 20px !important; }
    }
}

.home-hero { padding-top: 136px; padding-bottom: 60px; }
.home-intro { display: grid; grid-template-columns: 144px minmax(0, 1fr) 44px; align-items: start; gap: 40px; }
.home-calendar { margin-top: 8px; padding: 10px 32px 13px 0; border-right: 2px solid var(--home-line); text-align: center; }
.home-calendar time { display: flex; flex-direction: column; align-items: center; }
.home-date-month { color: var(--home-muted); font-size: 13px; letter-spacing: .015em; white-space: nowrap; }
.home-date-day { margin-block: -3px; font-size: 64px; line-height: 1.3; letter-spacing: -.06em; font-variant-numeric: tabular-nums; }
.home-date-weekday { color: var(--home-muted); font-size: 13px; }
.home-identity { min-width: 0; }
.home-eyebrow { margin-bottom: 10px !important; color: var(--home-muted); font-size: 13px; line-height: 1.6; letter-spacing: .035em; }
.home-identity h1 { font-size: clamp(30px, 3.1vw, 40px); line-height: 1.45; letter-spacing: -.025em; text-wrap: balance; }
.home-welcome { margin-top: 20px !important; }
.home-text-link { display: inline-flex; align-items: center; min-height: 44px; font-size: 14px; line-height: 1.7; }
.home-profile-link { margin-top: 14px; color: var(--home-accent) !important; }
.home-socials { display: flex; flex-direction: column; gap: 2px; margin-top: 33px; }
.home-socials a { display: grid; width: 44px; height: 44px; place-items: center; color: var(--home-muted); border-radius: 3px; transition: color 160ms ease, background-color 160ms ease; }
.home-socials a:hover { color: var(--home-accent); background: #f4f7f6; }
.home-socials svg { display: block; width: 19px; height: 19px; }

.home-journal > .home-shell { border-top: 2px solid var(--home-line); }
.home-section-grid { display: grid; grid-template-columns: 144px minmax(0, 1fr); gap: 40px; }
.home-writing { padding-top: 40px; }
.home-section-label { padding-top: 17px; }
.home-section-label h2 { font-size: 23px; line-height: 1.6; letter-spacing: -.025em; }
.home-section-label > .home-text-link { margin-top: 5px; color: var(--home-muted); }
.home-post-list { min-width: 0; padding: 0; margin: 0; list-style: none; }
.home-post-link { display: grid; grid-template-columns: 94px minmax(0, 1fr); gap: 22px; align-items: baseline; padding-block: 21px 24px; }
.home-post-link time { color: var(--home-muted); font-size: 13px; line-height: 1.8; font-variant-numeric: tabular-nums; white-space: nowrap; }
.home-post-copy { min-width: 0; }
.home-post-copy h3 { font-size: 21px; line-height: 1.6; letter-spacing: -.01em; overflow-wrap: anywhere; transition: color 160ms ease; }
.home-post-link:hover h3, .home-post-link:focus-visible h3 { color: var(--home-accent); }
.home-post-copy p { margin-top: 7px; color: var(--home-muted); font-size: 15px; line-height: 1.8; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; overflow-wrap: anywhere; }
.home-empty { padding-block: 21px 24px; color: var(--home-muted); }
.home-empty .home-text-link { margin-top: 10px; }
.home-elsewhere { display: flex; flex-wrap: wrap; gap: 4px 30px; margin-top: 24px; padding: 19px 0 19px 184px; color: #586365; }
.home-elsewhere a { display: inline-flex; align-items: center; min-height: 44px; font-size: 15px; }
.home-footer { padding-block: 24px 32px; border-top: 2px solid var(--home-line); color: var(--home-muted); }
.home-footer-main { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 4px 24px; }
.home-footer-main nav { display: flex; flex-wrap: wrap; gap: 20px; }
.home-footer-main a, .home-footer-legal a { display: inline-flex; align-items: center; min-height: 36px; }
.home-footer-legal { display: flex; flex-wrap: wrap; gap: 0 18px; margin-top: 6px; font-size: 12px; }

@media (max-width: 820px) {
    .home-shell { width: calc(100% - 48px); }
    .home-hero { padding-top: 110px; padding-bottom: 40px; }
    .home-intro { grid-template-columns: 112px minmax(0, 1fr); gap: 20px 28px; }
    .home-calendar { padding-right: 22px; }
    .home-date-day { font-size: 58px; }
    .home-identity h1 { font-size: 32px; }
    .home-socials { grid-column: 2; flex-direction: row; gap: 8px; margin: -4px 0 0 -12px; }
    .home-section-grid { grid-template-columns: 112px minmax(0, 1fr); gap: 28px; }
    .home-section-label h2 { font-size: 22px; }
    .home-post-link { grid-template-columns: minmax(0, 1fr); gap: 5px; }
    .home-elsewhere { padding-left: 140px; gap: 4px 26px; }
}
@media (max-width: 580px) {
    .home-shell { width: calc(100% - 40px); }
    .home-hero { padding-top: 88px; padding-bottom: 30px; }
    .home-intro { display: flex; flex-direction: column; gap: 25px; }
    .home-calendar { align-self: stretch; margin: 0; padding: 0 0 15px; border-right: 0; text-align: left; }
    .home-calendar time { flex-direction: row; gap: 8px; }
    .home-date-day { margin: 0; font-size: 25px; line-height: 1; letter-spacing: -.03em; }
    .home-date-day::after { content: "日"; font-size: 13px; margin-left: 3px; }
    .home-date-weekday { margin-left: auto; }
    .home-identity { width: 100%; }
    .home-identity h1 { font-size: clamp(27px, 7.4vw, 32px); }
    .home-eyebrow { margin-bottom: 8px !important; }
    .home-welcome { margin-top: 16px !important; }
    .home-profile-link { margin-top: 10px; }
    .home-socials { margin: -16px 0 -8px -12px; gap: 8px; }
    .home-section-grid { grid-template-columns: minmax(0, 1fr); gap: 4px; }
    .home-writing { padding-top: 22px; }
    .home-section-label { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 0; }
    .home-section-label h2 { font-size: 23px; }
    .home-section-label > .home-text-link { margin: 0; }
    .home-post-link { padding-block: 18px 20px; gap: 6px; }
    .home-post-copy h3 { font-size: 20px; }
    .home-elsewhere { margin-top: 12px; padding: 14px 0; gap: 4px 26px; }
    .home-footer { padding-block: 20px 96px; }
    .home-footer-main { align-items: start; }
    .home-footer-legal { flex-direction: column; align-items: flex-start; margin-top: 7px; }
}
@media (max-width: 820px) {
    .no-js .personal-home .landing-nav-links { position: absolute; top: calc(60px + env(safe-area-inset-top)); left: 0; right: 0; width: 100%; opacity: 1; visibility: visible; transform: none; display: flex; justify-content: flex-start; overflow-x: auto; border-radius: 0 !important; padding-inline: 20px; }
    .no-js .personal-home .landing-nav-links a { flex-shrink: 0; }
    .no-js .personal-home .landing-nav-toggle { display: none !important; }
    .no-js .home-hero { padding-top: 155px; }
}
@media (prefers-reduced-motion: reduce) {
    .personal-home *, .personal-home *::before, .personal-home *::after { scroll-behavior: auto !important; transition: none !important; }
}