:root{--bg:#030807;--panel:#07100e;--line:#21332e;--fg:#edf4f1;--muted:#8b9a95;--green:#4dffbd}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--bg);color:var(--fg);font-family:ui-monospace,SFMono-Regular,Menlo,Monaco,Consolas,"Liberation Mono","Noto Sans JP",monospace;line-height:1.8}body:before{content:"";position:fixed;inset:0;pointer-events:none;background:linear-gradient(rgba(77,255,189,.025) 1px,transparent 1px),linear-gradient(90deg,rgba(77,255,189,.02) 1px,transparent 1px);background-size:40px 40px;mask-image:linear-gradient(to bottom,black,transparent 70%)}a{color:inherit;text-decoration:none}header{height:78px;max-width:1440px;margin:auto;padding:0 4vw;display:flex;align-items:center;gap:50px;border-bottom:1px solid var(--line);position:sticky;top:0;background:rgba(3,8,7,.9);backdrop-filter:blur(14px);z-index:10}.logo{margin-right:auto}.logo img,footer img{width:125px;filter:invert(1) brightness(3)}nav{display:flex;gap:28px;font-size:12px}nav a:hover,.prompt,.sect span,.pagehero p,.label{color:var(--green)}.contact-link{border:1px solid var(--green);padding:9px 18px;font-size:12px}.menu{display:none;background:none;color:white;border:1px solid var(--line)}main{max-width:1440px;margin:auto;padding:0 4vw}.hero{min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;align-items:center;gap:6vw;border-bottom:1px solid var(--line)}.hero h1{font-family:system-ui,"Noto Sans JP",sans-serif;font-size:clamp(38px,5vw,72px);line-height:1.4;letter-spacing:.04em;margin:.3em 0}.hero>div>p:not(.prompt){max-width:620px;color:#bdc8c4}.prompt,.pagehero p{letter-spacing:.12em}.cursor{animation:blink 1s infinite}@keyframes blink{50%{opacity:0}}.actions{display:flex;gap:18px;margin-top:36px}.actions a,.more{display:inline-block;border:1px solid var(--line);padding:12px 20px}.actions a:first-child,.more:hover{border-color:var(--green);color:var(--green)}.terminal{min-height:420px;border:1px solid var(--line);padding:28px;position:relative;overflow:hidden;background:radial-gradient(circle at 60% 50%,rgba(77,255,189,.08),transparent 45%)}.terminal pre{color:var(--green);margin-top:30px}.orb{width:300px;height:300px;border:1px solid #45635a;border-radius:50%;position:absolute;right:-30px;bottom:-40px;box-shadow:0 0 80px rgba(77,255,189,.08),inset 0 0 50px rgba(77,255,189,.05)}.orb:after,.orb:before{content:"";position:absolute;inset:20%;border:1px dashed #385249;border-radius:50%;transform:rotate(55deg)}.orb:before{inset:5% 35%;transform:rotate(25deg)}section{padding:78px 0;border-bottom:1px solid var(--line)}.sect{display:grid;grid-template-columns:90px 1fr auto;align-items:end;margin-bottom:32px}.sect h2,.pagehero h1{font-size:32px;letter-spacing:.12em;margin:0}.sect small{color:var(--muted)}.service-grid{display:grid;grid-template-columns:repeat(4,1fr)}.service-grid article{padding:25px 24px;border-left:1px solid var(--line)}.service-grid article:last-child{border-right:1px solid var(--line)}.service-grid b{font-size:11px}.service-grid h3{font-size:17px;letter-spacing:.05em}.service-grid em{font-style:normal;color:#cbd5d1;font-size:13px}.service-grid p,.work-card p{color:var(--muted);font-size:14px}.works-grid{display:grid;grid-template-columns:repeat(2,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.work-card{padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line);min-height:260px;transition:.2s}.work-card:hover{background:#07110e;box-shadow:inset 3px 0 var(--green)}.work-card>span{color:var(--green);font-size:11px}.work-card h3{font-size:19px}.work-card code{border:1px solid var(--line);padding:3px 7px;font-size:10px;color:#aab8b3}.work-card strong{display:block;margin-top:24px;font-size:11px;color:var(--green)}.more{margin-top:28px}.about-home{display:grid;grid-template-columns:1fr 1fr;gap:50px}.about-home h3{font-family:system-ui,sans-serif;font-size:30px}.about-home dl{display:grid;grid-template-columns:repeat(3,1fr);align-items:center}.about-home dl div{text-align:center;border-left:1px solid var(--line)}dt{color:var(--muted);font-size:12px}dd{margin:0}.about-home dt{font-size:30px;color:white}.pagehero{padding:100px 0 60px}.pagehero h1{font-size:clamp(38px,7vw,80px)}.pagehero span{color:var(--muted)}.project{display:grid;grid-template-columns:1fr 1fr;gap:70px}.project h2{font-size:32px}.project>div>p:last-child{color:#b7c3bf}.project dl div,.company dl div{display:grid;grid-template-columns:200px 1fr;padding:18px 0;border-bottom:1px solid var(--line)}.company{max-width:900px}.news a{display:grid;grid-template-columns:160px 1fr 30px;padding:20px;border-bottom:1px solid var(--line)}.news time{color:var(--green)}form{max-width:800px;margin:auto;border:1px solid var(--line);padding:35px}label{display:block;color:var(--green);font-size:12px;margin-bottom:22px}input,textarea{display:block;width:100%;margin-top:8px;background:#050b09;border:1px solid var(--line);color:white;padding:14px;font:inherit}textarea{min-height:160px}button{background:transparent;border:1px solid var(--green);color:var(--green);padding:13px 22px;font:inherit}.legal{max-width:850px;min-height:380px}.legal p{color:#b7c3bf}.company h2{letter-spacing:.1em}footer{max-width:1440px;margin:auto;padding:45px 4vw;display:grid;grid-template-columns:1fr 1fr auto;gap:20px;align-items:center;color:var(--muted);font-size:11px;border-top:1px solid var(--line)}footer p{letter-spacing:.12em}@media(max-width:850px){header nav,.contact-link{display:none}.menu{display:block}.hero{grid-template-columns:1fr;padding:70px 0}.terminal{min-height:300px}.service-grid{grid-template-columns:1fr}.service-grid article{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.works-grid{grid-template-columns:1fr}.sect{grid-template-columns:60px 1fr}.sect small{display:none}.about-home,.project{grid-template-columns:1fr}.about-home dl{grid-template-columns:repeat(3,1fr)}footer{grid-template-columns:1fr}.project dl div,.company dl div{grid-template-columns:1fr}.news a{grid-template-columns:110px 1fr 20px}}

/* ---------- developer-code ambient background ---------- */
body{position:relative;isolation:isolate}
body::before{z-index:-2}
body::after{content:"";position:fixed;inset:78px 0 0;z-index:-1;pointer-events:none;opacity:.22;background-image:url("images/code-grid.svg");background-size:1440px auto;background-position:top center;background-repeat:repeat-y;mix-blend-mode:screen;mask-image:linear-gradient(to bottom,rgba(0,0,0,.9),rgba(0,0,0,.45) 62%,transparent)}
main,footer{position:relative}
section{position:relative}
section::after{content:"{ }  </>  01  ::  $_";position:absolute;right:0;top:22px;color:rgba(77,255,189,.10);font-size:10px;letter-spacing:.22em;pointer-events:none}
@media(max-width:850px){body::after{opacity:.13;background-size:1000px auto}section::after{display:none}}

/* ---------- contact result states ---------- */
.form-alert{max-width:800px;margin:0 auto 22px;padding:14px 16px;border:1px solid var(--line);font-size:13px}
.form-alert.success{border-color:var(--green);color:var(--green);background:rgba(77,255,189,.04)}
.form-alert.error{border-color:#ff6b6b;color:#ff9b9b;background:rgba(255,107,107,.04)}
.hp-field{position:absolute!important;left:-9999px!important;width:1px!important;height:1px!important;overflow:hidden!important}

/* ---------- scroll motion / terminal dynamics ---------- */
:root{--scroll-y:0px;--scroll-progress:0%}
body::after{background-position:center calc(var(--scroll-y) * -.035);transition:opacity .25s ease}
header::after{content:"";position:absolute;left:0;bottom:-1px;height:1px;width:var(--scroll-progress);background:var(--green);box-shadow:0 0 10px rgba(77,255,189,.55);pointer-events:none}
.reveal{opacity:0;transform:translateY(24px);filter:blur(3px);transition:opacity .7s cubic-bezier(.2,.7,.2,1),transform .7s cubic-bezier(.2,.7,.2,1),filter .7s ease;transition-delay:var(--reveal-delay,0ms)}
.reveal.is-visible{opacity:1;transform:none;filter:none}
.service-grid article.reveal,.work-card.reveal{transform:translateY(18px) scale(.985)}
.service-grid article.reveal.is-visible,.work-card.reveal.is-visible{transform:none}
.work-card{position:relative;overflow:hidden}
.work-card::after{content:"";position:absolute;left:-35%;top:0;width:22%;height:1px;background:linear-gradient(90deg,transparent,var(--green),transparent);opacity:0}
.work-card.is-visible::after{animation:terminal-scan 1.1s ease .25s 1}
@keyframes terminal-scan{0%{left:-35%;opacity:0}20%{opacity:.8}100%{left:115%;opacity:0}}
.terminal{transition:transform .35s ease,border-color .35s ease,box-shadow .35s ease}
.hero:hover .terminal{border-color:#315247;box-shadow:0 18px 70px rgba(0,0,0,.28),inset 0 0 45px rgba(77,255,189,.025)}
.orb{animation:orb-float 7s ease-in-out infinite}
.orb::after{animation:orb-spin 18s linear infinite}
.orb::before{animation:orb-spin-reverse 13s linear infinite}
@keyframes orb-float{50%{transform:translateY(-12px)}}
@keyframes orb-spin{to{transform:rotate(415deg)}}
@keyframes orb-spin-reverse{to{transform:rotate(-335deg)}}
.sect span{display:inline-block}.sect.is-visible span{animation:prompt-flash .55s steps(2,end) 2}
@keyframes prompt-flash{50%{opacity:.25}}
@media(prefers-reduced-motion:reduce){.reveal,.reveal.is-visible{opacity:1;transform:none;filter:none;transition:none}.orb,.orb::before,.orb::after,.work-card.is-visible::after,.sect.is-visible span{animation:none!important}body::after{background-position:top center}}

/* v4: WORKS imagery + NEWS detail */
.work-thumb{width:100%;aspect-ratio:2.7/1;object-fit:cover;display:block;margin:-1px -1px 18px;width:calc(100% + 2px);max-width:none;border-bottom:1px solid var(--line);filter:saturate(.78) contrast(1.08);transition:filter .35s ease,transform .45s cubic-bezier(.2,.8,.2,1)}
.work-card{overflow:hidden}
.work-card:hover .work-thumb{filter:saturate(1) contrast(1.12) brightness(1.08);transform:scale(1.018)}
.news-article{max-width:900px;margin:0 auto;min-height:46vh}
.news-article h2{font-size:clamp(1.7rem,4vw,3rem);margin:.45em 0;color:var(--white)}
.news-article>p:not(.prompt){font-size:1.05rem;line-height:2.1;max-width:760px}
.article-line{height:1px;background:linear-gradient(90deg,var(--green),var(--line),transparent);margin:28px 0 36px}
@media(max-width:700px){.work-thumb{aspect-ratio:16/7;margin-bottom:14px}.news-article{min-height:38vh}}
.news-article .article-body{max-width:780px}
.news-article .article-body p{font-size:1.05rem;line-height:2.15;margin:0 0 1.65em}
.news-article .article-body .lead{font-size:1.12rem;color:var(--white)}
.news-article .article-body .philosophy-quote{margin:2rem 0;padding:1.25rem 1.5rem;border-left:2px solid var(--green);background:rgba(73,255,185,.035);font-size:clamp(1.15rem,2.2vw,1.45rem);line-height:1.8;color:var(--white);font-weight:600}
.news-article .article-body h3{margin:2.6rem 0 1rem;font-size:1.2rem;color:var(--green);font-family:var(--mono);font-weight:500;letter-spacing:.04em}
.news-article .article-body h3::before{content:"> ";opacity:.8}
.news-article .article-sign{margin-top:3rem;padding-top:1.5rem;border-top:1px solid var(--line);color:var(--muted)}

.news .news-static{display:grid;grid-template-columns:130px 1fr 24px;gap:20px;align-items:center;padding:18px 0;border-bottom:1px solid var(--line);color:var(--fg)}
.news .news-static time{font-family:var(--mono);color:var(--muted);font-size:.78rem}
.news .news-static b{font-weight:500}
@media(max-width:700px){.news .news-static{grid-template-columns:100px 1fr;gap:12px}.news .news-static span{display:none}}

/* NEWS: linked/non-linked rows share the same time + row styling */
.news > a,
.news > .news-static{
  display:grid;
  grid-template-columns:160px 1fr 30px;
  gap:0;
  align-items:center;
  padding:20px;
  border-bottom:1px solid var(--line);
}
.news > a time,
.news > .news-static time{
  color:var(--green);
  font-family:inherit;
  font-size:inherit;
}
.news > .news-static b{font-weight:700}
@media(max-width:850px){
  .news > a,
  .news > .news-static{grid-template-columns:110px 1fr 20px}
}

/* Privacy policy readability */
.privacy-policy h2{margin-top:3.2rem;margin-bottom:1.1rem;color:var(--green,#55ff9a);font-size:1.15rem;letter-spacing:.04em}.privacy-policy h3{margin-top:1.8rem;margin-bottom:.8rem;font-size:1rem}.privacy-policy p,.privacy-policy li{line-height:2}.privacy-policy ul,.privacy-policy ol{margin:1rem 0 1.6rem;padding-left:1.6rem}.privacy-policy li{margin:.25rem 0}.privacy-policy a{color:var(--green,#55ff9a);text-decoration:underline;text-underline-offset:3px}.privacy-policy .legal-date{margin-top:3rem;text-align:right;opacity:.75}

/* Commerce table */
.commerce-policy{max-width:1050px}.commerce-table-wrap{margin-top:28px;border:1px solid var(--line);overflow-x:auto;background:rgba(5,11,9,.62)}.commerce-table{width:100%;border-collapse:collapse;min-width:680px}.commerce-table th,.commerce-table td{padding:20px 22px;border-bottom:1px solid var(--line);vertical-align:top;text-align:left}.commerce-table tr:last-child th,.commerce-table tr:last-child td{border-bottom:0}.commerce-table th{width:220px;color:var(--green);font-size:12px;font-weight:600;letter-spacing:.05em;background:rgba(77,255,189,.025)}.commerce-table td{color:#c8d3cf;font-size:14px}.commerce-table a{color:var(--green);text-decoration:underline;text-underline-offset:4px}.commerce-table .note{color:var(--muted);font-size:12px}@media(max-width:850px){.commerce-table{min-width:0}.commerce-table th,.commerce-table td{display:block;width:100%;padding:14px 16px}.commerce-table th{border-bottom:0;padding-bottom:5px}.commerce-table td{padding-top:5px}.commerce-table tr{display:block;border-bottom:1px solid var(--line)}.commerce-table tr:last-child{border-bottom:0}}

.harassment-policy{max-width:900px;padding-bottom:80px}.harassment-policy>h1{font-family:system-ui,"Noto Sans JP",sans-serif;font-size:clamp(24px,3vw,36px);line-height:1.5;margin:0 0 18px}.harassment-policy .policy-meta{border-left:2px solid var(--green);padding:10px 18px;margin:0 0 48px;background:rgba(77,255,189,.025)}.harassment-policy .policy-meta p{margin:2px 0;color:#d9e3df}.harassment-policy h2{margin:52px 0 18px;color:var(--green);font-size:19px;letter-spacing:.04em}.harassment-policy p,.harassment-policy li{color:#b7c3bf;line-height:2}.harassment-policy ul{padding-left:1.5rem;margin:18px 0 30px}.harassment-policy li{margin:7px 0}.harassment-policy li::marker{color:var(--green)}.harassment-policy .note{font-size:12px;color:var(--muted);border-top:1px solid var(--line);padding-top:14px}.harassment-policy .policy-end{text-align:right;margin-top:48px;color:var(--fg)}


/* v4.8 homepage sequential typing */
.hero .hero-type{visibility:hidden}
.hero .hero-type.typing-active{visibility:visible}
.hero .type-caret{display:inline-block;color:var(--green);font-family:var(--mono);font-weight:400;animation:type-caret-blink .72s steps(1,end) infinite}
.hero .hero-type.typing-done .type-caret{display:none}
.hero .prompt .cursor{display:inline-block}
.hero .prompt.typing-done .cursor{animation:blink 1s step-end infinite}
@keyframes type-caret-blink{50%{opacity:0}}
@media(prefers-reduced-motion:reduce){.hero .hero-type{visibility:visible}.hero .type-caret{display:none}}

/* Contact required confirmation */
#contact-form .contact-consent{display:flex;align-items:center;gap:.75rem;margin:1.25rem 0 1.5rem;cursor:pointer;line-height:1.6}
#contact-form .contact-consent input[type="checkbox"]{width:1.15rem;height:1.15rem;min-width:1.15rem;margin:0;accent-color:var(--green,#55ff9a)}
#contact-form .contact-consent span{font-size:.92rem}

/* Contact consent checkbox alignment fix */
#contact-form label.contact-consent{
  display:inline-flex;
  align-items:center;
  justify-content:flex-start;
  gap:10px;
  width:auto;
  margin:1.25rem 0 1.5rem;
  color:var(--green);
  cursor:pointer;
}
#contact-form label.contact-consent input[type="checkbox"]{
  display:inline-block;
  flex:0 0 18px;
  width:18px;
  height:18px;
  min-width:18px;
  margin:0;
  padding:0;
  vertical-align:middle;
}
#contact-form label.contact-consent span{
  display:inline-block;
  margin:0;
  line-height:18px;
  font-size:.92rem;
}

/* Contact actions: consent and submit on separate centered rows */
#contact-form label.contact-consent{
  display:flex;
  width:max-content;
  max-width:100%;
  margin:1.5rem auto 1.75rem;
  align-items:center;
  justify-content:center;
}
#contact-form > button[type="submit"]{
  display:block;
  width:max-content;
  margin:0 auto;
}
