:root {
  --canvas: #f3f5f0;
  --paper: #fbfcf8;
  --ink: #142321;
  --ink-2: #243532;
  --muted: #60706c;
  --line: #cbd4ce;
  --line-dark: #40504c;
  --accent: #157565;
  --accent-dark: #0b584c;
  --accent-soft: #dcece7;
  --warm: #bd6f45;
  --mono: "IBM Plex Mono", monospace;
  --latin: "Manrope", sans-serif;
  --sans: "Noto Sans JP", sans-serif;
  --container: 1240px;
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--ink); background: var(--canvas); font-family: var(--sans); line-height: 1.75; -webkit-font-smoothing: antialiased; }
button { font: inherit; }
a { color: inherit; }
svg { display: block; }
::selection { color: #fff; background: var(--accent); }
.skip-link { position: fixed; top: 8px; left: 8px; z-index: 1000; padding: 11px 16px; color: #fff; background: var(--ink); transform: translateY(-150%); }
.skip-link:focus { transform: none; }
.progress { position: fixed; inset: 0 0 auto; z-index: 150; height: 2px; pointer-events: none; }
.progress span { display: block; width: 100%; height: 100%; background: var(--accent); transform: scaleX(0); transform-origin: left; }
#main-content { overflow-x: clip; }

.site-header { position: fixed; top: 18px; left: 50%; z-index: 100; width: min(calc(100% - 32px), var(--container)); min-height: 62px; padding: 9px 12px 9px 18px; display: flex; align-items: center; justify-content: space-between; gap: 18px; background: rgba(251,252,248,.92); border: 1px solid rgba(20,35,33,.18); border-radius: 14px; box-shadow: 0 10px 30px rgba(20,35,33,.06); backdrop-filter: blur(14px); transform: translateX(-50%); transition: border-color .25s, box-shadow .25s; }
.site-header.is-scrolled { border-color: rgba(20,35,33,.32); box-shadow: 0 14px 40px rgba(20,35,33,.09); }
.brand { min-height: 44px; display: inline-flex; align-items: center; gap: 10px; text-decoration: none; font: 700 .86rem/1 var(--latin); letter-spacing: -.02em; }
.brand svg { width: 32px; height: 32px; }
.brand svg path:first-child { fill: var(--accent); }.brand svg path:nth-child(2){fill:var(--paper)}.brand svg circle{fill:var(--ink)}.brand svg path:last-child{fill:none;stroke:var(--ink);stroke-width:1.4;stroke-linecap:round}
.brand > i, .footer-brand i { width: 1px; height: 18px; background: var(--line); }.brand strong{font-weight:600;color:var(--accent)}
.primary-nav { display: flex; align-items: center; gap: 2px; }
.primary-nav a { min-height: 44px; padding: 10px 13px; display: inline-flex; align-items: center; color: var(--ink-2); border-radius: 9px; text-decoration: none; font-size: .78rem; font-weight: 600; transition: color .2s, background .2s; }
.primary-nav a:hover, .primary-nav a:focus-visible { color: var(--accent); background: var(--accent-soft); }
.release-status { min-height: 40px; margin-left: 8px; padding: 9px 12px; display: inline-flex; align-items: center; gap: 8px; color: var(--accent-dark); background: var(--accent-soft); border-radius: 9px; font: 600 .67rem/1 var(--mono); text-transform: uppercase; letter-spacing: .08em; }
.release-status i,.quiet-status i,.transform-state i { width: 6px; height: 6px; background: var(--accent); border-radius: 50%; animation: status-pulse 2s ease-in-out infinite; }
.nav-toggle { display: none; width: 44px; height: 44px; border: 1px solid var(--line); border-radius: 9px; background: var(--paper); cursor: pointer; }
.nav-toggle span { width: 18px; height: 1px; margin: 5px auto; display: block; background: var(--ink); transition: transform .2s; }

.hero { position: relative; min-height: 100vh; padding: 170px max(24px,calc((100vw - var(--container))/2)) 80px; display: flex; flex-direction: column; justify-content: center; isolation: isolate; }
.hero-grid { position: absolute; inset: 0; z-index: -2; opacity: .55; background-image: linear-gradient(rgba(20,35,33,.055) 1px,transparent 1px),linear-gradient(90deg,rgba(20,35,33,.055) 1px,transparent 1px); background-size: 46px 46px; mask-image: linear-gradient(to bottom,#000 0%,transparent 74%); }
.hero::after { content:""; position:absolute; width:min(46vw,650px); height:min(46vw,650px); top:-170px; right:-180px; z-index:-1; border:1px solid rgba(21,117,101,.15); border-radius:50%; box-shadow:0 0 0 85px rgba(21,117,101,.035),0 0 0 170px rgba(21,117,101,.025); }
.hero-copy { max-width: 1040px; }
.overline,.section-label { margin:0 0 25px; display:flex;align-items:center;gap:13px;color:var(--accent);font:600 .7rem/1 var(--mono);letter-spacing:.12em;text-transform:uppercase}.overline i{width:30px;height:1px;background:var(--line-dark)}
.hero h1,.section-intro h2,.builder-copy h2,.closing h2 { margin:0;font-family:var(--latin);font-weight:600;letter-spacing:-.055em;line-height:1.08 }
.hero h1 { max-width:1000px;font-size:clamp(3.8rem,7.2vw,7.2rem) }.hero h1 em{color:var(--accent);font-style:normal}.hero h1 em span{display:inline}
.hero-lead { max-width:750px;margin:34px 0 0;color:var(--ink-2);font-size:clamp(1rem,1.5vw,1.2rem);line-height:2 }
.hero-actions { margin-top:35px;display:flex;align-items:center;flex-wrap:wrap;gap:15px }
.primary-action { min-height:54px;padding:13px 18px 13px 22px;display:inline-flex;align-items:center;gap:28px;color:#fff;background:var(--accent);border:1px solid var(--accent);border-radius:9px;text-decoration:none;font-size:.86rem;font-weight:600;transition:background .2s,transform .2s}.primary-action:hover,.primary-action:focus-visible{background:var(--accent-dark);transform:translateY(-2px)}.primary-action span{font-family:var(--mono)}
.quiet-status { min-height:48px;padding:12px 15px;display:inline-flex;align-items:center;gap:9px;color:var(--muted);border:1px solid var(--line);border-radius:9px;font-size:.78rem;font-weight:600 }

.transformation { width:100%;margin-top:85px;background:var(--paper);border:1px solid var(--line);border-radius:16px;box-shadow:0 22px 60px rgba(20,35,33,.07);overflow:hidden }
.transform-head { min-height:49px;padding:0 20px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font:500 .67rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}.transform-state{display:flex;align-items:center;gap:8px;color:var(--accent)}
.transform-input { min-height:92px;padding:24px 28px;display:flex;align-items:center;gap:16px;border-bottom:1px solid var(--line) }.input-label{padding:5px 8px;color:var(--accent);background:var(--accent-soft);border-radius:5px;font:600 .64rem/1 var(--mono)}.transform-input p{margin:0;font-size:clamp(1rem,1.5vw,1.16rem);font-weight:500}.input-cursor{width:1px;height:24px;background:var(--accent);animation:cursor-blink 1s steps(2) infinite}
.transform-rail { position:relative;min-height:120px;padding:31px 7%;display:grid;grid-template-columns:repeat(3,1fr);align-items:start;background:#eef1ec }.rail-line{position:absolute;left:12%;right:12%;top:50px;height:1px;background:var(--line)}.rail-line span{display:block;width:34%;height:100%;background:var(--accent);animation:rail-progress 4.5s ease-in-out infinite}.rail-step{position:relative;z-index:2;display:flex;flex-direction:column;align-items:center;gap:10px;color:var(--muted);font-size:.75rem}.rail-step i{width:40px;height:40px;display:grid;place-items:center;background:var(--paper);border:1px solid var(--line);border-radius:50%;font:500 .66rem/1 var(--mono);font-style:normal}.rail-step.is-current i{color:#fff;background:var(--accent);border-color:var(--accent)}
.transform-output { min-height:260px;padding:34px 9%;position:relative;display:grid;align-content:center;color:#fff;background:var(--ink);overflow:hidden }.transform-output::after{content:"";position:absolute;inset:0;background:linear-gradient(110deg,transparent 45%,rgba(255,255,255,.04) 45% 45.3%,transparent 45.3%)}.output-meta{position:absolute;inset:20px 22px auto;display:flex;justify-content:space-between;color:#9fb2ad;font:500 .65rem/1 var(--mono);letter-spacing:.08em}.transform-output p{position:relative;z-index:2;margin:0;font-family:var(--latin);font-size:clamp(2rem,4vw,4.8rem);font-weight:600;line-height:1.15;letter-spacing:-.05em}.transform-output p span,.transform-output p strong{display:block;animation:output-reveal .85s cubic-bezier(.22,1,.36,1) both}.transform-output p strong{color:#b8ddd3;font-weight:600;animation-delay:.12s}.output-timeline{position:absolute;left:9%;right:9%;bottom:22px;display:flex;gap:5px}.output-timeline i{height:2px;flex:1;background:#435450;overflow:hidden}.output-timeline i::after{content:"";display:block;width:100%;height:100%;background:#9bc9bd;transform:translateX(-100%);animation:timeline-fill 3s ease-in-out infinite}.output-timeline i:nth-child(2)::after{animation-delay:.15s}.output-timeline i:nth-child(3)::after{animation-delay:.3s}.output-timeline i:nth-child(4)::after{animation-delay:.45s}.output-timeline i:nth-child(5)::after{animation-delay:.6s}
.transform-options { padding:10px;display:grid;grid-template-columns:repeat(3,1fr);gap:8px;border-top:1px solid var(--line) }.transform-option{min-height:44px;color:var(--muted);background:transparent;border:1px solid transparent;border-radius:8px;cursor:pointer;font-size:.78rem;font-weight:600}.transform-option:hover,.transform-option:focus-visible{border-color:var(--line)}.transform-option.is-active{color:var(--accent-dark);background:var(--accent-soft)}
.hero-proof { margin-top:28px;display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-bottom:1px solid var(--line) }.hero-proof div{min-height:96px;padding:22px;display:flex;flex-direction:column;justify-content:center;border-right:1px solid var(--line)}.hero-proof div:first-child{padding-left:0}.hero-proof div:last-child{border-right:0}.hero-proof strong{font:600 1rem/1.2 var(--latin)}.hero-proof span{margin-top:7px;color:var(--muted);font-size:.72rem}

.section { padding:clamp(95px,10vw,150px) max(24px,calc((100vw - var(--container))/2)) }
.section[id],.closing{scroll-margin-top:100px}.section-intro { max-width:800px;margin-bottom:65px }.section-intro-wide{max-width:1000px}.section-intro h2,.builder-copy h2,.closing h2{font-size:clamp(2.45rem,4.15vw,4.65rem);line-height:1.15}.section-intro h2>span,.builder-copy h2>span,.closing h2>span{display:block;word-break:auto-phrase}.section-intro>p:last-child,.builder-copy>p:last-child{max-width:650px;margin:25px 0 0;color:var(--muted);font-size:.98rem}.section-label{margin-bottom:24px}
.capabilities { background:var(--paper) }.capability-layout{display:grid;grid-template-columns:minmax(360px,.82fr) minmax(0,1.18fr);gap:clamp(45px,7vw,90px);align-items:start}.capability-list{border-top:1px solid var(--line)}
.capability-row{width:100%;min-height:84px;padding:15px 8px;display:grid;grid-template-columns:50px 1fr 32px;align-items:center;gap:8px;color:var(--ink);background:transparent;border:0;border-bottom:1px solid var(--line);cursor:pointer;text-align:left;transition:padding .22s,background .22s}.capability-row:hover,.capability-row:focus-visible{padding-left:16px;background:var(--canvas)}.capability-row.is-active{background:var(--accent-soft)}.cap-index{color:var(--accent);font:500 .7rem/1 var(--mono)}.capability-row strong{display:block;font-size:.94rem}.capability-row small{display:block;margin-top:4px;color:var(--muted);font-size:.7rem}.capability-row>i{justify-self:end;color:var(--accent);font:500 1rem/1 var(--mono);font-style:normal;opacity:0;transform:translate(-6px,6px);transition:opacity .2s,transform .2s}.capability-row.is-active>i,.capability-row:hover>i{opacity:1;transform:none}
.capability-stage{position:sticky;top:105px;background:var(--canvas);border:1px solid var(--line);border-radius:14px;overflow:hidden}.stage-head{min-height:48px;padding:0 17px;display:flex;align-items:center;justify-content:space-between;background:var(--paper);border-bottom:1px solid var(--line);font:500 .65rem/1 var(--mono);letter-spacing:.08em}.stage-canvas{position:relative;min-height:480px;display:grid;place-items:center;background:linear-gradient(135deg,#e9efea,#f7f8f4);overflow:hidden}.stage-canvas::before{content:"";position:absolute;inset:0;opacity:.3;background-image:linear-gradient(rgba(20,35,33,.08) 1px,transparent 1px),linear-gradient(90deg,rgba(20,35,33,.08) 1px,transparent 1px);background-size:30px 30px}.demo{display:none;position:relative;z-index:2}.stage-canvas[data-stage-canvas="reveal"] .demo-reveal,.stage-canvas[data-stage-canvas="parallax"] .demo-parallax,.stage-canvas[data-stage-canvas="sticky"] .demo-sticky,.stage-canvas[data-stage-canvas="story"] .demo-story,.stage-canvas[data-stage-canvas="marquee"] .demo-marquee,.stage-canvas[data-stage-canvas="micro"] .demo-micro,.stage-canvas[data-stage-canvas="video"] .demo-video,.stage-canvas[data-stage-canvas="parts"] .demo-parts{display:flex}.stage-canvas[data-stage-canvas="stagger"] .demo-stagger,.stage-canvas[data-stage-canvas="focus"] .demo-focus{display:grid}
.sample-page{width:min(84%,470px);background:var(--paper);border:1px solid var(--line);border-radius:9px;box-shadow:0 18px 45px rgba(20,35,33,.08);overflow:hidden}.sample-nav{min-height:40px;padding:0 15px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid var(--line);font:600 .58rem/1 var(--latin);letter-spacing:.09em}.sample-nav span{color:var(--muted);font:500 .53rem/1 var(--mono)}.sample-hero{padding:34px 32px 31px;text-align:left}.sample-hero>small{color:var(--accent);font:600 .55rem/1 var(--mono);letter-spacing:.12em}.sample-hero h3{margin:13px 0 8px;font-family:var(--latin);font-size:clamp(1.75rem,3.2vw,2.8rem);line-height:1.05;letter-spacing:-.05em}.sample-hero h3 span,.sample-hero h3 b{display:block;animation:demo-rise .8s cubic-bezier(.22,1,.36,1) both}.sample-hero h3 b{color:var(--accent);font-weight:600;animation-delay:.12s}.sample-hero p{margin:0 0 18px;color:var(--muted);font-size:.68rem}.sample-hero>i{display:inline-block;padding:8px 11px;color:#fff;background:var(--accent);border-radius:5px;font-size:.6rem;font-style:normal}
.demo-stagger{width:min(86%,500px);grid-template-columns:repeat(3,1fr);gap:10px}.demo-stagger article{min-height:150px;padding:18px 15px;display:flex;flex-direction:column;background:var(--paper);border:1px solid var(--line);border-radius:8px;box-shadow:0 10px 24px rgba(20,35,33,.06);animation:demo-card 2.8s ease-in-out infinite both}.demo-stagger article:nth-child(2){animation-delay:.14s}.demo-stagger article:nth-child(3){animation-delay:.28s}.demo-stagger article i{color:var(--accent);font:500 .58rem/1 var(--mono);font-style:normal}.demo-stagger article strong{margin-top:auto;font-size:.78rem}.demo-stagger article small{margin-top:6px;color:var(--muted);font-size:.58rem;line-height:1.6}
.demo-focus{width:min(80%,430px);min-height:300px;padding:22px;grid-template-columns:1fr 1fr;align-items:center;background:var(--paper);border:1px solid var(--line);border-radius:10px;box-shadow:0 16px 40px rgba(20,35,33,.07);overflow:hidden}.product-visual{display:grid;place-items:center;animation:focus-scale 3.2s ease-in-out infinite}.product-visual svg{width:145px}.product-copy{padding-left:15px;display:flex;flex-direction:column}.product-copy small{color:var(--accent);font:600 .54rem/1 var(--mono);letter-spacing:.1em}.product-copy strong{margin-top:12px;font:600 1.55rem/1.2 var(--latin)}.product-copy span{margin-top:8px;color:var(--muted);font-size:.65rem}.product-copy b{margin-top:28px;font:600 .85rem/1 var(--latin)}
.demo-parallax{width:min(86%,500px)}.travel-scene{position:relative;width:100%;border-radius:10px;box-shadow:0 18px 40px rgba(20,35,33,.1);overflow:hidden}.travel-scene svg{display:block;width:100%}.travel-scene .layer-back{animation:land-back 4s ease-in-out infinite}.travel-scene .layer-mid{animation:land-mid 4s ease-in-out infinite}.travel-scene .layer-front{animation:land-front 4s ease-in-out infinite}.travel-scene>div{position:absolute;left:22px;right:22px;bottom:18px;color:#fff}.travel-scene small{display:block;font:500 .53rem/1 var(--mono);letter-spacing:.1em}.travel-scene strong{display:block;margin-top:7px;font-size:1.15rem}.travel-scene span{display:block;margin-top:7px;font-size:.58rem}
.demo-sticky{width:82%;height:330px;align-items:center;justify-content:center}.demo-sticky article{position:absolute;width:72%;min-height:180px;padding:26px;display:flex;flex-direction:column;justify-content:flex-end;background:var(--paper);border:1px solid var(--line-dark);border-radius:8px;box-shadow:0 15px 35px rgba(20,35,33,.1);animation:stack-shift 3.4s ease-in-out infinite}.demo-sticky article:nth-child(1){transform:translate(-62px,36px);background:#e9f0ed}.demo-sticky article:nth-child(3){transform:translate(62px,-36px);background:#f2eee9}.demo-sticky article small{color:var(--accent);font:500 .55rem/1 var(--mono)}.demo-sticky article strong{margin-top:15px;font-size:1.05rem}.demo-sticky article span{margin-top:5px;color:var(--muted);font-size:.64rem}
.demo-story{width:min(82%,450px)}.demo-story ol{width:100%;margin:0;padding:0;display:grid;gap:8px;list-style:none}.demo-story li{min-height:75px;padding:12px 16px;display:flex;align-items:center;gap:16px;background:var(--paper);border:1px solid var(--line);border-radius:8px;animation:story-row 3.4s infinite}.demo-story li:nth-child(2){animation-delay:.45s}.demo-story li:nth-child(3){animation-delay:.9s}.demo-story li>i{width:38px;height:38px;display:grid;place-items:center;color:var(--accent);background:var(--accent-soft);border-radius:50%;font:600 .6rem/1 var(--mono);font-style:normal}.demo-story li span{display:flex;flex-direction:column}.demo-story li strong{font-size:.78rem}.demo-story li small{margin-top:3px;color:var(--muted);font-size:.6rem}
.demo-marquee{width:min(88%,510px)}.marquee-page{width:100%;padding:20px 0;background:var(--paper);border:1px solid var(--line);border-radius:9px;box-shadow:0 15px 38px rgba(20,35,33,.08);overflow:hidden}.marquee-page>div{padding:0 20px;display:flex;justify-content:space-between;font:600 .55rem/1 var(--latin)}.marquee-page>div small{color:var(--muted);font-size:.48rem}.marquee-page>p{margin:30px 20px;font:600 1.45rem/1.15 var(--latin);letter-spacing:-.04em}.marquee-page section{padding:14px 0;color:#fff;background:var(--ink);white-space:nowrap}.marquee-page section span{display:inline-block;font:600 1rem/1 var(--latin);letter-spacing:.03em;animation:calm-marquee 10s linear infinite}.marquee-page>i{display:block;margin:17px 20px 0;color:var(--muted);font-size:.56rem;font-style:normal}
.demo-micro{width:min(78%,380px)}.demo-micro article{width:100%;padding:14px;display:grid;grid-template-columns:112px 1fr;gap:15px;background:var(--paper);border:1px solid var(--line);border-radius:9px;box-shadow:0 15px 38px rgba(20,35,33,.08)}.demo-micro svg{width:112px}.demo-micro article>div{display:flex;flex-direction:column;padding-top:5px}.demo-micro small{color:var(--accent);font:500 .5rem/1 var(--mono)}.demo-micro strong{margin-top:9px;font-size:.72rem;line-height:1.5}.demo-micro article>div span{margin-top:8px;font:600 .75rem/1 var(--latin)}.demo-micro button{grid-column:1/-1;min-height:44px;padding:10px 15px;display:flex;align-items:center;justify-content:center;gap:8px;color:#fff;background:var(--accent);border:0;border-radius:6px;cursor:pointer;font-size:.68rem;font-weight:600;transition:background .2s,transform .2s}.demo-micro button:hover,.demo-micro button:focus-visible{transform:translateY(-2px)}.demo-micro button i{font-size:1rem;font-style:normal}.demo-micro button.is-saved{background:var(--ink)}
.demo-video{width:min(85%,500px)}.video-scene{position:relative;width:100%;aspect-ratio:16/9;border-radius:9px;box-shadow:0 16px 40px rgba(20,35,33,.12);overflow:hidden;animation:video-breathe 3.4s ease-in-out infinite}.video-scene svg{display:block;width:100%;height:100%}.video-scene>span{position:absolute;left:18px;bottom:17px;color:#fff;font-size:.65rem;font-weight:600}.video-scene>button{position:absolute;inset:50% auto auto 50%;width:52px;height:52px;color:var(--ink);background:rgba(255,255,255,.88);border:0;border-radius:50%;transform:translate(-50%,-50%);cursor:pointer}.video-scene>i{position:absolute;right:15px;bottom:15px;color:#fff;font:500 .56rem/1 var(--mono);font-style:normal}
.demo-parts{width:min(84%,460px);flex-direction:column;align-items:center}.camera-parts{width:100%;height:220px;display:flex;align-items:center;justify-content:center;gap:26px}.camera-parts>span{position:relative;display:grid;place-items:center;animation:parts-assemble 3s ease-in-out infinite}.camera-parts small{position:absolute;top:calc(100% + 11px);color:var(--muted);font:500 .52rem/1 var(--mono)}.camera-lens{width:88px;height:88px;background:#1e3430;border:12px solid #4f625d;border-radius:50%;--x:-36px;--y:0}.camera-lens i{width:42px;height:42px;background:#83a99f;border:8px solid #10211e;border-radius:50%}.camera-body{width:150px;height:112px;background:var(--accent);border:8px solid #17302c;border-radius:14px;--x:0;--y:-28px;animation-delay:.12s!important}.camera-body b{width:62px;height:62px;background:#182d29;border:8px solid #8aaba2;border-radius:50%}.camera-screen{width:78px;height:98px;background:#243b36;border:7px solid #132a26;border-radius:8px;--x:36px;--y:0;animation-delay:.24s!important}.camera-screen i{width:52px;height:62px;background:#b9d0c9;border-radius:3px}.demo-parts>p{margin:20px 0 0;font-size:.75rem}.demo-parts>p strong{color:var(--accent)}
.stage-detail{display:grid;grid-template-columns:1fr 1fr;background:var(--paper);border-top:1px solid var(--line)}.stage-detail>div{min-height:110px;padding:19px 21px}.stage-detail>div:first-child{border-right:1px solid var(--line)}.stage-detail span{color:var(--accent);font:500 .65rem/1 var(--mono);letter-spacing:.08em}.stage-detail p{margin:9px 0 0;font-size:.8rem;line-height:1.7}.stage-replay{min-height:48px;width:100%;color:var(--ink);background:var(--paper);border:0;border-top:1px solid var(--line);cursor:pointer;font-size:.76rem;font-weight:600}.stage-replay:hover,.stage-replay:focus-visible{color:var(--accent);background:var(--accent-soft)}.stage-replay span{margin-right:5px;font-family:var(--mono)}.capability-stage.is-replaying .stage-canvas{animation:stage-flash .4s ease}

.requests{background:var(--canvas)}.request-table{border-top:1px solid var(--line-dark)}.request-row{min-height:91px;padding:17px 4px;display:grid;grid-template-columns:.75fr 1.65fr .45fr;align-items:center;gap:25px;border-bottom:1px solid var(--line);transition:background .2s,padding .2s}.request-row:not(.request-head):hover{padding-inline:15px;background:var(--paper)}.request-head{min-height:52px;color:var(--muted);font:500 .65rem/1 var(--mono);letter-spacing:.08em;text-transform:uppercase}.request-row>span{color:var(--muted);font-size:.78rem}.request-row>strong{font-size:clamp(.9rem,1.5vw,1.12rem);font-weight:500}.request-row>b{justify-self:end;color:var(--accent);font-size:.75rem;font-weight:600}

.builder{display:grid;grid-template-columns:.78fr 1.22fr;gap:clamp(50px,8vw,110px);color:#fff;background:var(--ink)}.builder-copy{position:sticky;top:120px;align-self:start}.builder-copy h2{font-size:clamp(3rem,5.6vw,5.6rem)}.builder-copy>p:last-child{color:#aab8b4}.section-label-light{color:#8fc4b7}.builder-panel{background:#1d2e2b;border:1px solid #40504c;border-radius:14px;overflow:hidden}.builder-panel fieldset{margin:0;padding:27px;border:0;border-bottom:1px solid #40504c}.builder-panel legend{margin-bottom:16px;color:#dfe7e3;font-size:.82rem;font-weight:600}.builder-panel legend i{margin-right:10px;color:#7eb6a9;font:500 .65rem/1 var(--mono);font-style:normal}.choices{display:flex;flex-wrap:wrap;gap:8px}.choice{min-height:44px;padding:10px 15px;color:#b5c2be;background:transparent;border:1px solid #51635e;border-radius:7px;cursor:pointer;font-size:.76rem;transition:color .2s,background .2s,border-color .2s}.choice:hover,.choice:focus-visible{color:#fff;border-color:#8fc4b7}.choice.is-active{color:#10211e;background:#acd2c8;border-color:#acd2c8}.prompt-result{padding:29px;background:#10211e}.prompt-result>span{color:#7eb6a9;font:500 .63rem/1 var(--mono);letter-spacing:.1em}.prompt-result p{min-height:7.5em;margin:18px 0 23px;padding-left:17px;border-left:2px solid var(--accent);font-size:.9rem;line-height:1.9}.prompt-result button{width:100%;min-height:50px;padding:11px 15px;display:flex;align-items:center;justify-content:space-between;color:var(--ink);background:#c2ddd6;border:0;border-radius:7px;cursor:pointer;font-weight:600}.prompt-result button:hover,.prompt-result button:focus-visible{background:#d4e8e3}.prompt-result button i{font:500 1rem/1 var(--mono);font-style:normal}

.principles{background:var(--paper)}.principle-grid{display:grid;grid-template-columns:repeat(4,1fr);border-top:1px solid var(--line);border-left:1px solid var(--line)}.principle{min-height:300px;padding:28px;border-right:1px solid var(--line);border-bottom:1px solid var(--line)}.principle>span{color:var(--accent);font:500 .68rem/1 var(--mono)}.principle h3{margin:75px 0 13px;font-family:var(--latin);font-size:1.2rem;letter-spacing:-.03em}.principle p{margin:0;color:var(--muted);font-size:.8rem;line-height:1.8}
.closing{position:relative;min-height:720px;padding:130px max(24px,calc((100vw - var(--container))/2));display:flex;align-items:center;color:#fff;background:var(--accent-dark);overflow:hidden}.closing::after{content:"";position:absolute;width:620px;height:620px;right:-150px;top:50%;border:1px solid rgba(255,255,255,.12);border-radius:50%;transform:translateY(-50%);box-shadow:0 0 0 95px rgba(255,255,255,.025),0 0 0 190px rgba(255,255,255,.018)}.closing-inner{position:relative;z-index:2;max-width:900px}.closing h2{font-size:clamp(3.1rem,6.5vw,6.8rem)}.closing-inner>p:not(.section-label){max-width:650px;margin:28px 0;color:#c0d9d3}.download-state{max-width:650px;min-height:72px;margin-top:34px;padding:14px 15px 14px 20px;display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:18px;color:var(--ink);background:var(--paper);border-radius:10px}.download-state span{font:700 1rem/1 var(--latin)}.download-state strong{text-align:center;font-size:.79rem}.download-state i{padding:8px 9px;color:#fff;background:var(--ink);border-radius:5px;font:500 .62rem/1 var(--mono);font-style:normal}.closing-inner small{display:block;margin-top:13px;color:#96bbb2;font-size:.68rem}.closing-line{position:absolute;right:9%;bottom:75px;z-index:2;display:flex;align-items:center;gap:10px}.closing-line span{width:78px;height:1px;background:rgba(255,255,255,.4)}.closing-line i{width:7px;height:7px;border:1px solid #fff;border-radius:50%}
.site-footer{min-height:145px;padding:35px max(24px,calc((100vw - var(--container))/2));display:grid;grid-template-columns:1fr auto auto;align-items:center;gap:30px;color:#dce5e1;background:var(--ink)}.footer-brand{display:flex;align-items:center;gap:10px;font:600 .83rem/1 var(--latin)}.footer-brand strong{color:#85b9ac}.site-footer p{margin:0;color:#85938f;font-size:.75rem}.site-footer small{color:#687773;font:500 .65rem/1 var(--mono)}
.toast{position:fixed;left:50%;bottom:24px;z-index:200;padding:12px 17px;color:#fff;background:var(--accent);border-radius:7px;box-shadow:0 10px 30px rgba(20,35,33,.18);opacity:0;pointer-events:none;transform:translate(-50%,15px);transition:opacity .2s,transform .2s;font-size:.78rem}.toast.is-visible{opacity:1;transform:translate(-50%,0)}

.reveal.is-visible{animation:section-enter .55s ease-out both}
@keyframes section-enter{from{opacity:.55;translate:0 14px}to{opacity:1;translate:0 0}}
@keyframes status-pulse{50%{opacity:.35;box-shadow:0 0 0 5px rgba(21,117,101,.08)}}
@keyframes cursor-blink{50%{opacity:0}}
@keyframes rail-progress{0%,15%{width:0}70%,100%{width:100%}}
@keyframes output-reveal{from{opacity:0;transform:translateY(50px)}to{opacity:1;transform:none}}
@keyframes timeline-fill{0%,15%{transform:translateX(-100%)}65%,100%{transform:translateX(0)}}
@keyframes demo-rise{from{opacity:0;transform:translateY(35px)}to{opacity:1;transform:none}}
@keyframes demo-card{0%,55%,100%{opacity:.35;transform:translateY(10px)}18%,45%{opacity:1;transform:none}}
@keyframes focus-scale{0%,100%{transform:scale(.9)}50%{transform:scale(1.04)}}
@keyframes land-back{50%{transform:translateY(-5px)}}@keyframes land-mid{50%{transform:translateY(7px)}}@keyframes land-front{50%{transform:translateY(13px)}}
@keyframes story-row{0%,22%,100%{background:var(--paper);transform:translateX(0)}35%,60%{background:var(--accent-soft);transform:translateX(8px)}}
@keyframes para-a{50%{transform:translateY(-18px)}}@keyframes para-b{50%{transform:translate(25px,18px) rotate(8deg)}}@keyframes para-c{50%{transform:translate(-18px,-13px)}}
@keyframes stack-shift{50%{margin-top:-18px;filter:brightness(.98)}}
@keyframes node-on{0%,25%,100%{color:var(--accent);background:var(--paper)}35%,65%{color:#fff;background:var(--accent)}}
@keyframes calm-marquee{to{transform:translateX(-50%)}}
@keyframes video-breathe{50%{transform:scale(1.06)}}
@keyframes parts-assemble{0%,100%{transform:translate(var(--x),var(--y))}50%{transform:translate(0,0)}}
@keyframes stage-flash{50%{filter:brightness(1.04)}}

@media(max-width:1024px){
  .capability-layout{grid-template-columns:1fr;gap:35px}.capability-stage{position:relative;top:auto}.capability-list{display:grid;grid-template-columns:1fr 1fr;border-left:1px solid var(--line)}.capability-row{border-right:1px solid var(--line)}
  .builder{grid-template-columns:1fr}.builder-copy{position:static;max-width:760px}.principle-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:780px){
  .site-header{top:10px;width:calc(100% - 20px);min-height:58px;padding:6px 7px 6px 12px}.brand{font-size:.78rem;gap:7px}.brand svg{width:29px}.brand>span{display:none}.brand>i{display:none}.nav-toggle{display:block}.nav-toggle[aria-expanded="true"] span:first-child{transform:translateY(3px) rotate(45deg)}.nav-toggle[aria-expanded="true"] span:last-child{transform:translateY(-3px) rotate(-45deg)}
  .primary-nav{position:absolute;top:calc(100% + 7px);left:0;right:0;padding:9px;display:none;flex-direction:column;align-items:stretch;background:var(--paper);border:1px solid var(--line);border-radius:11px;box-shadow:0 14px 35px rgba(20,35,33,.11)}.primary-nav.is-open{display:flex}.primary-nav a{justify-content:center}.release-status{margin:3px 0 0;justify-content:center}
  .hero{min-height:auto;padding:130px 20px 75px}.hero::after{width:430px;height:430px;right:-290px;top:-120px}.hero h1{font-size:clamp(3.35rem,16vw,5.7rem);letter-spacing:-.07em}.hero-lead{margin-top:26px}.hero-actions{align-items:stretch;flex-direction:column}.primary-action,.quiet-status{width:100%;justify-content:center}.transformation{margin-top:60px}.transform-input{padding:20px;align-items:flex-start}.transform-input p{line-height:1.7}.input-cursor{margin-top:2px}.transform-rail{min-height:112px;padding-inline:4%}.rail-step span{font-size:.68rem}.transform-output{min-height:235px;padding:34px 25px}.transform-output p{font-size:clamp(1.8rem,9vw,3rem)}.output-timeline{left:25px;right:25px}.transform-options{grid-template-columns:1fr}.hero-proof{grid-template-columns:1fr 1fr}.hero-proof div{padding:18px;border-bottom:1px solid var(--line)}.hero-proof div:nth-child(2){border-right:0}.hero-proof div:first-child{padding-left:18px}
  .section{padding:90px 20px}.section-intro h2,.builder-copy h2,.closing h2{font-size:clamp(2.2rem,7.2vw,3.4rem)}.section-intro{margin-bottom:45px}.capability-list{grid-template-columns:1fr}.capability-row{min-height:78px}.stage-canvas{min-height:390px}.stage-detail{grid-template-columns:1fr}.stage-detail>div{min-height:90px}.stage-detail>div:first-child{border-right:0;border-bottom:1px solid var(--line)}
  .request-head{display:none}.request-row{min-height:145px;padding:22px 4px;grid-template-columns:1fr auto;gap:7px 18px}.request-row>span{grid-column:1}.request-row>strong{grid-column:1/-1;grid-row:2}.request-row>b{grid-column:2;grid-row:1;align-self:start}.request-row:not(.request-head):hover{padding-inline:4px}
  .builder{gap:45px}.builder-panel fieldset{padding:22px}.choices{display:grid;grid-template-columns:1fr}.choice{width:100%}.prompt-result{padding:23px}.prompt-result p{min-height:0}.principle-grid{grid-template-columns:1fr}.principle{min-height:220px}.principle h3{margin-top:45px}
  .closing{min-height:680px;padding:100px 20px}.closing::after{width:430px;height:430px;right:-280px}.download-state{display:flex;flex-wrap:wrap;gap:12px}.download-state strong{order:3;width:100%;text-align:left}.closing-line{display:none}.site-footer{padding:35px 20px;grid-template-columns:1fr;text-align:center;gap:16px}.footer-brand{justify-content:center}
}
@media(max-width:420px){.hero h1{font-size:3.1rem}.hero h1 em span{display:block}.transform-input{gap:10px}.input-label{margin-top:4px}.transform-rail{padding-inline:2%}.rail-step i{width:34px;height:34px}.rail-line{top:47px}.stage-canvas{min-height:390px}.sample-page{width:90%}.sample-hero{padding:28px 22px}.demo-stagger{width:90%;grid-template-columns:1fr}.demo-stagger article{min-height:82px}.demo-focus{width:90%;grid-template-columns:1fr;min-height:345px}.product-visual svg{width:120px}.product-copy{padding:0 10px;text-align:center}.product-copy b{margin-top:14px}.demo-parallax{width:92%;transform:none}.demo-sticky{width:96%}.demo-sticky article{width:78%;padding:18px}.demo-story{width:90%}.demo-marquee{width:94%}.demo-micro{width:88%}.demo-video{width:92%}.camera-parts{gap:10px;transform:scale(.8)}.download-state i{margin-left:auto}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation-duration:.001ms!important;animation-iteration-count:1!important;transition-duration:.001ms!important;scroll-behavior:auto!important}.js .reveal{opacity:1!important;transform:none!important}}

/* Responsive typography: keep Japanese readable without oversized, clipped lines. */
body{font-size:16px;overflow-wrap:break-word}
h1,h2,h3,p,li,button{word-break:auto-phrase;text-wrap:pretty}
code,pre,kbd,samp{word-break:normal;text-wrap:wrap}
.hero h1,.section-intro h2,.builder-copy h2,.closing h2{font-family:var(--sans);letter-spacing:-.025em;line-height:1.45}
.hero h1{font-size:clamp(2rem,4.3vw,3.75rem)}
.section-intro h2,.builder-copy h2,.closing h2{font-size:clamp(1.5rem,2.8vw,2.5rem)}
.hero h1 em span{display:inline}
.hero-lead{font-size:16px;max-width:680px}
.section-intro>p:last-child,.builder-copy>p:last-child{font-size:16px}
.transform-output p{font-family:var(--sans);font-size:clamp(1.35rem,2.6vw,2.5rem);line-height:1.65;letter-spacing:0}
.sample-hero h3{font-family:var(--sans);font-size:clamp(1.25rem,1.8vw,1.6rem);line-height:1.5;letter-spacing:0}
.sample-hero h3 b{font-weight:600}
.hero{padding-top:150px;padding-bottom:72px;min-height:auto}
.section{padding-top:80px;padding-bottom:80px}
.closing{min-height:0;padding-top:90px;padding-bottom:90px}
.transformation{margin-top:48px}
.section-intro{margin-bottom:40px}
.transform-input p,.hero-copy,.builder-copy,.builder-panel,.section-intro,.closing-inner,.request-row>*{min-width:0}
.capability-row strong{font-size:15px}.capability-row small{font-size:12px}
.choice{font-size:14px}.request-row>span,.request-row>b{font-size:14px}
.principle p{font-size:14px}.principle h3{margin-top:48px}
.download-action{display:inline-flex;align-items:center;justify-content:center;gap:14px;min-height:54px;padding:13px 20px;border:1px solid var(--accent);border-radius:9px;text-decoration:none;color:var(--accent-dark);font-size:14px}
.download-action:hover{background:var(--accent-soft)}
.download-action span{font:500 12px var(--mono)}
.download-state{text-decoration:none}.download-state:hover{background:#e6f1ec}
a:focus-visible,button:focus-visible{outline:3px solid #bd6f45;outline-offset:4px}
.video-scene.is-paused{animation-play-state:paused}
@media(min-width:421px) and (max-width:780px){
 .demo-stagger{grid-template-columns:1fr}.demo-stagger article{min-height:82px}
 .demo-focus{grid-template-columns:1fr;gap:14px}.product-visual svg{width:110px}.product-copy{padding:0;text-align:center}.product-copy b{margin-top:12px}
}
@media(max-width:780px){
 .hero{padding:110px 20px 56px}.section{padding:56px 20px}.closing{padding:64px 20px;min-height:0}
 .hero h1{font-size:clamp(1.9rem,6.4vw,2.7rem)}
 .hero h1 em span{display:inline}
 .section-intro h2,.builder-copy h2,.closing h2{font-size:clamp(1.5rem,5vw,2rem)}
 .transform-output{min-height:220px;padding:48px 20px}.transform-output p{font-size:clamp(1.25rem,4.5vw,1.8rem)}
 .transform-options{grid-template-columns:repeat(3,minmax(0,1fr))}
 .transform-input{gap:10px}.input-label,.input-cursor{flex-shrink:0}
 .download-action{width:100%}.download-state{gap:12px}
 .stage-canvas{min-height:380px}.demo-sticky article{font-size:14px}
 .demo-micro article{grid-template-columns:minmax(0,88px) minmax(0,1fr)}.demo-micro svg{width:88px}
 .camera-parts{gap:8px}.camera-parts>span{flex-shrink:0}.camera-lens{width:66px;height:66px}.camera-body{width:112px;height:90px}.camera-screen{width:58px;height:80px}.camera-screen i{width:40px;height:55px}
 .capability-list{max-height:350px;overflow-y:auto}
}
@media(prefers-reduced-motion:reduce){.reveal.is-visible{animation:none}.transform-output p span,.transform-output p strong,.sample-hero h3 span,.sample-hero h3 b{opacity:1;transform:none}}

/* Demonstrations share the same principles as the distributed skill. */
.closing-phrase{white-space:nowrap}
.skill-summary{max-width:700px;color:var(--muted);font-size:14px;margin:24px 0}
.overline{flex-wrap:wrap;line-height:1.5}
.demo-instruction{padding:12px 18px;margin:0;font-size:13px;color:var(--ink-2);background:var(--paper);border-bottom:1px solid var(--line)}
.transform-demo-link{display:block;width:100%;padding:14px;border:0;background:var(--accent-soft);color:var(--accent-dark);cursor:pointer;font:inherit;font-size:14px}
.demo-parallax,.demo-sticky,.demo-story,.demo-video{width:94%;height:auto;transform:none}
.demo-scroll{width:100%;height:320px;overflow-y:auto;position:relative;border:1px solid var(--line);border-radius:8px;background:var(--paper);scrollbar-gutter:stable}
.scroll-track{position:relative;height:900px;padding:12px}
.scroll-pin{position:sticky;top:12px;height:280px;display:flex;align-items:center;justify-content:center}
.travel-scene .layer-back,.travel-scene .layer-mid,.travel-scene .layer-front{animation:none;transform:translateY(0)}
.demo-sticky .scroll-track{height:auto;min-height:1000px;padding:20px 12px 250px;width:100%}
.demo-sticky article{position:sticky;top:20px;width:100%;min-height:160px;margin:0 0 90px;transform:none!important;animation:none;box-shadow:0 6px 18px #14232112}
.demo-sticky article:nth-child(2){top:36px}.demo-sticky article:nth-child(3){top:52px}
.demo-story li{animation:none;transform:none;transition:background-color .16s}
.demo-story li.is-current{background:var(--accent-soft);border-color:var(--accent)}
.video-scene{animation:none;aspect-ratio:16/9;overflow:visible;background:transparent;box-shadow:none}
.media-visual{width:100%;height:100%;overflow:hidden;border-radius:9px;transform:scale(.72);transform-origin:center}
.video-scene>button{inset:auto 12px 12px auto;transform:none;width:44px;height:44px;z-index:3}
.video-scene>span,.video-scene>i{position:static;display:none}
.video-scene.is-paused{outline:1px solid var(--line)}
.demo-stagger article{animation:demo-rise .5s ease-out both;animation-delay:0s}.demo-stagger article:nth-child(2){animation-delay:.12s}.demo-stagger article:nth-child(3){animation-delay:.24s}
.product-visual{animation:focus-enter 1s ease-out both}
@keyframes focus-enter{from{transform:scale(.8)}to{transform:scale(1)}}
.camera-parts>span{animation:parts-enter 1.4s ease-in-out both}
@keyframes parts-enter{from{transform:translate(var(--x),var(--y))}to{transform:translate(0,0)}}
.installation{background:var(--paper);scroll-margin-top:100px}
.install-steps{padding-left:24px;max-width:1000px}.install-steps>li{padding:16px 0 24px}.install-steps h3{margin:0 0 12px;font-size:20px}.install-steps p{font-size:15px}
.install-platforms{display:grid;grid-template-columns:1fr 1fr;gap:20px}.install-platforms article{padding:20px;border:1px solid var(--line);border-radius:10px;min-width:0}.install-platforms h4{margin:0 0 12px;font-size:17px}
.install-path code{overflow-wrap:anywhere;word-break:normal}
.install-example,.installation-note{padding:20px;border-left:3px solid var(--accent);background:var(--accent-soft);font-size:15px}.installation-note{max-width:1000px}.install-sources{font-size:13px;color:var(--muted)}
@media(max-width:780px){.closing .closing-phrase{font-size:clamp(1.15rem,5.3vw,2rem)}.install-platforms{grid-template-columns:1fr}.demo-scroll{height:300px}.scroll-pin{height:250px}.scroll-track{height:850px}.hero-proof strong{font-size:14px}}
@media(prefers-reduced-motion:reduce){.scroll-track{height:auto}.scroll-pin{position:static}.demo-sticky .scroll-track{min-height:0;padding-bottom:12px}.demo-sticky article{position:static;margin-bottom:12px}.demo-scroll{height:auto;max-height:540px}.camera-parts>span,.product-visual{animation:none;transform:none}.media-visual{transform:none}.travel-scene .layer-back,.travel-scene .layer-mid,.travel-scene .layer-front{transform:none!important}}

@media(prefers-reduced-motion:reduce){.marquee-page section span{animation:none;transform:none}}

/* The video scales inside its viewport; playback controls stay in a stable position. */
.media-visual video{display:block;width:100%;height:100%;object-fit:cover;background:#dce9e4}
.video-scene>button{inset:auto 12px 12px auto;transform:none;min-width:44px;min-height:44px;box-shadow:0 2px 12px #14232130}
.video-error{position:absolute;inset:auto 0 0;z-index:4;margin:0;padding:12px;background:#fff;color:var(--ink);font-size:13px}
.video-error[hidden]{display:none}