:root{--paper:#f4f2ec;--ink:#1c1d1a;--muted:#777971;--line:#deded5;--sans:Arial,"Microsoft YaHei",sans-serif;--serif:Georgia,"Times New Roman","Noto Serif CJK SC","SimSun",serif}*{box-sizing:border-box}body{margin:0;color:var(--ink);font-family:var(--serif);background:var(--paper)}a{color:inherit;text-decoration:none}a:hover{opacity:.65}a:focus-visible{outline:1px solid currentColor;outline-offset:6px}h1,h2,p{margin:0}h1,h2{font-weight:400}small,.nav,.asset-mark,.asset-note,.page-count,.record-note>span{font-family:var(--sans);font-weight:400;letter-spacing:.09em}small{font-size:11px}h1{font-size:clamp(36px,3.5vw,58px);line-height:1.07}h2{font-size:23px}.dark{background:#141513;color:#f1f0e9}.paper{background:var(--paper)}.nav{display:flex;align-items:center;gap:35px;height:80px;padding:0 5.7%;font-size:11px;letter-spacing:.08em;position:relative;z-index:2}.page-count{margin-left:auto}.landing{min-height:100svh;position:relative;overflow:hidden;display:flex;flex-direction:column}.hero-material{position:absolute!important;inset:0 0 0 48%;height:auto!important;border:0!important;background:#242520!important;opacity:.7}.hero-material .asset-mark{top:125px}.hero-material .asset-title{font-size:22px}.hero-copy{position:relative;margin:clamp(85px,15vh,180px) 8% 110px;max-width:670px}.hero-copy h1{font-size:clamp(50px,5.3vw,84px)}.hero-cn{font-size:clamp(20px,2vw,29px);line-height:1.8;margin-top:25px}.hero-en{font-size:21px;line-height:1.4;margin-top:26px}.hero-bottom{margin:auto 6% 40px;display:flex;gap:42px;position:relative;align-items:end}.hero-bottom>div{padding-right:42px;border-right:1px solid #393a34}.hero-bottom b{font-size:27px;font-weight:400}.hero-bottom small{display:block;margin-top:7px;font-size:10px}.explore{margin-left:auto;font-size:16px}.explore span{margin-left:35px;font-size:29px}.placeholder{position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;background:#e8e6de;border:1px solid #dadbd2;min-height:160px;overflow:hidden;text-align:center;padding:35px 18px;color:#777b71}.placeholder:before,.placeholder:after{content:'';position:absolute;background:currentColor;opacity:.12}.placeholder:before{width:1px;top:35px;bottom:35px;left:50%}.placeholder:after{height:1px;left:30px;right:30px;top:50%}.asset-mark{position:absolute;top:14px;font-size:8px}.asset-title{font-size:17px;background:inherit;padding:12px;z-index:1}.asset-note{position:absolute;bottom:14px;font-size:9px;letter-spacing:.04em}.dark .placeholder{background:#20221e;border-color:#42453b;color:#969b8a}.index-body{max-width:1150px;margin:28px auto 70px;padding:0 6%}.index-body h1{font-size:48px}.subtitle{font-size:20px;margin:13px 0 34px}.project-row{display:grid;grid-template-columns:60px minmax(190px,35%) 1fr 20px;gap:28px;border-bottom:1px solid var(--line);padding:19px 0;align-items:start;transition:opacity .25s}.project-number{font-size:42px;line-height:1}.project-row .placeholder{height:172px;min-height:0}.project-meta{padding-top:10px}.project-meta small{font-size:10px;color:#51554d}.project-meta h2{margin-top:12px;font-size:25px}.project-meta p{font-size:14px;line-height:1.7;color:var(--muted);margin-top:20px}.row-arrow{align-self:end;margin-bottom:15px;color:var(--muted)}.lesson-row{align-items:center;border-bottom:0}.lesson-row .project-number{color:#c4c6bd}.lesson-line{font-size:10px;letter-spacing:.12em;color:#afb2a6;font-family:var(--sans)}.lesson-row .project-meta p{margin-top:8px}.chapter-body{max-width:1440px;padding:28px 6% 0;margin:auto}.intro{display:grid;grid-template-columns:1fr .68fr;gap:10%;margin:15px 0 45px}.intro h1{margin:12px 0 24px}.lead{font-size:19px;line-height:1.8}.story{font-size:16px;line-height:1.9;color:var(--muted);padding-top:6px}.dark .story{color:#b0b3a8}.model-gallery{display:grid;grid-template-columns:1.8fr 1fr;gap:14px}.model-gallery .main-image{min-height:410px}.model-gallery>div:last-child{display:grid;gap:14px}.record-note{display:flex;justify-content:space-between;border-top:1px solid #53574a;margin-top:33px;padding-top:20px;font-size:10px}.record-note p{font-size:14px;line-height:1.8;color:#a1a597}.chapter-footer{display:flex;justify-content:space-between;gap:25px;margin-top:46px;border-top:1px solid var(--line);padding:24px 0;font-family:var(--sans);font-size:10px;letter-spacing:.1em}.dark .chapter-footer{border-color:#393d33}.chapter-footer span{margin-left:24px;font-size:18px}.ozon-gallery{display:grid;grid-template-columns:1.1fr 1fr;gap:8px}.listing-image{min-height:360px}.packing-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px}.packing-grid .placeholder{min-height:175px}.process{display:flex;justify-content:space-between;margin:32px 0 12px;padding:0 8px;gap:20px}.process span{display:block;font-size:22px;color:#84897b;margin-bottom:20px}.process small{font-size:9px}.process p{font-size:12px;margin-top:9px}.supply-grid{display:grid;grid-template-columns:1fr 30px .45fr 30px 1fr;gap:18px;align-items:center}.supply-panel,.you{border:1px solid var(--line);padding:17px}.supply-panel>p,.you>p{font-size:14px;margin:6px 0 17px}.supply-panel .placeholder{min-height:140px;margin-top:7px}.you{align-self:stretch}.you ul{list-style:none;padding:12px 0 0;margin:0;font-size:15px;line-height:2.1;color:#767a6e}.supply-arrow{font-size:29px;text-align:center}.lessons .chapter-body{max-width:1220px}.lessons-grid{display:grid;grid-template-columns:1fr .35fr;gap:9%}.lessons h1{font-size:47px}.lessons .lead{margin-top:16px;font-size:17px}.lesson-list{padding:0;margin:37px 0 0;list-style:none}.lesson-list li{display:flex;gap:30px;margin-bottom:23px}.lesson-list li>span{font-size:34px;line-height:1}.lesson-list h2{font-size:20px}.lesson-list p{font-size:13px;line-height:1.7;color:var(--muted);margin-top:6px}.closing-image{min-height:460px;align-self:start}.closing-copy{margin-top:30px;max-width:650px}.closing-copy p:first-child{font-size:22px;line-height:1.5}.closing-copy p:last-child{font-size:16px;line-height:1.8;color:var(--muted);margin-top:18px}.archive-placeholder{min-height:100svh}.archive-placeholder>h1,.archive-placeholder>p,.archive-placeholder>a{display:block;margin:35px 6%}main{animation:enter .35s ease}@keyframes enter{from{opacity:0;transform:translateY(5px)}to{opacity:1;transform:none}}@media(min-width:1500px){.chapter-body{padding-top:50px}.intro{margin-bottom:60px}}@media(max-width:850px){.nav{height:66px;padding:0 6%;gap:26px}.hero-material{inset:0 0 0 35%;opacity:.4}.hero-copy{margin:120px 7% 100px}.project-row{grid-template-columns:45px 32% 1fr 15px;gap:16px}.project-meta h2{font-size:20px}.project-row .placeholder{height:155px}.intro{gap:6%;grid-template-columns:1fr .8fr}.supply-grid{gap:10px;grid-template-columns:1fr 20px .55fr 20px 1fr}.supply-panel,.you{padding:12px}.supply-grid h2{font-size:19px}.asset-title{font-size:14px}.lessons-grid{grid-template-columns:1fr .4fr;gap:6%}.lessons h1{font-size:39px}.lesson-list h2{font-size:18px}}@media(max-width:600px){.nav{position:sticky;top:0;background:var(--paper);height:62px;font-size:10px;gap:25px}.nav-dark{background:#141513}.page-count{font-size:9px}.hero-material{inset:62px 0 0 25%;opacity:.32}.hero-copy{margin:100px 7% 85px}.hero-copy h1{font-size:45px}.hero-cn{font-size:20px}.hero-en{font-size:18px}.hero-bottom{gap:20px;margin:0 7% 28px}.hero-bottom>div{padding-right:20px}.hero-bottom b{font-size:23px}.explore{font-size:0}.explore span{font-size:27px;margin:0}.index-body{margin:25px 0 35px}.index-body h1{font-size:40px}.subtitle{font-size:17px;margin-bottom:27px}.project-row{grid-template-columns:40px 1fr 15px;gap:12px;padding:22px 0}.project-number{font-size:34px}.project-meta{grid-column:2;grid-row:1;padding:0}.project-meta p{margin-top:12px;font-size:13px}.project-row .placeholder{grid-column:2;grid-row:2;width:100%;height:155px;margin-top:5px}.row-arrow{grid-column:3;grid-row:1;align-self:center}.lesson-line{display:none}.lesson-row .project-meta{grid-column:2}.chapter-body{padding:24px 6% 0}.intro{display:block;margin:0 0 30px}.intro h1{font-size:34px;margin:12px 0 18px}.lead{font-size:17px}.story{font-size:14px;margin-top:23px}.model-gallery,.ozon-gallery{display:block}.model-gallery .main-image{min-height:245px}.model-gallery>div:last-child{grid-template-columns:1fr 1fr;margin-top:8px;gap:8px}.model-gallery>div:last-child .placeholder{min-height:165px}.record-note{display:block}.record-note p{margin-top:15px;font-size:12px}.listing-image{min-height:270px;margin-bottom:8px}.packing-grid .placeholder{min-height:145px}.process{gap:8px;padding:0}.process small{font-size:7px;letter-spacing:.03em}.process p{font-size:11px}.supply-grid{display:flex;flex-direction:column;gap:16px;align-items:stretch}.supply-panel{padding:17px}.supply-panel .placeholder{min-height:170px}.supply-arrow{transform:rotate(90deg)}.you{padding:17px}.you ul{display:grid;grid-template-columns:1fr 1fr;gap:0 12px;padding-top:0;font-size:14px}.lessons-grid{display:flex;flex-direction:column;gap:25px}.lessons h1{font-size:40px}.lesson-list li{gap:20px;margin-bottom:24px}.lesson-list li>span{font-size:30px}.lesson-list h2{font-size:18px}.closing-image{width:65%;min-height:260px;align-self:end}.closing-copy{margin-top:30px}.closing-copy p:first-child{font-size:19px}.closing-copy p:last-child{font-size:14px}.chapter-footer{font-size:8px;margin-top:35px}.chapter-footer span{margin-left:9px}}@media(prefers-reduced-motion:reduce){main{animation:none}*{scroll-behavior:auto!important;transition:none!important}}

/* User-supplied harbor photograph, Lessons chapter background. */
.lessons{position:relative;min-height:100svh;background:#252720 url("../public/lessons-harbor.png") center center/cover no-repeat;color:#f5f3ed;isolation:isolate}.lessons:before{content:"";position:absolute;inset:0;background:rgba(10,15,17,.62);z-index:-1}.lessons .lessons-grid{display:block;max-width:690px}.lessons .lesson-list p,.lessons .closing-copy p:last-child{color:#dddcd4}.lessons .chapter-footer{border-color:rgba(245,243,237,.3)}.lessons .nav{background:transparent}.lessons .chapter-body{position:relative}.lessons .closing-copy{padding-bottom:8px}@media(max-width:600px){.lessons{background-position:62% center}.lessons .nav{background:rgba(16,20,21,.9)}.lessons:before{background:rgba(10,15,17,.68)}}

/* User-supplied COMMERCE landing background. */
.landing{background:#141513 url("../public/commerce-cover.webp") center center/cover no-repeat;isolation:isolate}.landing:before{content:"";position:absolute;inset:0;background:rgba(8,10,9,.38);z-index:-1}.landing .nav{background:transparent}@media(max-width:600px){.landing{background-position:58% center}.landing:before{background:rgba(8,10,9,.5)}.landing .nav{background:rgba(14,16,14,.82)}}

.archive-image{margin:0;min-width:0}.archive-image img{display:block;width:100%;height:auto;background:#fff}.archive-image figcaption{font-size:10px;line-height:1.5;letter-spacing:.04em;font-family:var(--sans);color:#a8ad9f;margin-top:10px}.model-gallery{align-items:start}.model-gallery .main-image{min-height:0}.model-gallery>div:last-child{display:grid;gap:22px}.model-gallery .main-image img{aspect-ratio:1.45;object-fit:contain}.project-row .index-image img{height:172px;object-fit:contain}.project-row .index-image figcaption{display:none}.model-process{margin-top:38px;padding-top:22px;border-top:1px solid #53574a}.model-timeline{list-style:none;padding:0;margin:27px 0 0;display:grid;grid-template-columns:repeat(4,1fr);gap:28px}.model-timeline li{border-top:1px solid #53574a;padding-top:18px}.timeline-number{font-size:25px;display:block;margin-bottom:18px}.model-timeline h2{font-family:var(--sans);font-size:10px;letter-spacing:.08em;line-height:1.7;min-height:34px}.timeline-date{display:block;font-size:19px;margin:12px 0}.model-timeline p{font-size:14px;line-height:1.9;color:#b9bdb1}@media(max-width:850px){.model-timeline{grid-template-columns:repeat(2,1fr)}.project-row .index-image img{height:155px}}@media(max-width:600px){.project-row .index-image{grid-column:2;grid-row:2;margin-top:5px}.model-gallery .main-image{min-height:0}.model-gallery .main-image img{aspect-ratio:auto}.model-gallery>div:last-child{display:block}.model-gallery>div:last-child figure{margin-top:22px}.model-timeline{grid-template-columns:1fr;gap:24px}.model-timeline li{display:grid;grid-template-columns:35px 1fr;column-gap:15px}.timeline-number{grid-row:1/4;margin:0}.model-timeline h2{min-height:0}.timeline-date,.model-timeline p{grid-column:2}}

/* Aligned website screenshots: equal columns and complete, uncropped images. */
.model-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px;align-items:start}.model-gallery .archive-image img{width:100%;height:auto;aspect-ratio:1.22;object-fit:contain;background:#fff}.model-gallery .archive-image figcaption{margin-top:12px;line-height:1.6;min-height:32px}@media(max-width:850px){.model-gallery{gap:12px}}@media(max-width:600px){.model-gallery{display:grid;grid-template-columns:1fr;gap:24px}.model-gallery .archive-image img{aspect-ratio:1.22}.model-gallery .archive-image figcaption{min-height:0}}

.cross .supply-panel .archive-image{margin-top:16px}.cross .supply-panel .archive-image img{aspect-ratio:1.2;object-fit:contain;background:#e9e7e0}.cross .supply-panel .archive-image figcaption{color:#777971;font-size:10px;min-height:30px}.cross .supply-panel{align-self:stretch}.cross .you{align-self:stretch}@media(max-width:600px){.cross .supply-panel .archive-image img{aspect-ratio:auto;max-height:420px;object-fit:contain}}

.asset-frame{position:relative;overflow:hidden}.privacy-mask{position:absolute;background:#b9b9b5;display:block}.mask-orders .mask-one{left:6%;top:42%;width:13%;height:41%}.mask-orders .mask-two{left:57%;top:42%;width:16%;height:41%}.mask-warehouse .mask-one{left:6%;top:32%;width:88%;height:4%}.mask-warehouse .mask-two{left:73%;top:14%;width:15%;height:3%}.mask-reconciliation .mask-one{left:23%;top:7%;width:48%;height:4%}.mask-reconciliation .mask-two{left:0;top:79%;width:100%;height:21%}.ozon .ozon-gallery{display:block}.ozon-store-image{margin-bottom:28px}.ozon-store-image img{width:100%;height:auto}.ozon-materials{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:26px 18px}.ozon-materials .asset-frame{aspect-ratio:3/4}.ozon-materials img{width:100%;height:100%;object-fit:fill}.ozon .archive-image figcaption{color:#777971;line-height:1.6}.ozon-materials .mask-reconciliation{aspect-ratio:823/1102}@media(max-width:850px){.ozon-materials{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.ozon-materials{grid-template-columns:1fr;gap:24px}.ozon-materials .asset-frame{aspect-ratio:auto}.ozon-materials img{height:auto}.ozon-store-image{margin-bottom:24px}}

.ozon-materials .asset-frame{aspect-ratio:auto}.ozon-materials img{height:auto;object-fit:contain}

/* OZON supporting materials: aligned frames and captions. */
.ozon-materials{grid-template-columns:repeat(5,minmax(0,1fr));gap:18px;align-items:start}.ozon-materials .archive-image{min-width:0}.ozon-materials .asset-frame{height:280px;aspect-ratio:auto;display:flex;align-items:center;justify-content:center;background:#e9e7e0}.image-plane{position:relative;width:100%}.ozon-materials .image-plane{width:100%;max-width:210px;aspect-ratio:3/4}.ozon-materials img{width:100%;height:100%;object-fit:contain}.ozon-materials figcaption{margin-top:12px;min-height:34px}@media(max-width:1100px){.ozon-materials{grid-template-columns:repeat(3,minmax(0,1fr))}}@media(max-width:850px){.ozon-materials{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.ozon-materials{grid-template-columns:1fr}.ozon-materials .asset-frame{height:420px}.ozon-materials .image-plane{max-width:315px}.ozon-materials figcaption{min-height:0}}

.bag .intro{grid-template-columns:1.2fr 1fr;gap:7%}.bag h1{font-size:clamp(30px,3.1vw,48px);line-height:1.14}.bag-status{display:block;margin-top:25px;color:#777971}.bag-process{display:grid;grid-template-columns:repeat(6,1fr);list-style:none;padding:22px 0;margin:0 0 35px;border-top:1px solid var(--line);border-bottom:1px solid var(--line);gap:18px}.bag-process li{position:relative}.bag-process small{display:block;color:#777971;margin-bottom:12px}.bag-process span{font-family:var(--sans);font-size:10px;letter-spacing:.06em}.bag-process b{position:absolute;right:0;bottom:0;font-weight:400;color:#777971}.bag-gallery{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:20px;align-items:start}.bag-gallery .asset-frame,.bag-gallery video{width:100%;height:390px;background:#e9e7e0}.bag-gallery .image-plane{height:100%}.bag-gallery img{height:100%;object-fit:contain}.bag-gallery video{object-fit:contain}.bag-gallery figcaption{color:#777971}.bag-ending{margin-top:45px}.bag-ending p:last-child{font-size:19px;color:#777971}@media(max-width:850px){.bag-gallery .asset-frame,.bag-gallery video{height:300px}.bag-process{gap:10px}.bag-process b{display:none}}@media(max-width:600px){.bag .intro{display:block}.bag-process{grid-template-columns:repeat(3,1fr);gap:24px}.bag-gallery{grid-template-columns:1fr;gap:25px}.bag-gallery .asset-frame,.bag-gallery video{height:420px}.bag-ending p:last-child{font-size:17px}}

.project-row .cover-fill .asset-frame,.project-row .cover-fill .image-plane{height:172px;width:100%}.project-row .cover-fill img{width:100%;height:100%;object-fit:cover;object-position:center}@media(max-width:850px){.project-row .cover-fill .asset-frame,.project-row .cover-fill .image-plane{height:155px}}

/* Shared dark editorial palette for the project index and case studies. */
.dark.index,.dark.ozon,.dark.bag,.dark.cross{--paper:#141513;--ink:#f1f0e9;--muted:#b0b3a8;--line:#393d33;background:#141513;color:#f1f0e9}.dark.index .project-meta small{color:#b0b3a8}.dark.index .lesson-row .project-number{color:#73796a}.dark.index .lesson-line{color:#8a917e}.dark.index .project-meta>span{color:#b0b3a8}.dark.ozon .archive-image figcaption,.dark.bag .archive-image figcaption,.dark.cross .archive-image figcaption{color:#a8ad9f}.dark.ozon .ozon-materials .asset-frame,.dark.bag .bag-gallery .asset-frame,.dark.bag .bag-gallery video{background:#20221e}.dark.bag .bag-status,.dark.bag .bag-process small,.dark.bag .bag-process b,.dark.bag .bag-ending p:last-child{color:#b0b3a8}.dark.cross .you ul{color:#b0b3a8}.dark.cross .supply-panel .archive-image img{background:#20221e}.dark .process span{color:#a8ad9f}@media(max-width:600px){.dark.index .nav,.dark.ozon .nav,.dark.bag .nav,.dark.cross .nav{background:#141513}}

/* Muted city light behind the project archive. */
.dark.index{position:relative;isolation:isolate;background:#141918;min-height:100svh}.dark.index:before{content:"";position:fixed;inset:0;z-index:-2;pointer-events:none;background:url('../public/commerce-cover.webp') center/cover no-repeat;filter:saturate(.45);opacity:.3}.dark.index:after{content:"";position:fixed;inset:0;z-index:-1;pointer-events:none;background:linear-gradient(90deg,rgba(13,19,19,.8),rgba(13,19,19,.52)),linear-gradient(0deg,rgba(13,19,19,.52),transparent 80%)}.dark.index .nav{background:transparent}.dark.index .project-row{border-bottom-color:rgba(221,230,225,.18)}.dark.index .project-meta p,.dark.index .project-meta small{color:#c0c8c2}.dark.index .subtitle{color:#d0d6d1}@media(max-width:600px){.dark.index:before{background-position:58% center}.dark.index .nav{background:rgba(17,24,23,.86);backdrop-filter:blur(10px)}}