:root { --ink:#171922; --muted:#60636c; --line:#dfe2e8; --paper:#fcfcfa; --font:Inter,"Noto Sans JP","Hiragino Sans",sans-serif; }
* { box-sizing:border-box; }
html { scroll-behavior:smooth; scroll-padding-top:80px; }
body { margin:0; background:var(--paper); color:var(--ink); font:400 16px/1.8 var(--font); -webkit-font-smoothing:antialiased; }
a { color:inherit; text-underline-offset:4px; }
button,a { -webkit-tap-highlight-color:transparent; }
svg { width:22px; height:22px; fill:none; stroke:currentColor; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; flex-shrink:0; }
img { display:block; max-width:100%; }
::selection { background:#c9d6fa; color:#111; }
:focus-visible { outline:2px solid #171922; outline-offset:5px; }
.skip-link { position:fixed; z-index:99; top:10px; left:10px; padding:10px; background:white; transform:translateY(-180%); }
.skip-link:focus { transform:none; }
.site-nav { position:absolute; z-index:10; inset:0 0 auto; max-width:1440px; min-height:88px; margin:0 auto; padding:22px 48px; display:flex; align-items:center; justify-content:space-between; gap:24px; }
.brand { display:inline-flex; align-items:center; gap:10px; color:#171922; font-size:22px; font-weight:650; letter-spacing:-.04em; line-height:1; text-decoration:none; }
.brand img { width:31px; height:31px; }
.brand-copy { display:flex; align-items:baseline; gap:7px; white-space:nowrap; }
.brand-copy strong { font-size:20px; font-weight:650; letter-spacing:-.04em; }
.brand-copy small { color:#51586a; font-size:9px; font-weight:600; letter-spacing:.02em; }
.brand-turbo { color:#7056f5; }
.site-nav nav { display:flex; align-items:center; gap:30px; font-size:14px; }
.site-nav nav a { text-decoration:none; }
.nav-about:hover { text-decoration:underline; }
.nav-join { display:flex; align-items:center; gap:12px; padding:10px 19px; border-radius:999px; color:white; background:#171922; font-weight:500; transition:background .2s; }
.nav-join:hover { background:#35394a; }
.nav-join svg { width:16px; height:16px; }
.hero { position:relative; isolation:isolate; display:grid; align-items:center; min-height:max(780px,100svh); overflow:hidden; background:#cbd8f7; }
.hero-atmosphere { position:absolute; inset:0; z-index:-1; overflow:hidden; pointer-events:none; background:radial-gradient(ellipse at 48% 42%,#e5e9fc 0%,#d0dcf8 35%,#bac9ef 75%); }
.light-field { position:absolute; inset:-18%; transform-origin:center; filter:blur(30px); will-change:transform; }
.light-field-blue { background:radial-gradient(ellipse 33% 42% at 25% 40%,#5777ed 0%,#7694f1 42%,transparent 76%),radial-gradient(ellipse at 72% 88%,#779bdf 0%,transparent 40%); animation:light-blue-drift 9s ease-in-out -4s infinite; }
.light-field-violet { background:radial-gradient(ellipse 35% 28% at 74% 34%,#8370dd 0%,#a196ed 40%,transparent 77%),radial-gradient(ellipse at 28% 88%,#adb4f4 0%,transparent 36%); animation:light-violet-drift 11s ease-in-out -7s infinite; }
.light-field-pearl { inset:-30%; background:radial-gradient(ellipse at 47% 42%,#f0f3ffa6 0%,#edf0ff50 18%,transparent 40%),linear-gradient(125deg,transparent 29%,#e4edffb8 41%,#eaf0ffe0 48%,transparent 61%); animation:light-pearl-drift 8s ease-in-out -2s infinite; }
.light-grain { position:absolute; inset:0; opacity:.12; background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23000' filter='url(%23n)' opacity='.5' d='M0 0h180v180H0z'/%3E%3C/svg%3E"); }
.hero-inner { width:100%; max-width:1100px; margin:auto; padding:133px 32px 120px; }
.hero-copy { text-align:center; }
.hero-emblem { width:76px; height:76px; display:grid; place-items:center; margin:0 auto 23px; border:1px solid #ffffffcf; border-radius:22px; background:linear-gradient(145deg,#fffffff5,#eef0ffc2); box-shadow:0 10px 24px #41457915,inset 0 1px 0 white; }
.hero-emblem img { width:44px; height:44px; }
.launch-label { margin:0 0 25px; color:#42495e; font-size:10px; font-weight:500; letter-spacing:.18em; }
h1 { margin:0; color:#121621; font-size:clamp(44px,5.65vw,78px); font-weight:700; line-height:1.4; letter-spacing:-.04em; }
.hero-description { margin:25px 0 30px; color:#353d51; font-size:18px; }
.hero-actions { display:flex; justify-content:center; align-items:center; flex-wrap:wrap; gap:12px; }
.primary-button,.secondary-button { min-height:52px; display:inline-flex; align-items:center; justify-content:center; gap:15px; padding:12px 24px; border-radius:999px; font-size:14px; font-weight:500; text-decoration:none; transition:background .2s,transform .2s; }
.primary-button { color:white; background:#171922; }
.primary-button:hover { background:#35394a; }
.secondary-button { border:1px solid #ffffff90; background:#ffffff57; }
.secondary-button:hover { background:#ffffffa3; }
.secondary-button svg { transform:rotate(90deg); }
.primary-button:hover svg { transform:translateX(2px); }
.secondary-button:hover svg { transform:rotate(90deg) translateX(2px); }
.hero-actions svg,.closing svg { width:17px; height:17px; transition:transform .2s; }
.model-bar { display:flex; justify-content:center; margin-top:46px; }
.model-names { display:flex; align-items:center; justify-content:center; gap:26px; flex-wrap:wrap; }
.model-names > span { display:flex; align-items:center; gap:9px; color:#424a5e; font-size:13px; }
.model-names b { display:grid; place-items:center; width:21px; height:21px; font-size:17px; font-weight:600; }
.model-names .and-more { color:#515a70; font-size:11px; }
.hero-foot { position:absolute; inset:auto 48px 30px; display:flex; }
.explore-link { display:inline-flex; align-items:center; gap:24px; color:#3d465a; font-size:12px; text-decoration:none; }
.explore-link span { font-size:19px; transition:transform .2s; }
.explore-link:hover span { transform:translateY(4px); }
.section-wrap { max-width:1200px; margin:0 auto; padding:120px 48px; }
.section-label { margin:0 0 32px; color:#697078; font-size:10px; letter-spacing:.12em; }
.section-label span { display:block; margin-top:8px; font-size:12px; letter-spacing:0; }
.waitlist-section { background:#171922; color:white; }
.waitlist-inner { display:grid; grid-template-columns:1.05fr .95fr; gap:80px; align-items:center; padding-block:86px; }
.waitlist-copy .section-label { color:#aeb4c5; }
.waitlist-copy h2 { margin:0; font-size:clamp(32px,3.6vw,50px); font-weight:500; line-height:1.45; letter-spacing:-.05em; }
.waitlist-copy > p:last-child { margin:22px 0 0; color:#b9becb; font-size:14px; }
.waitlist-form { padding:28px; border:1px solid #ffffff1c; border-radius:24px; background:#ffffff0b; }
.waitlist-form > label { display:block; margin-bottom:9px; color:#d9dce5; font-size:12px; }
.waitlist-fields { display:flex; gap:10px; }
.waitlist-fields input { min-width:0; flex:1; height:52px; padding:0 17px; border:1px solid #ffffff26; border-radius:13px; color:white; background:#0f1118; font:inherit; font-size:14px; outline:none; }
.waitlist-fields input::placeholder { color:#747a89; }
.waitlist-fields input:focus { border-color:#9b86ff; box-shadow:0 0 0 3px #7b61ff2e; }
.waitlist-fields button { min-height:52px; padding:0 20px; border:0; border-radius:13px; color:#16131f; background:#a78bfa; font:600 13px/1 var(--font); white-space:nowrap; cursor:pointer; transition:background .2s,transform .2s; }
.waitlist-fields button:hover { background:#b9a4ff; transform:translateY(-1px); }
.waitlist-fields button:disabled { cursor:wait; opacity:.65; transform:none; }
.waitlist-note,.waitlist-status { margin:12px 0 0; color:#9096a6; font-size:11px; line-height:1.6; }
.waitlist-status { min-height:18px; }
.waitlist-status[data-state="success"] { color:#a7f3d0; }
.waitlist-status[data-state="error"] { color:#fda4af; }
.waitlist-trap { position:absolute; left:-10000px; width:1px; height:1px; overflow:hidden; }
.demo-section { background:radial-gradient(ellipse at 75% 20%,#eef0ff 0,transparent 38%),#fcfcfa; }
.demo-heading { display:flex; justify-content:space-between; align-items:end; gap:48px; margin-bottom:52px; }
.demo-heading .section-label { margin:0; }
.demo-heading h2 { margin:0; max-width:620px; color:#171922; font-size:clamp(34px,4vw,56px); font-weight:500; line-height:1.45; letter-spacing:-.055em; }
.demo-frame { overflow:hidden; margin:0; padding:14px; border:1px solid white; border-radius:30px; background:#ffffff78; box-shadow:0 28px 70px #20374515,inset 0 1px 0 white; }
.demo-chrome { height:40px; display:flex; align-items:center; gap:7px; padding:0 10px; color:#76808c; font-size:11px; }
.demo-chrome i { width:8px; height:8px; border-radius:50%; background:#b8bec8; }
.demo-chrome span { margin-left:auto; margin-right:auto; transform:translateX(-22px); }
.demo-frame video { width:100%; display:block; aspect-ratio:16/9; object-fit:cover; border:1px solid #ffffff7a; border-radius:18px; background:#111; }
.demo-frame figcaption { padding:14px 8px 2px; color:#697078; font-size:13px; text-align:center; }
.manifesto { background:#fcfcfa; }
.manifesto-inner { display:grid; grid-template-columns:1.3fr 1fr; gap:60px; align-items:start; }
.manifesto h2 { margin:0; color:#171922; font-size:clamp(30px,3.3vw,46px); line-height:1.5; font-weight:500; letter-spacing:-.055em; }
.manifesto-copy { padding-top:75px; }
.manifesto-copy p { margin:0 0 24px; color:#60636c; font-size:16px; line-height:2.1; }
.manifesto-copy a { display:inline-flex; align-items:center; gap:11px; margin-top:13px; font-size:14px; text-decoration:none; }
.manifesto-copy a:hover { text-decoration:underline; }
.manifesto-copy svg { width:17px; height:17px; }
.faq-section { background:#f2f3f6; }
.faq-inner { display:grid; grid-template-columns:1fr 1.5fr; gap:60px; }
.faq-inner h2 { margin:0; color:#171922; font-size:30px; font-weight:500; letter-spacing:-.035em; }
.faq-list details { border-bottom:1px solid #d9dde5; }
.faq-list summary { display:flex; align-items:center; justify-content:space-between; gap:20px; padding:24px 0; cursor:pointer; font-size:16px; list-style:none; }
.faq-list summary::-webkit-details-marker { display:none; }
.faq-list summary span { color:#777d88; font-size:23px; font-weight:300; transition:transform .2s; }
.faq-list details[open] summary span { transform:rotate(45deg); }
.faq-list details p { margin:0 40px 24px 0; color:#60636c; font-size:15px; line-height:1.9; }
.closing { max-width:none; padding:110px 24px; text-align:center; background:radial-gradient(ellipse at 50% 110%,#d3dafa,transparent 65%),#fcfcfa; }
.closing p { margin:0 0 36px; font-size:clamp(32px,4vw,52px); font-weight:500; line-height:1.5; letter-spacing:-.045em; }
.site-footer { max-width:none; display:flex; align-items:center; gap:32px; flex-wrap:wrap; padding:32px 48px; border-top:1px solid var(--line); background:#fcfcfa; }
.site-footer .brand { font-size:19px; }
.site-footer .brand img { width:26px; height:26px; }
.site-footer nav { display:flex; gap:22px; margin-left:auto; }
.site-footer nav a,.site-footer small { color:#6b7079; font-size:12px; text-decoration:none; }
.site-footer nav a:hover { text-decoration:underline; }
@keyframes light-blue-drift { 0%,100% { transform:translate3d(-12%,-8%,0) rotate(-12deg); } 50% { transform:translate3d(18%,12%,0) rotate(16deg) scale(1.12); } }
@keyframes light-violet-drift { 0%,100% { transform:translate3d(14%,-10%,0) rotate(10deg); } 50% { transform:translate3d(-18%,14%,0) rotate(-18deg) scale(1.08); } }
@keyframes light-pearl-drift { 0%,100% { transform:translate3d(-12%,-6%,0) rotate(-18deg); } 50% { transform:translate3d(14%,9%,0) rotate(20deg); } }
.hero[data-motion-paused] .light-field { animation-play-state:paused; }
@media (max-width:800px) {
  .site-nav { min-height:78px; padding:18px 24px; }
  .brand { font-size:19px; }
  .site-nav nav { gap:18px; }
  .nav-about { display:none; }
  .hero { min-height:max(740px,100svh); }
  .hero-inner { padding:122px 22px 112px; }
  h1 { font-size:clamp(39px,7.4vw,60px); }
  .hero-description { font-size:16px; }
  .hero-foot { inset-inline:24px; bottom:22px; }
  .light-field { filter:blur(32px); }
  .section-wrap { padding:76px 28px; }
  .demo-heading { display:block; }
  .demo-heading .section-label { margin-bottom:24px; }
  .manifesto-inner,.faq-inner,.waitlist-inner { grid-template-columns:1fr; gap:34px; }
  .waitlist-inner { padding-block:68px; }
  .manifesto-copy { padding-top:0; }
  .manifesto h2 { font-size:36px; }
  .demo-frame { padding:9px; border-radius:20px; }
  .demo-frame video { border-radius:13px; }
  .closing { padding:84px 24px; }
  .site-footer { padding:32px 28px; }
}
@media (max-width:480px) {
  .site-nav { gap:12px; padding:16px 18px; }
  .site-nav .brand { gap:7px; font-size:14px; }
  .site-nav .brand img { width:26px; height:26px; }
  .site-nav .brand-copy { white-space:nowrap; }
  .site-nav .brand-copy strong { font-size:14px; }
  .site-nav .brand-copy small { font-size:7px; }
  .site-nav nav { gap:8px; }
  .nav-join { padding:9px 12px; font-size:11px; white-space:nowrap; }
  .nav-join svg { display:none; }
  .hero { min-height:max(730px,100svh); }
  h1 { font-size:32px; line-height:1.48; letter-spacing:-.05em; }
  .hero-emblem { width:65px; height:65px; border-radius:18px; }
  .hero-emblem img { width:37px; height:37px; }
  .launch-label { font-size:9px; }
  .hero-actions a { min-height:50px; padding:12px 18px; font-size:13px; }
  .model-names { gap:16px; }
  .model-names > span { gap:7px; font-size:11px; }
  .model-names .and-more { font-size:10px; }
  .manifesto h2 { font-size:clamp(28px,7.8vw,36px); }
  .demo-frame figcaption { font-size:11px; text-align:left; }
  .waitlist-form { padding:20px; }
  .waitlist-fields { display:grid; }
  .site-footer nav { width:100%; margin-left:0; }
  .site-footer small { width:100%; }
}
@media (prefers-reduced-motion:reduce) { html { scroll-behavior:auto; } *,*::before,*::after { animation:none!important; transition:none!important; } }