:root{--bg:#0b0b0e;--bg-soft:#101015;--card:#14141a;--card-hover:#191922;--border:#26262e;--border-strong:#383844;--text:#ececf1;--text-muted:#9c9ca9;--text-dim:#6e6e7a;--accent:#b6ef5a;--accent-ink:#0b0b0e;--status-public:#4ade80;--status-dev:#fbbf24;--status-concept:#8b93ff;--font-sans:system-ui, "Segoe UI Variable", "Segoe UI", "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic UI", Meiryo, sans-serif;--font-mono:ui-monospace, "SF Mono", "Cascadia Mono", Consolas, "Liberation Mono", monospace;--radius-lg:22px;--radius-sm:10px;--container:1120px;--header-h:72px}*,:before,:after{box-sizing:border-box}html{scroll-behavior:smooth}body{background:var(--bg);color:var(--text);font-family:var(--font-sans);-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;text-rendering:optimizelegibility;margin:0;font-size:16px;line-height:1.75}a{color:inherit;text-decoration:none}ul{margin:0;padding:0;list-style:none}h1,h2,h3,h4,p{margin:0}::selection{background:var(--accent);color:var(--accent-ink)}#root{flex-direction:column;min-height:100svh;display:flex}main{flex:1 0 auto}.container{width:100%;max-width:var(--container);margin-inline:auto;padding-inline:clamp(20px,4vw,32px)}.section{scroll-margin-top:calc(var(--header-h) + 16px);padding-block:clamp(72px,10vw,128px)}.section__head{margin-bottom:clamp(32px,5vw,56px)}.section__label{font-family:var(--font-mono);letter-spacing:.18em;text-transform:uppercase;color:var(--accent);align-items:center;gap:10px;margin-bottom:16px;font-size:13px;display:inline-flex}.section__label:before{content:"";background:var(--accent);opacity:.6;width:24px;height:1px}.section__title{letter-spacing:-.03em;color:var(--text);font-size:clamp(40px,6vw,64px);font-weight:700;line-height:1.05}.header{z-index:100;height:var(--header-h);-webkit-backdrop-filter:blur(12px);border-bottom:1px solid var(--border);background:#0b0b0ed1;position:sticky;top:0}.header__inner{justify-content:space-between;align-items:center;gap:24px;height:100%;display:flex}.header__brand{letter-spacing:.14em;align-items:center;gap:10px;font-size:15px;font-weight:700;transition:opacity .2s;display:inline-flex}.header__brand:hover{opacity:.8}.header__mark{background:var(--accent);border-radius:3px;width:10px;height:10px;box-shadow:0 0 0 4px #b6ef5a1f}.header__nav{align-items:center;gap:6px;display:flex}.header__nav a{color:var(--text-muted);border-radius:var(--radius-sm);padding:8px 12px;font-size:14px;transition:color .2s,background-color .2s}.header__nav a:hover{color:var(--text);background:#ffffff0d}@media (width<=640px){.header__nav a{padding:8px;font-size:13px}}.hero{scroll-margin-top:calc(var(--header-h) + 16px);padding-block:clamp(96px,16vh,160px) clamp(64px,10vh,120px)}.hero__eyebrow{font-family:var(--font-mono);letter-spacing:.18em;color:var(--text-muted);align-items:center;gap:10px;margin-bottom:clamp(28px,4vw,48px);font-size:13px;display:inline-flex}.hero__dot{background:var(--status-public);border-radius:50%;width:8px;height:8px;animation:2.4s ease-in-out infinite hero-pulse}@keyframes hero-pulse{0%,to{opacity:1}50%{opacity:.45}}.hero__title{letter-spacing:-.04em;margin-bottom:clamp(24px,4vw,40px);font-size:clamp(44px,9vw,96px);font-weight:800;line-height:.98}.hero__title-accent{color:var(--accent)}.hero__lead{max-width:540px;color:var(--text-muted);margin-bottom:clamp(32px,5vw,48px);font-size:clamp(16px,2.2vw,19px)}.hero__cta{color:var(--accent-ink);background:var(--accent);border-radius:999px;align-items:center;gap:8px;padding:12px 22px;font-size:15px;font-weight:600;transition:transform .2s,box-shadow .2s;display:inline-flex}.hero__cta:hover{transform:translateY(-2px);box-shadow:0 8px 24px #b6ef5a40}.hero__cta svg{width:16px;height:16px}.bento{grid-template-columns:repeat(6,1fr);grid-auto-rows:minmax(150px,auto);gap:clamp(14px,2vw,20px);display:grid}.project-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;justify-content:space-between;gap:20px;padding:clamp(20px,2.6vw,28px);transition:transform .25s,border-color .25s,background-color .25s;display:flex}.project-card:hover{border-color:var(--border-strong);background:var(--card-hover);transform:translateY(-4px)}.project-card--large{grid-area:span 2/span 6}.project-card--medium{grid-column:span 3}.project-card--small{grid-column:span 2}.project-card__top{justify-content:space-between;align-items:center;gap:12px;display:flex}.project-card__index{font-family:var(--font-mono);color:var(--text-dim);font-size:13px}.project-card__body{flex-direction:column;gap:10px;display:flex}.project-card__name{letter-spacing:-.02em;font-size:clamp(22px,3vw,30px);font-weight:700;line-height:1.2}.project-card--large .project-card__name{font-size:clamp(28px,4vw,40px)}.project-card__desc{color:var(--text-muted);font-size:15px;line-height:1.7}.project-card--large .project-card__desc{max-width:600px;font-size:16px}.project-card__link{color:var(--accent);align-items:center;gap:6px;font-size:14px;font-weight:600;display:inline-flex}.project-card__link svg{width:15px;height:15px;transition:transform .2s}.project-card:hover .project-card__link svg{transform:translate(2px,-2px)}.status{font-family:var(--font-mono);letter-spacing:.12em;white-space:nowrap;border:1px solid #0000;border-radius:999px;align-items:center;gap:8px;padding:6px 12px;font-size:11px;display:inline-flex}.status__dot{background:currentColor;border-radius:50%;width:6px;height:6px}.status--public{color:var(--status-public);background:#4ade801a;border-color:#4ade8047}.status--in-development{color:var(--status-dev);background:#fbbf241a;border-color:#fbbf2447}.status--concept{color:var(--status-concept);background:#8b93ff1a;border-color:#8b93ff47}@media (width<=960px){.bento{grid-template-columns:repeat(2,1fr);grid-auto-rows:minmax(140px,auto)}.project-card--large{grid-area:auto/span 2}.project-card--medium,.project-card--small{grid-column:span 1}}@media (width<=600px){.bento{grid-template-columns:1fr}.project-card--large,.project-card--medium,.project-card--small{grid-column:span 1}}.about{grid-template-columns:1.2fr 1fr;align-items:start;gap:clamp(32px,6vw,80px);display:grid}.about__body{max-width:560px;color:var(--text-muted);margin-top:24px;font-size:clamp(16px,2.2vw,19px)}.about__body p+p{margin-top:20px}.about__stack{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);padding:clamp(20px,2.6vw,28px)}.about__stack-title{font-family:var(--font-mono);letter-spacing:.14em;text-transform:uppercase;color:var(--text-dim);margin-bottom:20px;font-size:13px}.stack-list{flex-wrap:wrap;gap:10px;display:flex}.stack-list li{font-family:var(--font-mono);background:var(--bg-soft);border:1px solid var(--border);border-radius:999px;padding:8px 14px;font-size:14px;transition:color .2s,border-color .2s}.stack-list li:hover{color:var(--accent);border-color:var(--accent)}@media (width<=900px){.about{grid-template-columns:1fr}}.link-grid{grid-template-columns:repeat(3,1fr);gap:clamp(14px,2vw,20px);display:grid}.link-card{background:var(--card);border:1px solid var(--border);border-radius:var(--radius-lg);flex-direction:column;align-items:flex-start;gap:12px;padding:clamp(20px,2.6vw,28px);transition:transform .25s,border-color .25s,background-color .25s;display:flex;position:relative}.link-card:hover{border-color:var(--border-strong);background:var(--card-hover);transform:translateY(-4px)}.link-card__icon{width:28px;height:28px;color:var(--text)}.link-card__icon svg{width:100%;height:100%}.link-card__name{letter-spacing:-.01em;font-size:20px;font-weight:700}.link-card__handle{font-family:var(--font-mono);color:var(--text-dim);font-size:13px}.link-card__arrow{width:18px;height:18px;color:var(--text-dim);transition:color .2s,transform .2s;position:absolute;top:24px;right:24px}.link-card:hover .link-card__arrow{color:var(--accent);transform:translate(2px,-2px)}@media (width<=720px){.link-grid{grid-template-columns:1fr}}.footer{border-top:1px solid var(--border);padding-block:32px}.footer__inner{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;display:flex}.footer__brand{color:var(--text-muted);font-size:14px}.footer__brand strong{color:var(--text);font-weight:700}.footer__note{color:var(--text-dim);font-size:13px}