@import url('https://fonts.googleapis.com/css2?family=Inter:wght@400;500;600&family=Noto+Sans+JP:wght@400;500&display=swap');
:root{--bg:#080809;--text:#f5f5f5;--muted:#85858b;--dim:#55555b;--line:rgba(255,255,255,.09);--card:rgba(255,255,255,.035)}
*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--text);font-family:Inter,"Noto Sans JP",sans-serif;min-height:100vh}
a{color:inherit}.wrap{width:min(100% - 36px,900px);margin:auto}.ambient{position:fixed;inset:-30%;z-index:-1;pointer-events:none;background:radial-gradient(circle at 30% 15%,rgba(255,255,255,.07),transparent 25%),radial-gradient(circle at 80% 80%,rgba(120,120,150,.06),transparent 28%)}
.nav{height:82px;display:flex;align-items:center;justify-content:space-between}.brand{text-decoration:none;font-weight:600;letter-spacing:-.04em}.brand span,h1 span{color:#777}
nav{display:flex;gap:22px}nav a{text-decoration:none;color:#666;font-size:11px;letter-spacing:.08em;transition:.2s}nav a:hover,nav a.active{color:#fff}
.hero{padding:110px 0 125px;text-align:center}.avatar{width:76px;height:76px;margin:0 auto 25px;border:1px solid var(--line);border-radius:50%;display:grid;place-items:center;background:rgba(255,255,255,.03);font-size:24px}.eyebrow{font-size:10px;letter-spacing:.18em;color:#666;margin:0 0 14px}.hero h1,.page-title h1{font-size:clamp(45px,9vw,75px);font-weight:500;letter-spacing:-.06em;margin:0}.lead{color:#aaa;line-height:2;margin:25px 0 28px;font-size:14px}.hero-links{display:flex;justify-content:center;gap:20px}.hero-links a{font-size:11px;color:#999;text-decoration:none;border-bottom:1px solid #333;padding-bottom:4px}.hero-links a:hover{color:#fff;border-color:#fff}
.section{margin-bottom:90px}.section-head{display:flex;align-items:center;gap:12px;margin-bottom:16px}.section-head span{color:#555;font-size:10px}.section-head h2{font-size:12px;text-transform:uppercase;letter-spacing:.15em;font-weight:500;margin:0;color:#aaa}
.grid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}.card{min-height:145px;padding:18px;border:1px solid var(--line);border-radius:17px;background:var(--card);text-decoration:none;display:flex;flex-direction:column;justify-content:space-between;transition:.25s}.card:hover,.feature:hover{transform:translateY(-3px);border-color:rgba(255,255,255,.18);background:rgba(255,255,255,.06)}.icon{font-size:20px;color:#aaa}.card b{display:block;font-size:13px;font-weight:500}.card small{display:block;color:#666;font-size:10px;margin-top:5px}.card i{align-self:flex-end;color:#555;font-style:normal}.panel,.feature{border:1px solid var(--line);border-radius:17px;background:var(--card);padding:25px}.panel p{color:#aaa;font-size:13px;line-height:2}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:20px}.tags span,.status{font-size:9px;color:#777;border:1px solid var(--line);border-radius:7px;padding:5px 8px}.feature{display:flex;justify-content:space-between;text-decoration:none;transition:.25s}.feature small{font-size:9px;color:#666;letter-spacing:.15em}.feature h3{margin:8px 0;font-size:17px;font-weight:500}.feature p{margin:0;color:#777;font-size:12px}.feature strong{color:#666}
.page{padding:80px 0 80px}.page-title{padding:40px 0 80px}.page-title>p:last-child{color:#777;font-size:13px;margin-top:18px}.works-list{display:flex;flex-direction:column;gap:12px}.work{display:grid;grid-template-columns:60px 1fr;gap:10px;padding:25px;border:1px solid var(--line);border-radius:17px;background:var(--card)}.work-no{color:#555;font-size:11px}.work h2{font-size:20px;font-weight:500;margin:12px 0 8px}.work p{color:#888;font-size:13px;line-height:1.9;margin:0}.about-page{max-width:680px}.about-page .big{font-size:48px;letter-spacing:-.05em;margin:0 0 25px}.about-page>p:not(.big){color:#999;line-height:2;font-size:14px}.about-meta{margin-top:55px;border-top:1px solid var(--line)}.about-meta>div{padding:20px 0;border-bottom:1px solid var(--line)}.about-meta small{color:#555;font-size:9px;letter-spacing:.15em}.about-meta p{margin:8px 0 0;color:#999;font-size:12px}
.footer{border-top:1px solid var(--line);padding:22px 0 35px;display:flex;justify-content:space-between;color:#444;font-size:9px}.footer a{text-decoration:none}
.reveal{animation:up .7s ease both}@keyframes up{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@media(max-width:650px){.wrap{width:min(100% - 28px,900px)}.nav{height:70px}.hero{padding:85px 0 100px}.grid{grid-template-columns:1fr}.card{min-height:78px;display:grid;grid-template-columns:40px 1fr 20px;align-items:center}.page{padding-top:50px}.page-title{padding-bottom:55px}.work{grid-template-columns:40px 1fr}.footer{font-size:8px}}

.error-page{min-height:75vh;display:flex;flex-direction:column;align-items:flex-start;justify-content:center}.error-page h1{font-size:clamp(55px,10vw,90px);font-weight:500;letter-spacing:-.06em;margin:0}.error-page p:not(.eyebrow){color:#777;font-size:13px;margin:18px 0 25px}.back{color:#aaa;text-decoration:none;font-size:11px;border-bottom:1px solid #333;padding-bottom:5px}.back:hover{color:#fff;border-color:#fff}