@charset "UTF-8";:root{--bg: #ffffff;--fg: #121417;--muted: #5b6470;--acc: #4f46e5;--card: #f6f7f9;--border: #e7e9ee}:root[data-theme=dark]{--bg: #0b0f14;--fg: #e7e9ee;--muted: #a8b0bb;--acc: #8ab4f8;--card: #121821;--border: #1c2430}@media (max-width: 768px){.site-header .menu{gap:var(--space-1)}.hero{padding-block:clamp(32px,8vw,72px);text-align:center}.hero .actions{flex-direction:column;gap:var(--space-2)}}@media (max-width: 480px){.logo .name{font-size:clamp(18px,6vw,22px)}.btn{width:100%}}.nav{display:flex;align-items:center;gap:var(--space-2);flex-wrap:wrap}.menu{display:flex;flex-wrap:wrap;gap:var(--space-1)}@media (max-width: 640px){.menu{width:100%;order:2}.logo{order:1}}a,button{min-height:44px;min-width:44px}@media (hover: hover) and (pointer: fine){.card:hover{transform:translateY(-2px)}}@media (prefers-reduced-motion: reduce){*,:before,:after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important}}@media (max-width: 480px){.card{box-shadow:0 8px 18px #00000040}}.hero-media{aspect-ratio:16/9;border-radius:var(--radius);overflow:hidden}@media (prefers-color-scheme: dark){:root:not([data-theme]){--bg: #0b0f14;--fg: #e7e9ee;--muted: #a8b0bb;--acc: #8ab4f8;--card: #121821;--border: #1c2430}}*{box-sizing:border-box}img,svg,video{max-width:100%;height:auto}html,body{height:100%}body{margin:0;font-family:Noto Sans JP,system-ui,Segoe UI,Roboto,sans-serif;background:var(--bg);color:var(--fg);line-height:1.6}.container{max-width:1100px;margin:0 auto;padding:0 20px}.skip{position:absolute;left:-999px}.skip:focus{left:12px;top:12px;background:var(--acc);color:#fff;padding:8px 12px;border-radius:8px}.site-header{position:fixed;top:0;left:0;right:0;background:var(--bg);border-bottom:1px solid var(--border);z-index:1000}.nav{display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:20px}.logo{justify-self:start}.menu{justify-self:center}.actions{justify-self:end}@media (prefers-reduced-motion: reduce){.led{animation:none!important}}@property --hue{syntax: "<number>"; inherits: false; initial-value: 0;}.logo{font-weight:700;display:inline-flex;align-items:center;gap:.6rem}.name{font-size:1.2rem;font-weight:700}.led{--size: 14px;--hue: 0;--sat: 100%;--lit: 50%;width:var(--size);height:var(--size);border-radius:50%;background-color:hsl(var(--hue),var(--sat),var(--lit));box-shadow:0 0 6px hsl(var(--hue),var(--sat),65%,.9),0 0 12px hsl(var(--hue),var(--sat),55%,.7),0 0 20px hsl(var(--hue),var(--sat),50%,.5);animation:hue-cycle 25s linear infinite}@keyframes hue-cycle{0%{--hue: 0}25%{--hue: 120}50%{--hue: 200}75%{--hue: 260}to{--hue: 360}}.menu{margin:0;padding:0;list-style:none;display:flex;gap:16px}.menu a{text-decoration:none;color:var(--fg);opacity:.9}.menu a:hover{opacity:1;color:var(--acc)}.btn,.btn-secondary,.btn-icon{display:inline-flex;align-items:center;gap:8px;border-radius:12px;padding:10px 16px;font-weight:600;text-decoration:none}.btn{background:var(--acc);color:#fff}.btn-secondary,.btn-icon{background:transparent;color:var(--fg)}.section{padding:64px 0;border-bottom:1px solid var(--border)}.hero{padding:96px 0 72px}h1{font-size:clamp(2rem,4vw,3rem);line-height:1.15;margin:0 0 12px}h1 .accent{color:var(--acc)}h2{font-size:clamp(1.5rem,2.8vw,2rem);margin:0 0 16px}.cta{display:flex;gap:12px;margin-top:16px;flex-wrap:wrap}.tags{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}.tags li{padding:6px 10px;background:var(--card);border:1px solid var(--border);border-radius:999px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:16px}.card{background:var(--card);border:1px solid var(--border);border-radius:16px;padding:16px}.card h3{margin:0 0 8px}.link{color:var(--acc);text-decoration:none;font-weight:600}.site-footer{padding:28px 0}.btn-icon{position:relative;overflow:hidden;inline-size:3rem;block-size:3rem;display:inline-grid;place-items:center;padding:0;border:none;background:transparent;border-radius:12px}.icon{position:absolute;inset:0;margin:auto;width:2.4rem;height:2.4rem;opacity:0;transform:scale(.8) rotate(-6deg);transition:opacity .2s ease,transform .28s cubic-bezier(.2,.8,.2,1)}#theme-toggle[data-mode=auto] .icon-auto,#theme-toggle[data-mode=light] .icon-sun,#theme-toggle[data-mode=dark] .icon-moon{opacity:1;transform:scale(1) rotate(0)}@media (prefers-reduced-motion: no-preference){#theme-toggle:after{content:"";position:absolute;left:50%;top:50%;width:0;height:0;border-radius:50%;background:radial-gradient(circle,currentColor 0%,transparent 60%);opacity:.28;transform:translate(-50%,-50%);pointer-events:none}#theme-toggle.is-rippling:after{animation:ripple .45s ease-out}@keyframes ripple{0%{width:0;height:0;opacity:.28}to{width:160%;height:160%;opacity:0}}}@media (prefers-reduced-motion: no-preference){body,.site-header,.card,.btn,.btn-secondary,.btn-icon{transition:background-color .25s ease,color .25s ease,border-color .25s ease,box-shadow .25s ease}}.visually-hidden{position:absolute!important;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}:root{--fab-size: 64px;--fab-gap: 20px;--fab-bottom: calc(var(--fab-gap) + env(safe-area-inset-bottom));--fab-right: calc(var(--fab-gap) + env(safe-area-inset-right));--glow-color: rgba(138, 43, 226, .6)}.scroll-top{position:fixed;right:var(--fab-right);bottom:var(--fab-bottom);transform:scale(.95);width:var(--fab-size);height:var(--fab-size);border-radius:50%;border:1px solid transparent;background:#222;box-shadow:0 10px 24px #0000002e;display:grid;place-items:center;cursor:pointer;overflow:visible;opacity:0;pointer-events:none;transition:transform .3s,opacity .3s,background-color .2s,border-color .2s,bottom .25s ease;z-index:9999}.scroll-top.show{opacity:1;pointer-events:auto;transform:scale(1)}.scroll-top:hover{transform:scale(1.05)}.scroll-top .icon,.scroll-top img{width:55%;height:55%;margin:auto;display:block;object-fit:contain}.scroll-top img{filter:invert(1);pointer-events:none}.scroll-top:after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:160%;height:160%;border-radius:50%;background:radial-gradient(circle,var(--glow-color),transparent 70%);animation:pulse 2.5s ease-in-out infinite;pointer-events:none;z-index:-1}@keyframes pulse{0%,to{opacity:.6;transform:translate(-50%,-50%) scale(1)}50%{opacity:1;transform:translate(-50%,-50%) scale(1.1)}}html[data-theme=light] .scroll-top{background:#fff;border-color:#e7e9ee;box-shadow:0 10px 24px #0000001f}html[data-theme=light] .scroll-top img{filter:none}html[data-theme=dark] .scroll-top:after{background:radial-gradient(circle,rgba(138,43,226,.6),transparent 70%)}html[data-theme=light] .scroll-top:after{background:radial-gradient(circle,rgba(255,140,0,.45),transparent 70%)}.scroll-top.avoid-footer{bottom:calc(var(--fab-bottom) + 96px)}@media (prefers-reduced-motion: reduce){.scroll-top{transition:none}.scroll-top:after{animation:none}}.skills-grid{list-style:none;margin:0;padding:0;display:grid;gap:12px;grid-template-columns:repeat(auto-fill,minmax(180px,1fr))}.skill{display:flex;align-items:center;gap:10px;padding:10px 12px;background:var(--card);border:1px solid var(--border);border-radius:12px;transition:transform .2s ease,box-shadow .2s ease,border-color .2s ease}.skill:hover{transform:translateY(-2px);box-shadow:0 6px 18px #00000014;border-color:color-mix(in oklab,var(--border),var(--acc) 18%)}.skill img{width:48px;height:48px;object-fit:contain;flex:0 0 22px}.skill span{font-weight:600}.skills-grid img[src*="github-original.svg"]{filter:none}html[data-theme=dark] .skills-grid img[src*="github-original.svg"]{filter:invert(1)}.site-footer{text-align:center;padding:20px;background:#0b0f14;color:#fff}.site-footer a img{filter:invert(1);transition:transform .3s ease,filter .3s ease}.site-footer a:hover img{transform:scale(1.1);filter:invert(47%) sepia(86%) saturate(747%) hue-rotate(243deg) brightness(95%) contrast(95%)}.hello-bubble{--bubble-bg: var(--card);--bubble-fg: var(--fg);--bubble-border: var(--border);--bubble-glow: rgba(138, 43, 226, .35);--bubble-shadow: 0 10px 24px rgba(0, 0, 0, .12);display:inline-flex;align-items:center;gap:.6rem;padding:12px 16px;border-radius:18px;background:var(--bubble-bg);color:var(--bubble-fg);border:1px solid var(--bubble-border);text-decoration:none;font-weight:700;position:relative;box-shadow:var(--bubble-shadow);transform:translateZ(0);transition:transform .2s ease,box-shadow .25s ease,border-color .2s ease}.hello-bubble:after{content:"";position:absolute;left:18px;bottom:-7px;width:14px;height:14px;background:var(--bubble-bg);border:1px solid var(--bubble-border);border-top:none;border-left:none;transform:rotate(45deg);box-shadow:2px 2px 8px #0000000f}.hello-bubble:before{content:"";position:absolute;inset:-8px;border-radius:22px;background:radial-gradient(closest-side,var(--bubble-glow),transparent 70%);opacity:0;filter:blur(6px);transition:opacity .25s ease;z-index:-1}.hello-emoji{display:inline-block;font-size:1.25rem;transform-origin:70% 70%;animation:wave 2.4s ease-in-out infinite}.hello-bubble:hover,.hello-bubble:focus-visible{transform:translateY(-2px);box-shadow:0 14px 30px #00000024;border-color:color-mix(in oklab,var(--bubble-border),var(--acc) 25%)}.hello-bubble:hover:before,.hello-bubble:focus-visible:before{opacity:.9}.hello-bubble:focus-visible{outline:2px solid color-mix(in oklab,var(--acc),transparent 70%);outline-offset:3px}.hello-bubble{animation:floaty 6s ease-in-out infinite}html[data-theme=dark] .hello-bubble{--bubble-bg: #121821;--bubble-fg: var(--fg);--bubble-border: #1c2430;--bubble-glow: rgba(138, 43, 226, .55);--bubble-shadow: 0 10px 28px rgba(0, 0, 0, .35)}@media (prefers-reduced-motion: reduce){.hello-bubble,.hello-bubble:before{animation:none!important}.hello-emoji{animation:none!important}}.hello-note{margin-top:10px;color:var(--muted);font-size:.95rem}.project-img{width:100%;border-radius:12px;margin-bottom:12px;display:block;object-fit:cover}.card:hover h3{color:var(--acc)}.card{transform:translateZ(0) scale(1);will-change:transform,box-shadow,border-color;transition:transform .28s cubic-bezier(.2,.8,.2,1),box-shadow .28s ease,border-color .2s ease}.card:hover,.card:focus-within{transform:translateY(-4px) scale(1.02);box-shadow:0 14px 30px #00000024;border-color:color-mix(in oklab,var(--border),var(--acc) 25%)}.card:active{transform:translateY(-2px) scale(1.005)}.card h3{font-size:1.3rem;font-weight:700;transition:text-shadow .3s ease,color .3s ease}.card:hover h3,.card:focus-within h3{color:var(--acc);text-shadow:0 0 8px rgba(138,43,226,.5)}.card .project-img{transition:transform .28s cubic-bezier(.2,.8,.2,1);transform-origin:50% 45%}.card:hover .project-img,.card:focus-within .project-img{transform:translateY(-2px) scale(1.02)}@media (prefers-reduced-motion: reduce){.card,.card .project-img{transition:none;transform:none}}.hero--conversational .hero-wrap{display:grid;gap:28px;align-items:center;grid-template-columns:1fr}@media (min-width: 840px){.hero--conversational .hero-wrap{grid-template-columns:1.15fr .85fr}}.hero-left h1{margin-bottom:14px}.hero-sub{margin:12px 0 18px;color:var(--muted)}.hello-bubble.hero-bubble{--bubble-bg: var(--card);--bubble-fg: var(--fg);--bubble-border: var(--border);--bubble-glow: rgba(138, 43, 226, .35);--bubble-shadow: 0 10px 24px rgba(0, 0, 0, .1);display:inline-flex;align-items:center;gap:.6rem;padding:12px 16px;border-radius:18px;background:var(--bubble-bg);color:var(--bubble-fg);border:1px solid var(--bubble-border);text-decoration:none;font-weight:700;position:relative;box-shadow:var(--bubble-shadow);transition:transform .2s ease,box-shadow .25s ease,border-color .2s ease;animation:floaty 6s ease-in-out infinite}.hello-bubble.hero-bubble:after{content:"";position:absolute;left:18px;bottom:-7px;width:14px;height:14px;background:var(--bubble-bg);border:1px solid var(--bubble-border);border-top:none;border-left:none;transform:rotate(45deg)}.hello-bubble.hero-bubble:before{content:"";position:absolute;inset:-8px;border-radius:22px;background:radial-gradient(closest-side,var(--bubble-glow),transparent 70%);opacity:0;filter:blur(6px);transition:opacity .25s ease;z-index:-1}.hello-bubble.hero-bubble:hover,.hello-bubble.hero-bubble:focus-visible{transform:translateY(-2px);box-shadow:0 14px 30px #00000024;border-color:color-mix(in oklab,var(--bubble-border),var(--acc) 25%)}.hello-bubble.hero-bubble:hover:before,.hello-bubble.hero-bubble:focus-visible:before{opacity:.9}.hello-emoji{display:inline-block;font-size:1.2rem;transform-origin:70% 70%;animation:wave 2.4s ease-in-out infinite}.hello-text{font-size:1.05rem;letter-spacing:.2px}@keyframes floaty{0%,to{transform:translateY(0)}50%{transform:translateY(-2px)}}@keyframes wave{0%,to{transform:rotate(0)}10%{transform:rotate(18deg)}20%{transform:rotate(-8deg)}30%{transform:rotate(14deg)}40%{transform:rotate(-4deg)}50%{transform:rotate(8deg)}}html[data-theme=dark] .hello-bubble.hero-bubble{--bubble-bg: #121821;--bubble-border: #1c2430;--bubble-glow: rgba(138, 43, 226, .55)}.hero-actions{display:flex;gap:10px;flex-wrap:wrap}.pill{--pill-bg: var(--card);--pill-fg: var(--fg);--pill-bd: var(--border);display:inline-flex;align-items:center;gap:.45rem;padding:10px 14px;border-radius:999px;background:var(--pill-bg);color:var(--pill-fg);border:1px solid var(--pill-bd);text-decoration:none;font-weight:700;transition:transform .2s ease,box-shadow .25s ease,border-color .2s ease}.pill:hover,.pill:focus-visible{transform:translateY(-1px);border-color:color-mix(in oklab,var(--pill-bd),var(--acc) 25%);box-shadow:0 10px 24px #0000001a}.pill-primary{--pill-bg: var(--acc);--pill-fg: #fff;--pill-bd: transparent}.pill-primary:hover,.pill-primary:focus-visible{box-shadow:0 12px 28px #00000029}.mascot-wrap{width:min(360px,38vw);aspect-ratio:1/1.1;display:flex;align-items:center;justify-content:center;animation:bot-float 6s ease-in-out infinite;filter:drop-shadow(0 18px 40px rgba(0,0,0,.35))}:root{--bot-top: #2a2f3a;--bot-bottom: #171b22;--bot-metal: #8793a5;--bot-screen: #10151f;--bot-accent: #8A2BE2;--bot-led: #6ee7ff}html[data-theme=light]{--bot-top: #e9ecf3;--bot-bottom: #d8dde8;--bot-metal: #9aa6b5;--bot-screen: #ffffff;--bot-accent: #4f46e5;--bot-led: #3fb6ff}.kozu-bot{width:100%;height:100%}.body{stroke:#ffffff0f;stroke-width:1}.screen{fill:var(--bot-screen);stroke:#00000026;stroke-width:1}.metal{fill:var(--bot-metal)}.antenna-tip{fill:var(--bot-accent);filter:drop-shadow(0 0 8px color-mix(in oklab,var(--bot-accent),transparent 60%))}.track{fill:#2a3240}.bot-shadow{fill:#00000059}.eye-white{fill:#fff}.pupil{fill:#1c2430;transform-box:fill-box;transform-origin:center;--tx: 0px;--ty: 0px;--pupilScale: 1;transform:translate(var(--tx),var(--ty)) scale(var(--pupilScale))}@keyframes pupil-breathe{0%,to{--pupilScale: 1}92%,96%{--pupilScale: .92}}.pupil-left,.pupil-right{animation:pupil-breathe 6s ease-in-out infinite}.bar-led{fill:var(--bot-led);opacity:.9}@keyframes bar-pulse{0%,to{opacity:.9}50%{opacity:.4}}.bar-led{animation:bar-pulse 3.2s ease-in-out infinite}@keyframes bot-float{0%,to{transform:translateY(0)}50%{transform:translateY(-6px)}}.mascot-wrap .bot-shadow{transform-origin:80px 168px;animation:bot-shadow 6s ease-in-out infinite}@keyframes bot-shadow{0%,to{transform:scaleX(1);opacity:.45}50%{transform:scaleX(.92);opacity:.3}}.antenna{transform-origin:80px 26px;animation:antenna-wave 3.6s ease-in-out infinite}@keyframes antenna-wave{0%,to{transform:rotate(0)}50%{transform:rotate(8deg)}}@media (prefers-reduced-motion: reduce){.pupil-left,.pupil-right,.antenna,.mascot-wrap .bot-shadow,.bar-led{animation:none!important}}.mascot-wrap{position:relative;z-index:20;width:min(360px,38vw);aspect-ratio:1/1.1;display:flex;align-items:center;justify-content:center;animation:bot-float 6s ease-in-out infinite;filter:drop-shadow(0 18px 40px rgba(0,0,0,.35));overflow:visible}.mascot-wrap,.mascot-wrap *{user-select:none;-webkit-user-select:none;-webkit-user-drag:none}.mascot-wrap{-webkit-tap-highlight-color:transparent;touch-action:manipulation;position:relative;overflow:visible;z-index:20}html[data-theme=dark] .speech{background:#121821;border-color:#1c2430;box-shadow:0 10px 28px #00000059}@media (max-width: 768px){.mascot-wrap{width:280px;aspect-ratio:1/1.1}}@media (max-width: 768px){.nav{flex-direction:column;gap:10px}.menu{justify-content:center}}@media (max-width: 480px){.hero h1{font-size:1.6rem}.hero p{font-size:.95rem}}.menu{display:flex;gap:1rem;list-style:none;margin:0;padding:0}.menu li a{display:inline-block;padding:.5rem .75rem;font-size:1.2rem;font-weight:500;color:var(--text, #222);text-decoration:none;border-radius:8px;position:relative;transition:color .3s ease,background .3s ease}.menu li a:after{content:"";position:absolute;left:50%;bottom:4px;transform:translate(-50%) scaleX(0);transform-origin:center;width:60%;height:2px;background:var(--accent, #8a2be2);border-radius:2px;transition:transform .3s ease}.menu li a:hover{color:var(--accent, #8a2be2)}.menu li a:hover:after{transform:translate(-50%) scaleX(1)}.menu li a.active{color:var(--accent, #8a2be2)}.menu li a.active:after{transform:translate(-50%) scaleX(1)}html[data-theme=dark] .menu li a{color:#ddd}html[data-theme=dark] .menu li a:hover{color:var(--accent, #8a2be2)}