@import"https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&family=Noto+Sans+Mono:wght@400;500;600&display=swap";@import"https://fonts.googleapis.com/css2?family=Material+Symbols+Outlined:opsz,wght,FILL,GRAD@20,400,0,0";:root{--accent: #0070c0;--accent-strong: color-mix(in oklab, var(--accent) 82%, black);--bg: color-mix(in oklab, var(--accent) 3%, #f8fafc);--line: color-mix(in oklab, var(--accent) 10%, #e7ecf2);--tint-soft: color-mix(in oklab, var(--accent) 8%, #ffffff);--tint-40: color-mix(in oklab, var(--accent) 36%, #ffffff);--tint-65: color-mix(in oklab, var(--accent) 65%, #ffffff);--tint-90: color-mix(in oklab, var(--accent) 92%, #ffffff);--ink: #182430;--ink-60: #4a5560;--grey-60: #6e7a87;--grey-45: #8b98a5;--grey-30: #bcc5cf}*,*:before,*:after{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;font-family:Noto Sans JP,sans-serif;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}pre,code{font-family:Noto Sans Mono,monospace}button,input,select,textarea{font-family:inherit}.material-symbols-outlined{display:block;font-variation-settings:"FILL" 0,"wght" 400,"GRAD" 0,"opsz" 20}a{color:var(--accent);text-decoration:none}a:hover{color:var(--accent-strong)}@keyframes spin{to{transform:rotate(360deg)}}.page{max-width:1080px;margin:0 auto;padding:0 20px 80px}.section{padding:64px 0;scroll-margin-top:96px}.section+.section{border-top:1px solid var(--line)}.section-heading{font-size:22px;font-weight:700;color:var(--ink);margin:0 0 6px}.section-eyebrow{font-size:12px;font-weight:600;letter-spacing:.08em;text-transform:uppercase;color:var(--accent);margin:0 0 8px}.section-lead{font-size:13px;color:var(--grey-60);margin:0 0 32px;max-width:560px;line-height:1.7}.hero{padding:56px 0 64px;display:flex;flex-direction:column;gap:28px}.hero-top{display:flex;align-items:center;gap:24px}.hero-name{font-size:32px;font-weight:700;color:var(--ink);margin:0;line-height:1.25}.hero-role{font-size:15px;color:var(--accent);font-weight:600;margin:6px 0 0}.hero-summary{font-size:14px;color:var(--ink-60);line-height:1.8;max-width:620px;margin:0}.hero-actions{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.hero-socials{display:flex;align-items:center;gap:8px}.hero-character{flex:none;width:96px;height:96px}.hero-character svg{width:100%;height:100%;display:block}.hero-character-float{animation:hero-float 3.2s ease-in-out infinite;transform-origin:50% 50%}.hero-character-eyes{animation:hero-blink 4.5s ease-in-out infinite;transform-origin:48px 46px}.hero-character-antenna{animation:hero-antenna 2.4s ease-in-out infinite;transform-origin:48px 18px}.hero-character-wave{animation:hero-wave 1.8s ease-in-out infinite;transform-origin:70px 58px}@keyframes hero-float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}@keyframes hero-blink{0%,88%,to{transform:scaleY(1)}92%{transform:scaleY(.1)}96%{transform:scaleY(1)}}@keyframes hero-antenna{0%,to{transform:rotate(-6deg)}50%{transform:rotate(6deg)}}@keyframes hero-wave{0%,to{transform:rotate(0)}25%{transform:rotate(-18deg)}50%{transform:rotate(0)}75%{transform:rotate(-18deg)}}@media (prefers-reduced-motion: reduce){.hero-character-float,.hero-character-eyes,.hero-character-antenna,.hero-character-wave{animation:none}}.grid-2{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}.grid-3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}.tag-row{display:flex;flex-wrap:wrap;gap:8px}.skill-group+.skill-group{margin-top:22px}.skill-group-title{font-size:12px;font-weight:600;color:var(--ink-60);margin:0 0 10px}.project-card-tags{display:flex;flex-wrap:wrap;gap:6px}.project-card-links{display:flex;gap:8px;flex-wrap:wrap}.contact-card{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap}.back-link{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:var(--ink-60);margin-bottom:20px}.back-link:hover{color:var(--accent)}.project-detail{padding-top:44px}.project-media-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}.project-media-item{margin:0;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:#fff}.project-media-item img,.project-media-item video{display:block;width:100%;aspect-ratio:16 / 10;object-fit:cover;background:var(--tint-soft)}.project-media-item figcaption{padding:10px 14px;font-size:12px;color:var(--grey-60);border-top:1px solid var(--line)}.project-media-empty{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;padding:48px 20px;border:1px dashed var(--line);border-radius:14px;color:var(--grey-60);font-size:13px}.footer{padding:28px 0 calc(96px + env(safe-area-inset-bottom,0px));text-align:center;font-size:12px;color:var(--grey-45)}.bottom-nav{position:fixed;left:0;right:0;bottom:0;z-index:30;display:flex;justify-content:center;padding:0 16px calc(14px + env(safe-area-inset-bottom,0px));pointer-events:none}.bottom-nav-inner{pointer-events:auto;display:flex;align-items:center;gap:2px;width:100%;max-width:460px;padding:6px;background:#ffffffdb;backdrop-filter:blur(20px) saturate(150%);-webkit-backdrop-filter:blur(20px) saturate(150%);border:1px solid rgba(255,255,255,.85);outline:1px solid color-mix(in oklab,var(--accent) 12%,#e7ecf2);border-radius:18px;box-shadow:0 6px 22px -10px #18243047}.bottom-nav-item{flex:1;min-width:0;display:flex;flex-direction:column;align-items:center;gap:3px;border:0;background:transparent;padding:7px 4px;border-radius:12px;cursor:pointer;font-size:10.5px;font-weight:600}.bottom-nav-item:hover{background:var(--tint-soft)}.bottom-nav-item span{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:100%}@media (max-width: 720px){.grid-2,.grid-3,.project-media-grid{grid-template-columns:1fr}.hero{padding:40px 0 48px}.hero-top{gap:16px}.hero-character{width:72px;height:72px}.hero-name{font-size:22px}.section{padding:44px 0}.contact-card{flex-direction:column;align-items:flex-start}}
