:root{--accent:#53b1cd;--ink:#20211c;--paper:#fff;color-scheme:light}
*{box-sizing:border-box}html{min-height:100%;scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Zen Old Mincho',serif;font-size:14px;transition:color 1.6s ease}a{color:inherit}button,input{font:inherit}.background-wash{position:fixed;inset:0;z-index:-1;background:linear-gradient(180deg,#53b1cd 0%,#3f8ab3 50%,#397fab 64%,#2a6398 100%);clip-path:inset(0 0 100% 0);transition:clip-path 3.5s cubic-bezier(.33,0,.2,1);pointer-events:none}body.night{--ink:#fff;--accent:#fff}.night .background-wash{clip-path:inset(0)}
.brand{padding-top:22px;text-align:center;height:183px}.brand a{display:inline-flex;align-items:center;flex-direction:column;text-decoration:none}.brand_symbol{width:100px;height:100px;object-fit:contain}.brand_wordmark{width:145px;height:60px;object-fit:contain;margin-top:-8px}.brand img{transition:filter 1.6s}.night .brand img{filter:brightness(0) invert(1)}
.home-layout{position:relative;width:min(1184px,calc(100% - 96px));margin:0 auto;min-height:780px}.profile{width:580px;max-width:58%;position:relative}.profile-photo{display:block;width:176px;height:176px;object-fit:cover;background:#53b1cd}.profile-copy{margin-top:36px}.name-reading{font-size:12px;letter-spacing:.08em;margin:0 0 1px}h1{font-size:24px;font-weight:500;line-height:1.4;margin:0 0 12px}.profile-tags{color:var(--accent);font-size:16px;letter-spacing:.04em;margin:0;transition:color 1.6s}.biography{font-size:14px;line-height:2.23;letter-spacing:.025em}.biography p{margin:0 0 12px}.my-rules{border:0;padding:0;margin:18px 0 0;width:200px;font-size:13px;letter-spacing:.06em}.my-rules legend{padding:0 0 4px}.my-rules label{display:flex;align-items:center;border-top:1px solid #a5a5a5;min-height:35px;cursor:pointer}.my-rules label:last-child{border-bottom:1px solid #a5a5a5}.my-rules input{appearance:none;width:15px;height:15px;border:1px solid #999;background:transparent;border-radius:0;margin:0 18px 0 6px;display:grid;place-content:center;cursor:pointer}.my-rules input:checked:after{content:'✓';font-family:serif;font-size:19px;line-height:1;color:var(--ink)}
.main-menu{position:absolute;left:66%;top:205px;display:flex;align-items:flex-start;flex-direction:column;gap:6px;color:var(--accent);font-family:'Aoboshi One',serif;font-size:25px;letter-spacing:.03em;transition:color 1.6s}.main-menu a,.main-menu button{position:relative;display:block;width:max-content;line-height:1.5;padding:3px 14px;border:0;background:none;color:inherit;text-decoration:none;cursor:pointer}.main-menu :nth-child(2){margin-left:20px}.main-menu :nth-child(3){margin-left:20px}.main-menu :nth-child(4){margin-left:30px;margin-top:8px}.main-menu :nth-child(5){margin-left:95px;margin-top:10px}.main-menu a:after,.main-menu button:after{content:'';position:absolute;inset:0;border:1px solid currentColor;border-radius:50%;transform:rotate(-6deg) scale(.86);opacity:0;transition:transform .28s ease,opacity .28s ease}.main-menu a:hover:after,.main-menu button:hover:after,.main-menu a:focus-visible:after,.main-menu button:focus-visible:after{opacity:1;transform:rotate(-6deg) scale(1)}
.read-more-path{position:absolute;pointer-events:none;left:21%;top:228px;width:47%;height:440px;overflow:visible;fill:none;stroke:currentColor;stroke-width:1.25}.read-more-path text{fill:currentColor;stroke:none;font-size:12px;letter-spacing:.08em}.site-footer{text-align:center;font-size:12px;padding:15px 24px 24px;letter-spacing:.02em}.skip-link{position:absolute;left:16px;top:0;transform:translateY(-150%);z-index:10;background:white;color:#222;padding:10px}.skip-link:focus{transform:translateY(0)}:focus-visible{outline:2px solid currentColor;outline-offset:5px}.content-page{max-width:900px;margin:30px auto;padding:24px;min-height:65vh}.content-page img{max-width:100%;height:auto}.content-page article{margin-bottom:40px}
@media(min-width:1500px){.home-layout{width:1184px}}
@media(max-width:1000px){.home-layout{width:calc(100% - 64px)}.profile{max-width:65%}.main-menu{left:70%;font-size:22px}.main-menu :nth-child(5){margin-left:30px}.read-more-path{display:none}}
@media(max-width:700px){.brand{height:155px;padding-top:12px}.brand_symbol{width:85px;height:85px}.brand_wordmark{width:130px}.home-layout{width:calc(100% - 40px);min-height:0;display:flex;flex-direction:column}.profile{width:100%;max-width:none}.profile-photo{width:150px;height:150px}.profile-copy{margin-top:24px}.main-menu{position:static;order:-1;flex-direction:row;flex-wrap:wrap;font-size:17px;gap:8px;margin:0 0 28px}.main-menu a,.main-menu button{padding:4px 8px}.main-menu :nth-child(n){margin:0}.biography{line-height:2.1}.profile-tags{font-size:14px}.site-footer{padding-top:38px}.my-rules{margin-top:24px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{transition:none!important}.background-wash{transition:none}}
/* Soft ink diffusion on the home page, starting after ten seconds. */
.home .background-wash{clip-path:none;background:none;transition:none;overflow:hidden}
.home .background-wash canvas{display:block;width:100%;height:100%;filter:blur(9px);transform:scale(1.04)}
.home .background-wash.ink-complete{background:linear-gradient(180deg,#53b1cd 0%,#3f8ab3 50%,#397fab 64%,#2a6398 100%)}
.home .ink-light{--ink:#fff;--accent:#fff;color:#fff;transition:color 1.8s ease}
.home .brand.ink-light img{filter:brightness(0) invert(1)}
.home .my-rules.ink-light input,.home.night .my-rules input{border-color:#ffffffb3}

/* Revised Top_PC comp: compact profile photo and a four-item menu. */
.home .brand{height:142px;padding-top:10px}
.home .brand_symbol{width:60px;height:60px}
.home .brand_wordmark{width:70px;height:30px;margin-top:-6px}
.home .profile-photo{width:145px;height:145px}
.home .profile-copy{margin-top:26px}
.home .home-layout{min-height:827px}
.home .main-menu{top:200px}
.home .main-menu :nth-child(2){margin-left:24px;margin-top:7px}
.home .main-menu :nth-child(3){margin-left:34px;margin-top:3px}
.home .main-menu :nth-child(4){margin-left:99px;margin-top:13px}
.home .read-more-path{left:19.1%;top:260px;width:49%;height:350px}
@media(max-width:1000px){.home .main-menu :nth-child(4){margin-left:30px}}
@media(max-width:700px){.home .brand{height:125px}.home .home-layout{min-height:0}.home .main-menu :nth-child(n){margin:0}.home .profile-copy{margin-top:26px}.home .site-footer{margin-top:40px}}