body{margin:0;background:#0B0C0E}
a{color:#ECEDE8}a:hover{color:#C8F53C}
.nav-links{display:flex}
.menu-btn{display:none}
@media (max-width:860px){.nav-links{display:none}.menu-btn{display:flex}}
@media (max-width:760px){.hdr-cta{display:none !important}}
.cursor{position:fixed;left:0;top:0;width:44px;height:44px;margin:-22px 0 0 -22px;border-radius:50%;background:var(--acc);mix-blend-mode:difference;pointer-events:none;z-index:90;translate:var(--cx,-200px) var(--cy,-200px);scale:.3;transition:translate .14s ease-out,scale .35s cubic-bezier(.2,.7,.1,1)}
.root:has(a:hover) .cursor,.root:has(button:hover) .cursor{scale:1.7}
@media (hover:none){.cursor{display:none}}
.ch{display:inline-block;animation:ch-in 1s cubic-bezier(.2,.8,.1,1) both}
@keyframes ch-in{from{opacity:0;translate:0 .6em;rotate:8deg;filter:blur(10px)}to{opacity:1;translate:0 0;rotate:0deg;filter:blur(0)}}
.fade-in{animation:fade-in 1s cubic-bezier(.2,.8,.1,1) both}
@keyframes fade-in{from{opacity:0;translate:0 24px}to{opacity:1;translate:0 0}}
.blink{animation:blink 1.2s steps(1) infinite}
@keyframes blink{50%{opacity:0}}
.toc{position:static}
@media (min-width:1080px){.toc{position:sticky;top:120px}}
.toc a{transition:color .25s ease,padding-left .35s cubic-bezier(.2,.7,.1,1)}
.toc a:hover{color:var(--acc);padding-left:8px}
.art{scroll-margin-top:110px}
.art ul{margin:0;padding:0;list-style:none;display:flex;flex-direction:column;gap:10px}
.art li{position:relative;padding-left:22px}
.art li::before{content:"";position:absolute;left:2px;top:.95em;width:8px;height:1.5px;background:var(--acc)}
.tbd{display:inline-block;border:1px dashed #5A5F66;border-radius:8px;padding:0 8px;color:#9A9EA6}
/* footer neon */
.nl{stroke-dasharray:3000 3000;stroke-dashoffset:3000;animation-duration:7.5s;animation-timing-function:linear;animation-iteration-count:infinite}
.d0{animation-name:d0}.d1{animation-name:d1}.d2{animation-name:d2}.d3{animation-name:d3}.d4{animation-name:d4}.d5{animation-name:d5}.d6{animation-name:d6}.d7{animation-name:d7}.d8{animation-name:d8}.d9{animation-name:d9}.d10{animation-name:d10}
@keyframes d0{0%{stroke-dashoffset:3000;opacity:1}12%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d1{0%,4%{stroke-dashoffset:3000;opacity:1}16%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d2{0%,8%{stroke-dashoffset:3000;opacity:1}20%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d3{0%,12%{stroke-dashoffset:3000;opacity:1}24%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d4{0%,16%{stroke-dashoffset:3000;opacity:1}28%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d5{0%,20%{stroke-dashoffset:3000;opacity:1}32%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d6{0%,24%{stroke-dashoffset:3000;opacity:1}36%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d7{0%,28%{stroke-dashoffset:3000;opacity:1}40%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d8{0%,32%{stroke-dashoffset:3000;opacity:1}44%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d9{0%,36%{stroke-dashoffset:3000;opacity:1}48%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
@keyframes d10{0%,40%{stroke-dashoffset:3000;opacity:1}52%,92%{stroke-dashoffset:0;opacity:1}100%{stroke-dashoffset:0;opacity:0}}
.neon-full{opacity:0;animation:neon-on 7.5s linear infinite}
@keyframes neon-on{0%,52%{opacity:0}53%{opacity:.9}54%{opacity:.15}55.5%{opacity:1}56.5%{opacity:.4}58%,92%{opacity:1}100%{opacity:0}}
.menu-ov{animation:mo-in .55s cubic-bezier(.8,0,.2,1) both}
@keyframes mo-in{from{clip-path:inset(0 0 100% 0)}to{clip-path:inset(0 0 0 0)}}
.mo-link{animation:mo-link .6s cubic-bezier(.2,.8,.1,1) both}
@keyframes mo-link{from{opacity:0;translate:0 40px}to{opacity:1;translate:0 0}}
.progress{position:fixed;top:0;left:0;right:0;height:3px;transform:scaleX(0);transform-origin:left;z-index:30}
.sr-line{transform-origin:left}
@supports (animation-timeline: view()){
@media (prefers-reduced-motion:no-preference){
.sr{animation:sr-up linear both;animation-timeline:view();animation-range:entry 5% entry 60%}
.sr-line{animation:sr-line linear both;animation-timeline:view();animation-range:entry 0% entry 100%}
.progress{animation:progress linear both;animation-timeline:scroll(root)}
.hdr{animation:hdr linear both;animation-timeline:scroll(root);animation-range:0px 240px}
}
}
@keyframes sr-up{from{opacity:0;translate:0 40px}to{opacity:1;translate:0 0}}
@keyframes sr-line{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes progress{from{transform:scaleX(0)}to{transform:scaleX(1)}}
@keyframes hdr{from{background:rgba(11,12,14,0)}to{background:rgba(11,12,14,.86);backdrop-filter:blur(14px);border-bottom-color:#26292E}}
@media (prefers-reduced-motion:reduce){.ch,.fade-in,.blink,.nl,.neon-full{animation:none !important}.nl{stroke-dashoffset:0}.neon-full{opacity:1}}

/* ---------- JP line breaking (phrase-aware, mobile) ---------- */
.root{word-break:auto-phrase;line-break:strict;overflow-wrap:break-word}
.root p{text-wrap:pretty}
.w{display:inline-block}
.sp-br{display:none}
@media (max-width:600px){.pc-br{display:none}.sp-br{display:inline}}
