:root{--black:#111215;--paper:#f3efe7;--red:#d94938;--soft:#c6c1b9}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:var(--paper);color:var(--black);font-family:"Hiragino Mincho ProN","Yu Mincho",serif}a{color:inherit}button{font:inherit}button:focus-visible,a:focus-visible{outline:3px solid var(--red);outline-offset:4px}.skip{position:absolute;z-index:100;top:-100px;left:10px;background:#fff;padding:10px}.skip:focus{top:10px}.fiction{margin:0;padding:8px 18px;background:#dedad3;text-align:center;font:11px/1.6 "Hiragino Kaku Gothic ProN",sans-serif}.top{display:flex;align-items:center;gap:30px;padding:16px 3vw;background:#111215;color:#fff}.brand{text-decoration:none;font-size:25px;white-space:nowrap}.brand span{display:block;font:8px ui-monospace,monospace;letter-spacing:.12em}.top nav{display:flex;gap:28px;margin-left:auto;font:12px "Hiragino Kaku Gothic ProN",sans-serif}.top nav a{text-decoration:none}.issue{font:10px ui-monospace,monospace}.hero{position:relative;display:grid;grid-template-columns:50% 50%;min-height:700px;background:#f2eee5;overflow:hidden}.hero-left{position:relative;z-index:2;padding:60px 3vw 120px}.hero-left>span{font:10px ui-monospace,monospace;letter-spacing:.16em}.hero h1{font-weight:500;font-size:clamp(100px,14vw,220px);letter-spacing:-.14em;line-height:.95;margin:55px 0 38px;white-space:nowrap}.hero h1 span:not(.dot){font-size:.5em;letter-spacing:-.1em}.hero h1 .dot{color:var(--red)}.hero-left p{font-size:25px;line-height:1.5}.hero-left a{display:inline-flex;gap:35px;margin-top:20px;padding:12px 0;border-bottom:2px solid var(--black);font:700 13px "Hiragino Kaku Gothic ProN",sans-serif;text-decoration:none}.hero-left a b{font-size:25px}.hero-right{position:relative;overflow:hidden;background:#d5d0c4}.hero-right:before{content:"";position:absolute;inset:0;background:repeating-linear-gradient(90deg,transparent 0 36px,#c2baaf 37px 38px)}.hero-fabric{position:absolute;inset:0 15%;background:#25436b;clip-path:polygon(20% 0,80% 0,100% 100%,0 100%);box-shadow:inset 0 0 100px #102743}.hero-fabric:before{content:"";position:absolute;inset:0;background:repeating-radial-gradient(circle at 50% 50%,transparent 0 24px,rgba(255,255,255,.17) 25px 27px,transparent 28px 48px);transform:skewY(-9deg)}.hero-fold{position:absolute;left:45%;top:-10%;width:17%;height:130%;background:rgba(5,22,49,.6);transform:rotate(14deg);box-shadow:30px 0 0 rgba(255,255,255,.08)}.fold-two{left:15%;transform:rotate(-15deg);background:rgba(250,250,255,.09)}.hero-obi{position:absolute;left:-20%;right:-20%;top:45%;height:19%;background:var(--red);transform:rotate(-13deg);box-shadow:0 12px 0 rgba(14,16,20,.5)}.hero-right>span{position:absolute;right:18px;bottom:75px;writing-mode:vertical-rl;font:10px ui-monospace,monospace;letter-spacing:.14em}.hero-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:20px;padding:16px 3vw;border-top:1px solid var(--black);background:#f2eee5;font:10px ui-monospace,monospace;letter-spacing:.1em}.compose{padding:100px 3vw 125px;background:#111215;color:#f3efe7}.compose-header{display:grid;grid-template-columns:140px minmax(0,1fr) 280px;align-items:end;gap:30px;margin-bottom:65px}.compose-header span,.guide>span{font:10px ui-monospace,monospace;letter-spacing:.15em}.compose h2,.guide h2{font-size:clamp(60px,8vw,125px);font-weight:500;line-height:1.1;letter-spacing:-.11em;margin:0}.compose-header p{font-size:13px;line-height:2}.composition{display:grid;grid-template-columns:minmax(0,1.35fr) minmax(295px,.65fr);gap:22px}.board{padding:17px;background:#e3dfd5;color:#1b1b1c}.board-header{display:flex;justify-content:space-between;gap:10px;border-bottom:2px solid #222;padding:8px 0;font:10px ui-monospace,monospace;letter-spacing:.12em}.board-view{position:relative;display:grid;place-items:center;min-height:660px;overflow:hidden;background:#c9c4bb;--base:#1e3c66;--motif:#7f9bae;--obi:#be4534}.board-grid{position:absolute;inset:0;background:repeating-linear-gradient(0deg,transparent 0 39px,rgba(0,0,0,.07) 40px 41px),repeating-linear-gradient(90deg,transparent 0 39px,rgba(0,0,0,.07) 40px 41px)}.kimono{position:relative;z-index:1;width:min(78%,500px);height:auto;filter:drop-shadow(15px 25px 12px rgba(0,0,0,.22))}.kimono .robe{fill:var(--base);stroke:#15191d;stroke-width:5;transition:fill .35s}.kimono .motif{opacity:.75}.kimono .collar{fill:none;stroke:#eee8dc;stroke-width:19;stroke-linejoin:round;stroke-linecap:round}.kimono .obi{fill:var(--obi);stroke:#1b1b1c;stroke-width:5;transition:fill .35s}.kimono .obi-fold{fill:none;stroke:rgba(255,255,255,.3);stroke-width:5}.board-label{position:absolute;z-index:2;left:20px;bottom:20px;color:#161718}.board-label span{display:block;font:9px ui-monospace,monospace;letter-spacing:.1em}.board-label strong{display:block;font-size:42px;font-weight:500;margin-top:5px}.board-foot{font-size:11px;line-height:1.7}.palette{padding:23px;background:#f0ede5;color:#151515}.palette-block>span{font:10px ui-monospace,monospace;letter-spacing:.15em}.palette h3{font-size:29px;font-weight:500;margin:14px 0 18px}.swatches,.obi-options{display:grid;grid-template-columns:repeat(3,1fr);gap:7px}.palette button{cursor:pointer}.swatches button,.obi-options button{min-height:116px;padding:9px 4px;border:1px solid #222;background:transparent;color:#222;font-size:13px}.swatches button[aria-pressed=true],.obi-options button[aria-pressed=true]{border:3px solid #111;font-weight:bold}.palette i{display:block;height:54px;width:48px;max-width:75%;margin:2px auto 11px;background:#1e3c66;transform:skewX(-15deg)}.swatches button:nth-child(2) i{background:#e4d7b9}.swatches button:nth-child(3) i{background:#713a57}.obi-options button:nth-child(1) i{background:#be4534}.obi-options button:nth-child(2) i{background:#b28b42}.obi-options button:nth-child(3) i{background:#368e87}.palette-block:nth-child(2){margin-top:55px}.palette-note{margin-top:55px;border-top:3px solid #111;padding-top:18px}.palette-note span{font:10px ui-monospace,monospace;letter-spacing:.12em}.palette-note p{font-size:34px;margin:17px 0}.palette-note small{font:11px/1.8 "Hiragino Kaku Gothic ProN",sans-serif}.reset{margin-top:28px;border:1px solid #111;background:transparent;padding:13px;width:100%;text-align:left}.guide{padding:100px 3vw 120px;background:#e7e2d9}.guide-main{display:grid;grid-template-columns:1fr 1fr;gap:7vw;margin-top:35px}.guide-list p{padding:18px 0;border-top:2px solid #111;font-size:13px;line-height:1.9}.guide-list b{display:block;font-size:23px;font-weight:500;margin-bottom:7px}.end{padding:95px 3vw 115px;background:#bd4436;color:#fff;min-height:540px}.end span{font:10px ui-monospace,monospace;letter-spacing:.14em}.end p{font-size:clamp(70px,10vw,150px);line-height:1.2;letter-spacing:-.1em;margin:45px 0}.end a{display:inline-block;padding:12px 0;border-bottom:1px solid;text-decoration:none;font-size:14px}footer{display:flex;justify-content:space-between;gap:20px;padding:28px 3vw;background:#111215;color:#fff;font:11px "Hiragino Kaku Gothic ProN",sans-serif}footer a{text-decoration:none}@media(max-width:1050px){.hero h1{font-size:14vw}.compose-header{grid-template-columns:100px 1fr}.compose-header p{grid-column:2}.composition{grid-template-columns:1fr 280px}.board-view{min-height:590px}.swatches,.obi-options{gap:4px}}@media(max-width:760px){.issue{display:none}.top nav{gap:12px}.top nav a{font-size:10px}.hero{display:block;min-height:920px}.hero-left{padding:60px 20px}.hero h1{font-size:18vw;margin:40px 0}.hero-right{position:absolute;left:12%;right:0;bottom:58px;height:350px}.hero-bottom{padding:15px 20px}.compose,.guide,.end{padding:80px 20px 95px}.compose-header{display:block}.compose h2{margin:25px 0}.compose-header p{max-width:500px}.composition{display:block}.board{margin-bottom:25px}.board-view{min-height:570px}.palette{max-width:none}.guide-main{display:block}.guide h2{margin-bottom:45px}}@media(max-width:520px){.fiction{font-size:10px}.top{padding:13px 15px}.brand{font-size:19px}.brand span{font-size:6px}.top nav a:first-child,.top nav a:nth-child(2){display:none}.hero{min-height:790px}.hero-left{padding:45px 15px}.hero-left>span{font-size:8px}.hero h1{font-size:20vw}.hero-left p{font-size:20px}.hero-right{bottom:54px;left:15%;height:315px}.hero-bottom{padding:12px 15px}.hero-bottom span:last-child{display:none}.compose h2,.guide h2{font-size:56px}.board{padding:10px}.board-view{min-height:440px}.kimono{width:91%}.board-label strong{font-size:31px}.palette{padding:18px}.swatches button,.obi-options button{min-height:95px;font-size:11px}.palette i{height:42px;width:40px}.palette-note p{font-size:28px}.guide-list b{font-size:19px}.end p{font-size:63px}footer{display:block}footer a{display:block;margin-top:10px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}

@media(max-width:520px){.hero-right{height:270px}}

/* A garment-first cover for the fictional kimono sample. */
.hero{display:block;position:relative;min-height:780px;background:#191a1d;color:#fff;overflow:hidden}
.hero-photo,.hero-shade{position:absolute;inset:0;width:100%;height:100%}
.hero-photo{object-fit:cover;object-position:center 51%;display:block}
.hero-shade{background:linear-gradient(90deg,rgba(10,13,19,.89) 0%,rgba(10,13,19,.59) 32%,rgba(10,13,19,.06) 72%),linear-gradient(0deg,rgba(10,13,19,.47),transparent 38%)}
.hero-left{position:relative;z-index:1;min-height:780px;padding:30px clamp(24px,5vw,90px) 105px;display:flex;flex-direction:column;align-items:flex-start;justify-content:space-between}
.hero-left>.hero-industry{display:inline-block;background:#f3efe7;color:#1c2330;padding:11px 16px;font:800 17px/1.35 "Hiragino Kaku Gothic ProN","Yu Gothic",sans-serif;letter-spacing:0;box-shadow:6px 6px 0 #bd4436}
.hero-copy{max-width:690px}
.hero-copy .hero-eyebrow{font:700 11px/1.5 ui-monospace,monospace;letter-spacing:.15em;color:#f5d9aa}
.hero-left .hero-name{font:700 24px/1.4 "Hiragino Mincho ProN","Yu Mincho",serif;letter-spacing:.04em;margin:18px 0 8px}
.hero h1{font-size:clamp(64px,6.3vw,105px);font-weight:700;letter-spacing:-.095em;line-height:1.2;white-space:normal;margin:10px 0 16px;text-shadow:0 3px 24px #0009}
.hero-copy>p:not(.hero-name){font-size:19px;line-height:1.75;margin:0;text-shadow:0 2px 12px #000a}
.hero-left a{border-color:#f4d6a1;color:#fff;font-size:14px;margin-top:30px}
.hero-bottom{z-index:1;border-top:1px solid #ffffff83;background:#111215b8;color:#fff}
@media(max-width:760px){.hero{min-height:700px}.hero-left{min-height:700px;padding:25px 25px 95px}.hero-photo{object-position:63% center}.hero-shade{background:linear-gradient(0deg,rgba(7,11,20,.88),rgba(7,11,20,.52) 48%,rgba(7,11,20,.08) 88%)}.hero h1{font-size:clamp(43px,9vw,72px)}.hero-bottom{bottom:0}}
@media(max-width:520px){.hero{min-height:660px}.hero-left{min-height:660px;padding:20px 18px 91px}.hero-left>.hero-industry{font-size:12px;padding:9px 10px}.hero-photo{object-position:66% center}.hero h1{font-size:clamp(40px,10.7vw,53px);line-height:1.2;margin:8px 0 10px}.hero-left .hero-name{font-size:19px;margin:12px 0 5px}.hero-copy>p:not(.hero-name){font-size:14px}.hero-left a{font-size:12px;margin-top:20px}.hero-bottom{font-size:8px;display:block}.hero-bottom span{display:block}.hero-bottom span:last-child{display:none}}