:root{--background: #4c5471;--background-light: #fcebf3;--button: #78c2ad;--text: #dfe3ee;--text-light: #4c5471;--text-link: #78c2ad;--text-link-light: #375a7f;--underline: #375a7f;--header: "Caveat Brush", cursive;--body: "Noto Sans JP", sans-serif}html{background-color:var(--background);min-height:100vh;color:var(--text)}html:before{content:"";position:fixed;inset:0;z-index:-1;background-image:var(--bg-dark-url);background-size:cover;background-position:center}body{max-width:540px;margin:0 auto;text-align:justify}@media(min-width:768px){body{max-width:720px}}@media(min-width:1200px){body{max-width:960px}}@media(min-width:1600px){body{max-width:1200px}}.content-area{--text: #dfe3ee;--text-link: #78c2ad;background-color:#666f8ae0;min-height:100vh;padding:0 1rem 2rem;box-sizing:border-box;color:var(--text)}html.light .content-area{--text: #4c5471;--text-link: #375a7f;background-color:#ffffffe0;color:var(--text)}h1,h2{font-family:var(--body);font-weight:400}h1{font-size:2.6rem;margin:0 0 5px}h2{text-decoration:underline var(--underline);text-decoration-thickness:4px;text-underline-offset:6px;text-decoration-skip-ink:none;font-size:2.1rem;margin-bottom:0}.section-heading{font-family:var(--header)}p{font-family:var(--body);font-size:1.1rem;hyphens:auto;line-height:1.5;text-indent:1rem}small,li{font-family:var(--body)}.navbar{display:flex;justify-content:space-between;align-items:center;padding-top:.8rem;gap:1rem}.navbar__title{font-family:var(--header);font-size:1.3rem;text-decoration:none;white-space:nowrap;color:var(--text)}.navbar__title:hover{text-decoration:underline var(--underline);text-decoration-thickness:2px;text-underline-offset:6px;text-decoration-skip-ink:none}.navbar__menu{font-family:var(--body);font-size:1.1rem;display:flex;align-items:center;gap:10px;flex-wrap:nowrap}.navbar__menu>a{margin:0;display:inline-flex;align-items:center;text-decoration:none;color:var(--text)}.navbar__menu>a:hover,.navbar__menu>a:focus{text-decoration:underline var(--underline);text-decoration-thickness:2px;text-underline-offset:6px;text-decoration-skip-ink:none}.gif{margin:20px 0 0;text-align:center}.badge{background-color:#584966;color:#dfe3ee;border-radius:6px;font-family:var(--body);font-weight:600;font-size:.85rem;padding:.3em .6em .2em}.badge__list{text-indent:1rem;list-style:none;padding:0}.badge__list>li{margin-top:10px}.badge--item{border-radius:4px;font-size:.7rem;margin-right:5px;padding:.5em .3em .3em}.badge__link{color:var(--text-link);text-decoration:none}.badge__link:hover{text-decoration:underline}.card{list-style:none;display:flex;background-size:400%;padding:20px}.card__link{width:100%;text-decoration:none;line-height:1.4;border-radius:8px;color:var(--text)}.card__img{border-radius:16px}.card__title{margin:0;font-family:var(--body);font-size:1.5rem;font-weight:400;text-align:center}.card__txt{font-size:1rem;line-height:1.5;text-indent:0;text-align:center;margin:.5rem 0 0}.card__link:hover{transform:scale(1.05)}.link-card-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(24ch,1fr));gap:1rem;padding:0}.btn{text-align:center;background:#0000;border:2px solid var(--button);border-radius:8px;color:var(--text);font:600 16px var(--body);padding:8px 16px;transition:background-color .4s,color .4s}.btn:hover{background-color:var(--button);color:var(--text-light);cursor:pointer}.skills{margin-top:8px}.skills__img{margin:8px 4px}.center{text-align:center}.pro-img{border-radius:16px;margin-top:10px}footer{margin:4rem 0}.footer__link{color:var(--text-link);text-decoration:none}.footer{cursor:default;list-style:none;padding:0}.icon__btn{display:inline-block;padding:0 .5rem}.icon__link{display:flex;padding:10px;height:24px;width:24px;border-radius:50%;border:2px solid #fdebf3;color:#fff}.icon__link:hover{border-color:var(--text-link)}.git-icon{content:url(/images/github-mark-white.svg)}.bluesky-icon{content:url(/images/bluesky-white.svg)}.mail-icon{content:url(/images/mail-white.svg)}.linked-in{content:url(/images/li-in-white.png)}.lost{margin-top:30%;text-align:center}.lost__header{margin:0 auto;text-align:center;border:0;font-size:7.5rem;letter-spacing:10px}.lost__body{color:#5c5b77}.lost__link{color:var(--text-link);text-decoration:none}.content-area .git-icon{content:url(/images/github-mark-white.svg)}.content-area .bluesky-icon{content:url(/images/bluesky-white.svg)}.content-area .mail-icon{content:url(/images/mail-white.svg)}.content-area .linked-in{content:url(/images/li-in-white.png)}html.light .content-area .git-icon{content:url(/images/github-mark.svg)}html.light .content-area .bluesky-icon{content:url(/images/bluesky.svg)}html.light .content-area .mail-icon{content:url(/images/mail.svg)}html.light .content-area .linked-in{content:url(/images/li-in.png)}html.light{background-color:var(--background-light);color:var(--text-light)}html.light:before{background-image:var(--bg-url)}.light .navbar__title{color:var(--text-light)}.light .navbar__menu>a{color:var(--text-light)}.light .card__title,.light .card__txt,.light .btn{color:var(--text-light)}.light .btn:hover{color:var(--text)}.light .icon__link{border:2px solid var(--text-light)}.light .icon__link:hover{border-color:var(--text-link)}.light .git-icon{content:url(/images/github-mark.svg)}.light .bluesky-icon{content:url(/images/bluesky.svg)}.light .mail-icon{content:url(/images/mail.svg)}.light .linked-in{content:url(/images/li-in.png)}.light .badge__link,.light .footer__link{color:var(--text-link-light)}.light .icon__link:hover{border-color:var(--text-link-light)}.tag-chip{display:inline-flex;align-items:center;padding:.15rem .4rem;text-indent:0;background-color:#78c2ad1f;color:#78c2ad;border:1px solid rgba(120,194,173,.35);border-radius:2em;font-family:var(--body);font-size:.78rem;font-weight:500;text-decoration:none;transition:background-color .2s,border-color .2s,transform .2s}.tag-chip:before{content:"#";opacity:.6;margin-right:.1em;font-weight:400}a.tag-chip:hover{background-color:#78c2ad40;border-color:#78c2ada6;transform:translateY(-2px)}html.light .tag-chip{background-color:#375a7f14;color:#375a7f;border-color:#375a7f4d}html.light a.tag-chip:hover{background-color:#375a7f2e;border-color:#375a7f8c}.tag-chip-list{display:flex;flex-wrap:wrap;gap:.5rem;list-style:none;padding:0;margin:0}@media only screen and (max-width:600px){body{width:100%}.navbar{gap:.5rem}.navbar__title{font-size:1.1rem}.navbar__menu{font-size:1rem;gap:8px}.navbar__menu>a{margin:0}.skills__img{height:30px;width:30px;margin:8px 1px}.badge__list{font-size:.9rem;text-indent:0}.pro-img{height:auto;width:350px}}
