:root{--paper:#f4f0e7;--ink:#151515;--muted:#6e6b64;--line:rgba(21,21,21,.22);--blue:#274cff;--orange:#ff4a22;--lime:#c9ff38;--white:#fffdf7;--panel:#20201e}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;min-height:100vh;color:var(--ink);background:radial-gradient(circle at 80% 10%,rgba(39,76,255,.09),transparent 28%),linear-gradient(rgba(21,21,21,.035) 1px,transparent 1px),var(--paper);background-size:auto,100% 30px,auto;font-family:"Arial Narrow","PingFang SC","Microsoft YaHei",sans-serif}button,input,textarea,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}.lab-header{position:sticky;top:0;z-index:50;display:flex;align-items:center;justify-content:space-between;min-height:82px;padding:12px clamp(18px,4vw,58px);border-top:5px solid var(--blue);border-bottom:1px solid var(--line);background:rgba(244,240,231,.94);backdrop-filter:blur(18px)}.lab-brand{display:flex;align-items:center;gap:12px;color:inherit;text-decoration:none}.lab-brand>span{display:grid;width:46px;height:46px;place-items:center;border:2px solid;border-radius:50%;background:var(--lime);font-size:12px;font-weight:900;letter-spacing:.08em}.lab-brand strong,.lab-header>p,.back-link{font-size:11px;font-weight:900;letter-spacing:.12em}.lab-header>p{margin:0}.back-link{padding:10px 12px;border:1px solid;color:inherit;text-decoration:none}.back-link:hover{color:var(--white);background:var(--ink)}.lab-layout{display:grid;grid-template-columns:250px minmax(0,1fr);min-height:calc(100vh - 82px)}.lab-nav{position:sticky;top:82px;align-self:start;height:calc(100vh - 82px);padding:24px 17px;overflow:auto;border-right:1px solid var(--line)}.lab-nav>p{margin:0 0 14px;color:var(--muted);font-size:10px;font-weight:900;letter-spacing:.16em}.lab-nav a{display:grid;grid-template-columns:28px 1fr auto;align-items:center;gap:7px;min-height:52px;padding:8px;border-top:1px solid var(--line);color:inherit;text-decoration:none;transition:transform .16s,background .16s,color .16s}.lab-nav a:last-child{border-bottom:1px solid var(--line)}.lab-nav a:hover{transform:translateX(4px)}.lab-nav a.is-active{color:var(--white);background:var(--ink)}.lab-nav b,.lab-nav i{color:var(--muted);font-size:9px;font-style:normal;letter-spacing:.08em}.lab-nav a.is-active b,.lab-nav a.is-active i{color:var(--lime)}.lab-nav span{font-size:13px;font-weight:900}.lab-content{min-width:0;padding:clamp(26px,4vw,62px)}.demo-panel{width:min(1240px,100%);margin:auto;animation:panel-in .42s cubic-bezier(.2,.8,.2,1) both}.demo-panel[hidden]{display:none}@keyframes panel-in{from{opacity:0;transform:translateY(18px)}to{opacity:1;transform:none}}.panel-head{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(240px,.65fr);align-items:end;gap:30px;margin-bottom:28px}.panel-head p{display:flex;align-items:center;gap:10px;margin:0 0 14px;font-size:11px;font-weight:900;letter-spacing:.12em}.panel-head p:before{content:"";width:5px;height:24px;background:var(--blue)}.panel-head em{padding:5px 7px;color:var(--white);background:var(--ink);font-style:normal}.panel-head h1{margin:0;font-size:clamp(48px,7vw,106px);font-weight:950;line-height:.91;letter-spacing:-.07em}.panel-head>span{max-width:410px;margin-bottom:7px;color:var(--muted);font-size:16px;line-height:1.75}.motion-studio,.book-stage,.build-console,.map-console,.switch-console,.vision-console,.terminal-console,.combat-console,.video-console,.search-console{position:relative;min-height:510px;overflow:hidden;border:1px solid;border-radius:34px;background:var(--white);box-shadow:12px 12px 0 var(--ink)}
.motion-studio{display:grid;grid-template-columns:1.35fr .65fr;background:var(--ink)}.motion-canvas{position:relative;display:grid;place-items:center;overflow:hidden;background:linear-gradient(135deg,#1d1d1b,#292925)}.motion-canvas:after{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 59px,rgba(255,255,255,.04) 60px)}.motion-word{position:relative;z-index:2;display:flex;color:var(--white);font-size:clamp(70px,10vw,150px);font-weight:950;letter-spacing:-.09em}.motion-word i{font-style:normal}.motion-orb{position:absolute;z-index:3;width:60px;height:60px;border-radius:50%;background:var(--orange);mix-blend-mode:screen}.motion-line{position:absolute;z-index:1;width:70%;height:10px;background:var(--lime);transform-origin:left}.timeline-panel{display:flex;flex-direction:column;padding:32px 24px;color:var(--ink);background:var(--paper)}.timeline-ruler{display:flex;justify-content:space-between;padding-bottom:10px;border-bottom:1px solid;font-size:10px;font-weight:900}.timeline-row{position:relative;height:75px;border-bottom:1px solid var(--line)}.timeline-row b{position:absolute;top:10px;font-size:10px}.timeline-row i{position:absolute;top:35px;left:var(--start);width:var(--width);height:15px;border-radius:10px;background:var(--blue)}.timeline-row:nth-child(3) i{background:var(--orange)}.timeline-row:nth-child(4) i{background:var(--lime);border:1px solid}.timeline-panel button,.video-console>button{margin-top:auto;padding:16px;border:1px solid;color:var(--white);background:var(--blue);font-weight:900;cursor:pointer}.skill-strip{display:flex;flex-wrap:wrap;gap:8px;margin-top:22px}.skill-strip span{padding:8px 12px;border:1px solid;border-radius:99px;font-size:10px;font-weight:900;letter-spacing:.1em}
.book-stage{display:grid;place-items:center;background:linear-gradient(135deg,#d8ff4a,#bfe82f)}.book{position:relative;width:min(620px,72%);height:390px;perspective:1600px}.book:after{content:"";position:absolute;right:-15px;bottom:-18px;width:100%;height:100%;border-radius:5px 24px 24px 5px;background:#111;opacity:.18}.book-page{position:absolute;z-index:1;inset:0;display:flex;flex-direction:column;padding:42px;border:2px solid;border-radius:5px 24px 24px 5px;background:var(--paper);transform-origin:left center;transform:rotateY(-95deg);opacity:0;transition:transform .58s cubic-bezier(.2,.7,.1,1),opacity .2s}.book-page.is-current{z-index:3;transform:rotateY(0);opacity:1}.book-page.is-leaving{z-index:4;transform:rotateY(-105deg);opacity:1}.book-page:nth-child(2){background:#ff5c36}.book-page:nth-child(3){color:var(--white);background:var(--blue)}.book-page:nth-child(4){background:var(--white)}.book-page small,.book-page b{font-size:11px;letter-spacing:.14em}.book-page h2{margin:auto 0 10px;font-size:clamp(42px,6vw,82px);line-height:.88;letter-spacing:-.06em}.book-page p{max-width:430px;font-size:15px;line-height:1.7}.book-page b{margin-top:auto}.book-hit{position:absolute;z-index:8;top:0;width:18%;height:100%;border:0;color:transparent;background:transparent;cursor:pointer}.book-hit:hover{color:var(--ink)}.book-prev{left:0}.book-next{right:0}.book-count{position:absolute;bottom:14px;margin:0;font-size:12px;letter-spacing:.14em}
.build-console{padding:28px;background:#e9e4d8}.build-filters{display:flex;flex-wrap:wrap;gap:8px}.build-filters button,.command-chips button{padding:9px 12px;border:1px solid;background:transparent;font-size:10px;font-weight:900;cursor:pointer}.build-filters button.is-active{color:var(--white);background:var(--ink)}.build-progress{display:grid;grid-template-columns:auto 1fr auto;align-items:center;gap:14px;margin:24px 0;font-size:10px;font-weight:900;letter-spacing:.1em}.build-progress>b{height:9px;border:1px solid;border-radius:9px;background:var(--white)}.build-progress i{display:block;width:0;height:100%;border-radius:9px;background:var(--blue);transition:width .3s}.build-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.build-grid button{display:flex;min-height:155px;flex-direction:column;align-items:flex-start;padding:20px;border:1px solid;border-radius:18px;text-align:left;background:var(--white);cursor:pointer;transition:transform .18s,box-shadow .18s}.build-grid button:hover{transform:translateY(-4px);box-shadow:5px 5px 0}.build-grid button.is-done{background:var(--lime)}.build-grid small{font-size:9px;letter-spacing:.12em}.build-grid strong{margin:auto 0 5px;font-size:22px}.build-grid span{color:var(--muted);font-size:12px}.build-grid i{margin-top:16px;font-size:9px;font-style:normal;font-weight:900}
.map-console{display:grid;grid-template-columns:1fr 320px;background:#171717}.map-canvas{position:relative;min-height:510px;background:radial-gradient(circle,rgba(255,255,255,.13) 1px,transparent 1px);background-size:22px 22px}.map-canvas svg{position:absolute;inset:0;width:100%;height:100%}.map-canvas path{fill:none;stroke:rgba(255,255,255,.28);stroke-width:2;stroke-dasharray:5 7}.map-canvas button{position:absolute;left:var(--x);top:var(--y);z-index:2;width:82px;height:58px;border:1px solid var(--white);border-radius:8px;color:var(--white);background:#292927;transform:translate(-50%,-50%);font-size:10px;font-weight:900;cursor:pointer}.map-canvas button:hover,.map-canvas button.is-active{border-color:var(--lime);color:var(--ink);background:var(--lime)}.map-inspector{padding:30px;color:var(--ink);background:var(--lime)}.map-inspector>p{font-size:10px;font-weight:900;letter-spacing:.14em}.map-inspector h2{margin:60px 0 4px;font-size:42px;letter-spacing:-.05em}.map-inspector>b{font-size:10px;letter-spacing:.12em}.map-inspector dl{margin-top:42px}.map-inspector dl div{padding:14px 0;border-top:1px solid}.map-inspector dt{font-size:9px;font-weight:900;letter-spacing:.12em}.map-inspector dd{margin:7px 0 0;font-size:14px;line-height:1.5}
.switch-console{display:grid;grid-template-columns:1fr 1fr}.switch-form{display:grid;gap:18px;padding:32px;background:#e6e1d5}.switch-form fieldset{display:flex;gap:7px;margin:0;padding:0;border:0}.switch-form legend,.switch-form>label{font-size:10px;font-weight:900;letter-spacing:.12em}.switch-form fieldset label input{position:absolute;opacity:0}.switch-form fieldset span{display:block;padding:11px;border:1px solid;background:var(--white);cursor:pointer}.switch-form fieldset input:checked+span{color:var(--white);background:var(--blue)}.switch-form select,.switch-form>label input{display:block;width:100%;margin-top:8px;padding:13px;border:1px solid;border-radius:0;background:var(--white)}.config-preview{display:flex;min-width:0;flex-direction:column;padding:32px;color:#d8ff83;background:#181817}.config-preview>div{display:flex;justify-content:space-between;font-size:10px;font-weight:900;letter-spacing:.12em}.config-preview i{color:var(--orange);font-style:normal}.config-preview pre{min-height:310px;overflow:auto;color:#d8ff83;font:14px/1.8 "SFMono-Regular",Consolas,monospace;white-space:pre-wrap}.config-preview button{margin-top:auto;padding:15px;border:1px solid var(--lime);color:var(--ink);background:var(--lime);font-weight:900;cursor:pointer}
.vision-console{display:grid;grid-template-columns:1fr 270px;background:#101517}.vision-scene{position:relative;min-height:510px;overflow:hidden;background:linear-gradient(#a4d8ef 0 47%,#6e7a79 47%)}.road{position:absolute;inset:48% -10% 0;background:#3c4445;clip-path:polygon(28% 0,72% 0,100% 100%,0 100%)}.road:after{content:"";position:absolute;left:49%;width:2%;height:100%;background:repeating-linear-gradient(#fff 0 24px,transparent 24px 50px)}.building{position:absolute;bottom:52%;background:#263335}.building.one{left:5%;width:22%;height:36%}.building.two{right:7%;width:30%;height:26%}.detect{position:absolute;z-index:4;border:3px solid var(--lime)}.detect span{position:absolute;top:-24px;left:-3px;padding:4px;color:var(--ink);background:var(--lime);font-size:9px;font-weight:900}.detect.person{left:47%;top:36%;width:9%;height:35%}.detect.car{left:64%;top:58%;width:22%;height:18%;border-color:var(--orange)}.detect.car span{background:var(--orange)}.detect.bike{left:20%;top:59%;width:16%;height:22%;border-color:var(--blue)}.detect.bike span{color:var(--white);background:var(--blue)}.vision-scene svg{position:absolute;z-index:3;inset:0;width:100%;height:100%}.vision-scene svg path{fill:none;stroke:var(--orange);stroke-width:4;stroke-dasharray:8}.vision-zone{position:absolute;z-index:2;right:5%;bottom:5%;width:38%;height:34%;padding:8px;border:2px dashed var(--lime);color:var(--lime);clip-path:polygon(10% 5%,100% 0,86% 100%,0 82%);font-size:10px;font-weight:900}.vision-time{position:absolute;z-index:7;top:14px;left:14px;padding:7px;color:var(--lime);background:#111;font:10px monospace}.vision-tools{padding:28px;color:var(--white);background:#191d1e}.vision-tools>p{font-size:10px;font-weight:900;letter-spacing:.14em}.vision-tools label{display:block;padding:13px 0;border-top:1px solid rgba(255,255,255,.2);font-size:13px}.vision-tools input{accent-color:var(--lime)}.vision-tools dl{display:grid;grid-template-columns:repeat(3,1fr);gap:5px;margin-top:70px}.vision-tools dl div{padding:10px 4px;border:1px solid rgba(255,255,255,.2);text-align:center}.vision-tools dt{font-size:8px}.vision-tools dd{margin:6px 0 0;color:var(--lime);font-size:24px;font-weight:900}
.terminal-console{padding:0;color:#eee;background:#171717;font-family:"SFMono-Regular",Consolas,monospace}.terminal-console[data-theme="night"]{color:#a9ffda;background:#07171b}.terminal-console[data-theme="acid"]{color:#101010;background:#d7ff39}.terminal-top{display:flex;align-items:center;justify-content:space-between;padding:14px 20px;border-bottom:1px solid currentColor;font-size:10px}.terminal-top button{padding:6px 8px;border:1px solid currentColor;color:inherit;background:transparent;font-size:9px;cursor:pointer}.terminal-top button.is-active{color:#111;background:var(--lime)}.terminal-console pre{min-height:320px;margin:0;padding:30px;overflow:auto;color:inherit;font:15px/1.8 inherit;white-space:pre-wrap}.terminal-prompt{display:flex;align-items:center;gap:10px;padding:15px 20px;border-top:1px solid currentColor}.terminal-prompt span{color:var(--orange)}.terminal-prompt b{color:#5e80ff}.terminal-prompt input{min-width:0;flex:1;border:0;outline:0;color:inherit;background:transparent;font-family:inherit}.terminal-prompt button{padding:8px 10px;border:1px solid currentColor;color:inherit;background:transparent;cursor:pointer}.command-chips{display:flex;gap:8px;padding:0 20px 20px}.command-chips button{border-color:currentColor;color:inherit}
.combat-console{display:grid;grid-template-columns:1.15fr .85fr;background:#1b2948}.combat-grid{display:grid;align-self:center;width:min(480px,88%);aspect-ratio:1;margin:auto;grid-template-columns:repeat(5,1fr);border:4px solid #18233d;background:#a9d475}.combat-cell{position:relative;border:1px solid rgba(24,35,61,.18)}.combat-cell:nth-child(odd){background:rgba(255,255,255,.1)}.combat-cell.wall{background:#536c43}.combat-cell.hero:after,.combat-cell.gem:after,.combat-cell.flag:after{position:absolute;inset:12%;display:grid;place-items:center;border:2px solid #18233d;border-radius:50%;font-size:30px}.combat-cell.hero:after{content:"⚔";color:#fff;background:#2d57ff}.combat-cell.gem:after{content:"◆";color:#fff;background:#ff3d75}.combat-cell.flag:after{content:"⚑";color:#fff;background:#ff582e}.combat-code{display:flex;min-width:0;flex-direction:column;padding:28px;color:#d8ff83;background:#171717}.combat-code>div{display:flex;justify-content:space-between;font-size:10px;letter-spacing:.12em}.combat-code>div button{border:0;color:var(--orange);background:transparent;cursor:pointer}.combat-code textarea{min-height:300px;margin:22px 0;padding:18px;border:1px solid #5c6253;resize:none;color:#d8ff83;background:#21231f;font:14px/1.7 "SFMono-Regular",Consolas,monospace}.combat-code>button{padding:14px;border:0;background:var(--lime);font-weight:900;cursor:pointer}.combat-code p{font-size:12px;line-height:1.5}
.video-console{padding:28px;background:#202020}.storyboard{display:grid;grid-template-columns:repeat(3,1fr);gap:14px}.storyboard article{padding:10px;color:var(--white);background:#30302e}.storyboard article>span{font-size:9px}.storyboard p{min-height:42px;margin:9px 0 0;font-size:11px;line-height:1.5}.frame{height:190px;margin-top:8px;border-radius:16px}.frame-one{background:radial-gradient(circle at 70% 40%,#fa3 0 2%,transparent 3%),linear-gradient(135deg,#0d1b3d,#9d2557)}.frame-two{background:linear-gradient(110deg,transparent 40%,#ff5837 41% 48%,transparent 49%),linear-gradient(#171928,#214a6a)}.frame-three{background:radial-gradient(circle at 50% 60%,#ffdb42,transparent 20%),linear-gradient(135deg,#361d57,#0d7789)}.video-flow{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:22px 0}.video-flow div{padding:12px;border:1px solid #555;color:#999}.video-flow div.is-active{border-color:var(--lime);color:var(--lime)}.video-flow div.is-done{color:var(--ink);background:var(--lime)}.video-flow b,.video-flow i{display:block;font-size:9px;font-style:normal}.video-flow span{display:block;margin:13px 0;font-size:12px;font-weight:900}.video-console>button{width:100%;margin:0;background:var(--orange)}
.search-console{padding:28px;background:#e3ded2}.scene-search{display:flex;gap:10px}.scene-search label{flex:1;font-size:9px;font-weight:900;letter-spacing:.12em}.scene-search input{display:block;width:100%;margin-top:7px;padding:13px;border:1px solid;background:var(--white)}.scene-search button{align-self:end;padding:13px 18px;border:1px solid;color:var(--white);background:var(--blue);font-weight:900;cursor:pointer}.video-player{position:relative;height:280px;margin-top:20px;overflow:hidden;border:1px solid;background:#151a25}.video-sky{position:absolute;inset:0;background:linear-gradient(#061126,#d14559)}.video-city{position:absolute;right:0;bottom:0;left:0;height:55%;background:linear-gradient(90deg,#151515 0 12%,transparent 12% 15%,#252525 15% 30%,transparent 30% 36%,#101010 36% 58%,transparent 58% 64%,#222 64% 83%,transparent 83%),repeating-linear-gradient(90deg,transparent 0 18px,#ffdb43 19px 21px)}.video-subject{position:absolute;bottom:-30px;left:55%;width:90px;height:210px;border-radius:50% 50% 0 0;background:#060606}.video-player>span,.video-player>b{position:absolute;top:12px;padding:6px;color:var(--lime);background:#111;font:9px monospace}.video-player>span{left:12px}.video-player>b{right:12px}.scene-timeline{position:relative;height:5px;margin:24px 0;background:#aaa}.scene-timeline>i{display:block;width:35%;height:100%;background:var(--blue);transition:width .35s}.scene-timeline button{position:absolute;top:50%;left:var(--left);width:15px;height:15px;border:2px solid var(--white);border-radius:50%;background:var(--orange);transform:translate(-50%,-50%);cursor:pointer}.scene-results{display:grid;grid-template-columns:repeat(3,1fr);gap:8px}.scene-results button{padding:12px;border:1px solid;text-align:left;background:var(--white);cursor:pointer}.scene-results b,.scene-results span{display:block}.scene-results b{font-size:12px}.scene-results span{margin-top:6px;color:var(--muted);font-size:10px}
@media(max-width:900px){.lab-header>p{display:none}.lab-layout{display:block}.lab-nav{position:sticky;top:82px;z-index:40;display:flex;width:100%;height:auto;padding:8px;overflow-x:auto;border-right:0;border-bottom:1px solid var(--line);background:rgba(244,240,231,.96)}.lab-nav>p{display:none}.lab-nav a{min-width:150px;border:1px solid var(--line)}.lab-content{padding:28px 18px 50px}.panel-head{grid-template-columns:1fr}.panel-head h1{font-size:clamp(46px,12vw,80px)}.panel-head>span{font-size:14px}.motion-studio,.map-console,.switch-console,.vision-console,.combat-console{grid-template-columns:1fr}.motion-canvas,.map-canvas,.vision-scene{min-height:420px}.timeline-panel{min-height:340px}.map-inspector{min-height:330px}.map-inspector h2{margin-top:32px}.build-grid{grid-template-columns:repeat(2,1fr)}.storyboard{grid-template-columns:1fr}.frame{height:150px}.video-flow{grid-template-columns:repeat(2,1fr)}}
@media(max-width:560px){.lab-header{min-height:70px;padding:10px 14px}.lab-brand>span{width:39px;height:39px}.lab-brand strong{font-size:9px}.back-link{font-size:9px}.lab-nav{top:70px}.lab-nav a{min-width:132px;min-height:45px}.lab-content{padding:24px 12px 44px}.panel-head h1{font-size:46px}.motion-studio,.book-stage,.build-console,.map-console,.switch-console,.vision-console,.terminal-console,.combat-console,.video-console,.search-console{min-height:460px;border-radius:24px;box-shadow:6px 6px 0}.motion-canvas{min-height:300px}.motion-word{font-size:76px}.book{width:84%;height:420px}.book-page{padding:28px}.book-page h2{font-size:45px}.build-grid{grid-template-columns:1fr}.switch-form fieldset{flex-wrap:wrap}.vision-tools dl{margin-top:28px}.terminal-console pre{min-height:300px;padding:20px;font-size:12px}.terminal-top{align-items:flex-start;gap:8px}.command-chips{flex-wrap:wrap}.combat-grid{width:94%}.combat-code textarea{min-height:250px}.video-flow{grid-template-columns:1fr 1fr}.scene-search{display:grid}.scene-results{grid-template-columns:1fr}.video-player{height:220px}}
@media(prefers-reduced-motion:reduce){*{scroll-behavior:auto!important;animation-duration:.01ms!important;transition-duration:.01ms!important}}