:root{--design-green:#76b900;--design-cyan:#44d7ff;--design-ink:#07120c;--design-panel:#0b1812}
.design-page{background:#f4f7f5;color:#14211a;overflow-x:hidden}.design-page main{position:relative;z-index:1}.design-page .ambient-particles{opacity:.45}
.design-hero{min-height:720px;padding:130px max(5vw,28px) 76px;display:grid;grid-template-columns:minmax(0,.86fr) minmax(520px,1.14fr);gap:5vw;align-items:center;background:radial-gradient(circle at 78% 40%,rgba(118,185,0,.19),transparent 28%),radial-gradient(circle at 8% 15%,rgba(68,215,255,.1),transparent 25%),linear-gradient(135deg,#050b08 0%,#07130d 48%,#0b1b12 100%);color:#fff;position:relative;overflow:hidden}
.design-hero:before{content:"";position:absolute;inset:0;background-image:linear-gradient(rgba(118,185,0,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(118,185,0,.035) 1px,transparent 1px);background-size:42px 42px;mask-image:linear-gradient(to right,black,transparent 80%)}
.design-hero-copy,.design-console{position:relative;z-index:1}.design-kicker,.kit-kicker{display:flex;align-items:center;gap:10px;color:#9bd536;letter-spacing:.16em;font-size:12px;font-weight:800}.design-kicker i{width:32px;height:2px;background:#76b900;box-shadow:0 0 14px #76b900}.design-hero h1{font-size:clamp(48px,6vw,84px);line-height:.98;letter-spacing:-.055em;margin:24px 0}.design-hero h1 em{font-style:normal;color:#9bdd31;text-shadow:0 0 30px rgba(118,185,0,.25)}.design-hero-copy>p{max-width:650px;color:#b9c8c0;font-size:18px;line-height:1.85}.design-actions,.kit-actions{display:flex;gap:12px;flex-wrap:wrap;margin-top:30px}.design-actions .button,.kit-actions .button{min-width:156px}.design-proof{display:flex;gap:28px;margin-top:36px;color:#899b91;font-size:12px;letter-spacing:.04em}.design-proof span{display:flex;align-items:center;gap:8px}.design-proof b{color:#fff;font-size:18px}
.design-console{border:1px solid rgba(164,233,64,.28);background:rgba(4,12,7,.75);border-radius:22px;padding:13px;box-shadow:0 35px 90px rgba(0,0,0,.55),inset 0 0 50px rgba(118,185,0,.035);backdrop-filter:blur(12px);transform:perspective(1300px) rotateY(-3deg)}.console-top{height:42px;padding:0 10px;display:flex;align-items:center;justify-content:space-between;color:#71927e;font-size:10px;letter-spacing:.12em}.console-top span{display:flex;align-items:center;gap:8px}.console-top i{width:7px;height:7px;border-radius:50%;background:#76b900;box-shadow:0 0 12px #76b900}.console-top b{color:#9bd536}.console-stage{height:390px;overflow:hidden;border-radius:14px;position:relative;background:#101a15}.console-stage img{width:100%;height:100%;object-fit:cover;filter:saturate(.88) contrast(1.08)}.console-stage:after{content:"";position:absolute;inset:0;background:linear-gradient(180deg,transparent 55%,rgba(2,9,5,.88))}.scanline{position:absolute;z-index:2;inset:0;background:linear-gradient(180deg,transparent 48%,rgba(118,185,0,.18) 50%,transparent 52%);background-size:100% 80px;animation:scan 4s linear infinite;pointer-events:none}.console-label{position:absolute;z-index:3;bottom:18px;left:18px;font:700 11px/1 monospace;letter-spacing:.14em;color:#c6e99c}.console-flow{display:grid;grid-template-columns:repeat(7,auto);align-items:center;justify-content:space-between;gap:6px;padding:15px 8px 4px}.console-flow span{font:700 9px/1.3 monospace;color:#9bb0a3}.console-flow span b{display:block;color:#76b900;margin-bottom:4px}.console-flow i{font-style:normal;color:#40624e}@keyframes scan{from{background-position:0 -80px}to{background-position:0 400px}}
.tool-rail{max-width:1320px;margin:-34px auto 0;position:relative;z-index:4;background:#fff;border:1px solid #dce6df;border-radius:18px;box-shadow:0 18px 55px rgba(19,52,33,.13);display:grid;grid-template-columns:repeat(5,1fr);padding:12px}.tool-rail a{min-width:0;padding:17px 18px;display:grid;grid-template-columns:48px minmax(0,1fr);grid-template-rows:auto auto;column-gap:12px;align-items:center;color:#183024;border-radius:12px}.tool-rail a:hover{background:#f1f8ed}.tool-rail a:not(:last-child){border-right:1px solid #e6ece8}.tool-rail b{font-size:14px}.tool-rail small{color:#7b8981;font-size:11px}.app-icon{grid-row:1/3;width:46px;height:46px;border-radius:12px;display:grid;place-items:center;font-size:17px;font-weight:900;letter-spacing:-.04em}.app-icon.ps{background:#071e34;color:#31a8ff;border:1px solid #31a8ff}.app-icon.s3{background:#111;color:#fff}.app-icon.bl{background:#eef6ff}.app-icon.bl svg{width:32px;height:32px;fill:#e87518;stroke:#1976bb;stroke-width:1.5}.app-icon.bk{background:#eaf8ff;color:#23a9d5}.app-icon.cx{background:#101713;color:#9dde36;font-family:monospace}
.design-section{max-width:1320px;margin:0 auto;padding:100px 24px}.design-heading{display:flex;align-items:flex-end;justify-content:space-between;gap:40px;margin-bottom:40px}.design-heading>div>span{color:#5d8f12;letter-spacing:.15em;font-size:11px;font-weight:850}.design-heading h2{font-size:clamp(30px,4vw,52px);line-height:1.08;letter-spacing:-.04em;margin:9px 0 0;color:#12241a}.design-heading>p{max-width:500px;color:#738178;line-height:1.8}.pipeline-grid{display:grid;grid-template-columns:repeat(5,1fr);border:1px solid #dbe5de;border-radius:20px;overflow:hidden;background:#fff}.pipeline-grid article{position:relative;min-height:330px;padding:30px 24px;display:flex;flex-direction:column;border-right:1px solid #e3ebe6}.pipeline-grid article:last-child{border-right:0}.pipeline-grid article:before{content:"";position:absolute;left:0;right:100%;bottom:0;height:4px;background:#76b900;transition:.3s}.pipeline-grid article:hover:before{right:0}.pipeline-grid em{font-style:normal;font:800 42px/1 monospace;color:#e2e9e5}.pipeline-dot{width:10px;height:10px;background:#76b900;border-radius:50%;margin:22px 0;box-shadow:0 0 0 7px rgba(118,185,0,.1)}.pipeline-grid article>span{font-size:10px;color:#69931f;letter-spacing:.14em;font-weight:800}.pipeline-grid h3{font-size:21px;margin:10px 0 12px;line-height:1.25}.pipeline-grid p{color:#6e7c73;line-height:1.7;font-size:14px;margin:0}.pipeline-grid article>b{margin-top:auto;padding-top:24px;font-size:11px;color:#2f493a}
.media-lab{max-width:none;background:#09140e;color:#fff;padding-left:max(24px,calc((100vw - 1272px)/2));padding-right:max(24px,calc((100vw - 1272px)/2))}.media-lab .design-heading h2,.design-heading.light h2{color:#fff}.media-lab .design-heading>p,.design-heading.light>p{color:#8fa096}.media-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.media-card{border:1px solid rgba(157,209,92,.17);background:#0e1d15;border-radius:18px;overflow:hidden}.media-card.media-wide{grid-column:1/-1;display:grid;grid-template-columns:1.15fr .85fr}.media-image{height:285px;position:relative;overflow:hidden}.media-wide .media-image{height:390px}.media-image img{width:100%;height:100%;object-fit:cover;transition:.55s}.media-card:hover img{transform:scale(1.035)}.media-image>span{position:absolute;left:15px;top:15px;padding:7px 9px;border-radius:6px;background:rgba(4,10,6,.78);color:#9dda37;font-size:9px;font-weight:850;letter-spacing:.12em}.media-card>div:last-child{padding:27px}.media-card>div:last-child>span{font-size:10px;color:#83b936;letter-spacing:.14em;font-weight:800}.media-card h3{font-size:25px;margin:10px 0}.media-card p{color:#9cab9f;line-height:1.75}.media-card a{display:inline-flex;margin-top:10px;color:#9dda37;font-weight:750}.video-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:18px}.video-grid article{background:#0e1d15;border:1px solid rgba(157,209,92,.17);border-radius:18px;overflow:hidden}.video-frame{position:relative;aspect-ratio:16/9;background:#020403}.video-frame iframe{position:absolute;inset:0;width:100%;height:100%;border:0}.video-grid article>div:last-child{display:flex;justify-content:space-between;gap:12px;padding:18px 20px}.video-grid b{font-size:14px}.video-grid span{font-size:11px;color:#819188}
.kit-section{display:grid;grid-template-columns:1.12fr .88fr;gap:50px;align-items:center}.kit-copy h2{font-size:clamp(34px,4vw,56px);margin:12px 0 18px;letter-spacing:-.04em}.kit-copy>p{max-width:730px;color:#68786e;line-height:1.85;font-size:16px}.kit-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:25px}.kit-tags span{padding:8px 10px;border:1px solid #cfe1c5;border-radius:7px;background:#f4faef;color:#547c1a;font:800 9px/1 monospace}.kit-checklist{background:#fff;border:1px solid #dce6df;border-radius:20px;padding:28px;box-shadow:0 18px 55px rgba(19,52,33,.08)}.kit-checklist>span{font:850 11px/1 monospace;color:#77a430;letter-spacing:.15em}.kit-checklist ol{list-style:none;padding:0;margin:20px 0 0}.kit-checklist li{display:grid;grid-template-columns:72px 1fr;gap:12px;padding:16px 0;border-top:1px solid #edf1ee}.kit-checklist b{font-size:14px}.kit-checklist small{color:#748078}
.codex-section{max-width:none;background:linear-gradient(135deg,#07110b,#0b1d12);color:#fff;padding-left:max(24px,calc((100vw - 1272px)/2));padding-right:max(24px,calc((100vw - 1272px)/2))}.codex-layout{display:grid;grid-template-columns:.78fr 1.22fr;gap:24px}.tutorial-steps{display:flex;flex-direction:column;gap:9px}.tutorial-steps article{display:grid;grid-template-columns:48px 1fr;gap:12px;padding:16px;border:1px solid rgba(255,255,255,.08);border-radius:12px;background:rgba(255,255,255,.025);cursor:pointer;transition:.25s}.tutorial-steps article:hover,.tutorial-steps article.active{border-color:rgba(118,185,0,.55);background:rgba(118,185,0,.09);transform:translateX(4px)}.tutorial-steps article>b{font:800 18px/1 monospace;color:#79b91f}.tutorial-steps span{font-weight:800}.tutorial-steps p{color:#8ea097;font-size:12px;line-height:1.6;margin:5px 0 0}.code-console{border:1px solid rgba(118,185,0,.28);background:#040906;border-radius:18px;overflow:hidden;box-shadow:0 28px 70px rgba(0,0,0,.35)}.code-top{height:48px;background:#0c1710;border-bottom:1px solid #17261c;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 18px}.code-top>span{display:flex;gap:6px}.code-top i{width:8px;height:8px;border-radius:50%;background:#37483e}.code-top i:nth-child(1){background:#ef6262}.code-top i:nth-child(2){background:#e8ba54}.code-top i:nth-child(3){background:#76b900}.code-top b{font:700 11px/1 monospace;color:#b8c7be}.code-top em{justify-self:end;font:800 9px/1 monospace;color:#76b900}.code-console pre{margin:0;padding:26px;overflow:auto;color:#d8e7dc;font:13px/1.75 ui-monospace,SFMono-Regular,Consolas,monospace;white-space:pre}.kw{color:#b38eff}.cm{color:#62766a}.st{color:#a8d66d}.nu{color:#56c9ed}.fn{color:#efce76}.prompt-box{margin:0 18px 18px;padding:18px;border:1px solid #203728;border-radius:12px;background:#0a140d}.prompt-box>span{font:800 9px/1 monospace;color:#76b900;letter-spacing:.13em}.prompt-box p{color:#9eada4;font-size:12px;line-height:1.7;margin:10px 0}.prompt-box button{border:1px solid #6c9d28;background:transparent;color:#a7da61;border-radius:8px;padding:9px 13px;cursor:pointer;font-weight:750}.prompt-box button.copied{background:#76b900;color:#061006}.safety-row{display:grid;grid-template-columns:repeat(4,1fr);margin-top:24px;border:1px solid rgba(255,255,255,.08);border-radius:13px;overflow:hidden}.safety-row span{padding:18px;font-size:11px;color:#a7b5ac;border-right:1px solid rgba(255,255,255,.08)}.safety-row span:last-child{border:0}.safety-row b{color:#76b900;margin-right:8px;font-family:monospace}
.use-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}.use-grid article{min-height:200px;background:#fff;border:1px solid #dce6df;border-radius:16px;padding:25px;display:flex;flex-direction:column}.use-grid article>span{font:800 11px/1 monospace;color:#76a32f}.use-grid h3{font-size:20px;margin:24px 0 9px}.use-grid p{color:#758279;font-size:13px;line-height:1.6}.use-grid b{margin-top:auto;font:800 10px/1 monospace;color:#5f8e1e;letter-spacing:.08em}
@media(max-width:1050px){.design-hero{grid-template-columns:1fr;min-height:0}.design-hero-copy{max-width:780px}.design-console{transform:none}.tool-rail{grid-template-columns:repeat(3,1fr);margin:18px 18px 0}.tool-rail a:nth-child(3){border-right:0}.pipeline-grid{grid-template-columns:repeat(2,1fr)}.pipeline-grid article{border-bottom:1px solid #e3ebe6}.media-card.media-wide{grid-template-columns:1fr}.media-wide .media-image{height:330px}.codex-layout{grid-template-columns:1fr}.tutorial-steps{display:grid;grid-template-columns:1fr 1fr}.use-grid{grid-template-columns:repeat(2,1fr)}}
@media(max-width:720px){.design-hero{padding:102px 18px 40px;gap:32px}.design-hero h1{font-size:43px}.design-hero-copy>p{font-size:15px}.design-proof{gap:12px;flex-wrap:wrap}.design-proof span{width:calc(50% - 8px)}.console-stage{height:250px}.console-flow{overflow:auto;justify-content:start;gap:12px}.console-flow span{min-width:58px}.tool-rail{grid-template-columns:1fr 1fr;padding:8px}.tool-rail a{padding:13px 10px;grid-template-columns:40px minmax(0,1fr)}.tool-rail a:not(:last-child){border-right:0}.tool-rail a:nth-child(odd){border-right:1px solid #e6ece8}.tool-rail a:last-child{grid-column:1/-1}.app-icon{width:38px;height:38px;border-radius:10px;font-size:14px}.design-section{padding:68px 18px}.design-heading{display:block;margin-bottom:28px}.design-heading>p{margin-top:13px;font-size:14px}.pipeline-grid{grid-template-columns:1fr}.pipeline-grid article{min-height:260px;border-right:0;padding:24px}.media-grid,.video-grid{grid-template-columns:1fr}.media-card.media-wide{grid-column:auto}.media-wide .media-image,.media-image{height:230px}.media-card h3{font-size:21px}.video-grid article>div:last-child{display:block}.video-grid span{display:block;margin-top:5px}.kit-section{grid-template-columns:1fr;gap:28px}.tutorial-steps{grid-template-columns:1fr}.code-console pre{font-size:11px;padding:18px}.safety-row{grid-template-columns:1fr 1fr}.safety-row span:nth-child(2){border-right:0}.safety-row span{border-bottom:1px solid rgba(255,255,255,.08)}.use-grid{grid-template-columns:1fr}.design-page.lang-en .design-hero h1{font-size:39px}.design-page.lang-en .tool-rail small{font-size:9px}}
@media(prefers-reduced-motion:reduce){.scanline{animation:none}.media-card img,.pipeline-grid article,.tutorial-steps article{transition:none}}

/* V7.10.1 domestic video sources and fixed-header anchor feedback */
body.design-page{overflow:visible}
#photoshop,#style3d,#blender,#blenderkit,#codex-blender{scroll-margin-top:110px}
.pipeline-grid article,.kit-section,.codex-section{transition:box-shadow .3s,border-color .3s,background-color .3s}
.pipeline-grid article.anchor-focus{border-color:#76b900;background:#f3faed;box-shadow:inset 0 0 0 2px rgba(118,185,0,.28)}
.kit-section.anchor-focus{border-radius:20px;box-shadow:0 0 0 3px rgba(118,185,0,.25)}
.codex-section.anchor-focus{box-shadow:inset 0 0 0 3px rgba(157,218,55,.3)}
.video-grid article>div:last-child{align-items:center}
.video-grid article>div:last-child>div{min-width:0}
.video-grid b,.video-grid span{display:block}
.video-grid span{margin-top:5px}
.video-source-link{flex:0 0 auto;padding:8px 10px;border:1px solid rgba(157,209,92,.28);border-radius:7px;color:#9dda37;font-size:11px;font-weight:800;white-space:nowrap}
.video-source-link:hover{border-color:#9dda37;background:rgba(118,185,0,.09)}
@media(max-width:720px){#photoshop,#style3d,#blender,#blenderkit,#codex-blender{scroll-margin-top:90px}.video-grid article>div:last-child{display:flex;align-items:flex-start}.video-source-link{margin-top:0}}

/* V7.10.3 scroll-performance safeguards */
@media(max-width:1050px),(hover:none) and (pointer:coarse){.design-console{backdrop-filter:none;-webkit-backdrop-filter:none}.scanline{display:none}}

/* V7.10.4 mobile media fit + resilient tutorial cards */
.video-state{display:flex;align-items:center;gap:7px;margin-top:6px;color:#7f9186;font-size:10px;line-height:1.35}
.video-state i{width:6px;height:6px;border-radius:50%;background:#76b900;box-shadow:0 0 8px rgba(118,185,0,.65);flex:0 0 6px}
.video-fallback{position:absolute;inset:0;display:grid;place-items:center;padding:24px;text-align:center;color:#cbd8cf;background:linear-gradient(145deg,#07100a,#101d15)}
.video-fallback a{color:#a7dc59;font-weight:800}
@media(max-width:720px){
  .design-hero{padding-top:calc(44px + env(safe-area-inset-top,0px))}
  .design-hero-copy{min-width:0}
  .design-hero h1{overflow:visible;word-break:keep-all}
  .design-console{padding:10px;border-radius:18px}
  .console-stage{height:auto;aspect-ratio:16/9;background:#07100b}
  .console-stage img{object-fit:contain}
  .media-wide .media-image{height:auto;aspect-ratio:4/3;background:#07100b}
  .media-wide .media-image img{object-fit:contain}
}