@font-face{font-family:DM;src:url('./assets/fonts/DMSans-Variable.ttf') format('truetype');font-weight:100 1000;font-display:swap}
@font-face{font-family:RoomTC;src:url('./assets/fonts/NotoSansTC-UI-Variable.woff2') format('woff2');font-weight:400 700;font-display:swap}
@font-face{font-family:RoomJP;src:url('./assets/fonts/NotoSansJP-UI-Variable.woff2') format('woff2');font-weight:400 700;font-display:swap}
:root{--paper:#f5f3ed;--surface:#fbfaf7;--stage:#e5e5dd;--ink:#242c27;--muted:#686f64;--line:#d8dacf;--accent:#dce99b;--coral:#a94734;--font:DM,RoomTC,'Microsoft JhengHei',sans-serif;--position:50%;color-scheme:light}
*{box-sizing:border-box}html{font-family:var(--font);font-synthesis:none;background:var(--paper);color:var(--ink)}html[lang=ja]{--font:DM,RoomJP,'Yu Gothic',sans-serif}body{margin:0;font-size:14px;line-height:1.6}a{color:inherit}button,select,input{font:inherit;color:inherit}button,select{cursor:pointer}button,a,input,select{-webkit-tap-highlight-color:transparent}button{border:0}button:focus-visible,a:focus-visible,input:focus-visible,select:focus-visible,summary:focus-visible{outline:2px solid var(--ink);outline-offset:5px}button:hover{background:var(--surface)}button[aria-pressed=true]{cursor:default}img{display:block;max-width:100%}h1,h2,h3,p,figure{margin:0}h1,h2{font-weight:500;letter-spacing:-.045em;line-height:1.28}h1{font-size:27px;max-width:250px}h2{font-size:24px}h3{font-size:14px;font-weight:600}[hidden]{display:none!important}.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.skip-link{position:fixed;top:-100px;left:16px;background:var(--accent);padding:12px 18px;z-index:20}.skip-link:focus{top:12px}.topbar{height:76px;padding:0 30px;display:flex;align-items:center;gap:24px;border-bottom:1px solid var(--line)}.portfolio-link{font-size:12px;text-decoration:none;letter-spacing:.02em;min-height:44px;display:flex;align-items:center}.portfolio-link:hover{text-decoration:underline;text-underline-offset:4px}.brand{display:flex;gap:4px;align-items:flex-start;margin:0 auto;font-size:22px;font-weight:650;letter-spacing:.045em;line-height:1}.brand-dot{width:5px;height:5px;background:var(--coral);border-radius:50%;margin:2px 0 0 0}.language{width:113px;text-align:right}.language select{max-width:100%;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;padding:8px 2px;min-height:44px;font-size:12px}.demo-notice{min-height:43px;padding:10px 30px;border-bottom:1px solid var(--line);display:flex;justify-content:center;align-items:center;gap:10px;font-size:12px;flex-wrap:wrap;background:#edeee3}.demo-notice strong{font-weight:600;letter-spacing:.02em}.status-dot{width:6px;height:6px;border-radius:50%;background:#607144}.notice-detail{color:var(--muted)}.workspace{display:grid;grid-template-columns:minmax(210px,22%) minmax(0,1fr) minmax(240px,24%);min-height:calc(100dvh - 162px)}.wardrobe,.details{padding:29px 24px 25px}.wardrobe{border-right:1px solid var(--line)}.details{border-left:1px solid var(--line)}.section-top{display:flex;justify-content:space-between;gap:10px;align-items:start}.eyebrow{display:block;font-size:10px;letter-spacing:.13em;font-weight:600;line-height:1.5;color:var(--muted);margin-bottom:11px}.tiny-index{font-size:10px;color:var(--muted);white-space:nowrap}.panel-intro{font-size:13px;color:var(--muted);margin:15px 0 23px;max-width:245px}.catalog{display:grid;gap:22px}.look-card{text-align:left;padding:0;background:transparent;width:100%;border-radius:2px}.product-image{position:relative;display:block;aspect-ratio:1.4;background:var(--stage);border:1px solid transparent;overflow:hidden;transition:border-color .2s ease}.product-image img{width:100%;height:100%;object-fit:cover;object-position:center 43%}.look-number{position:absolute;left:9px;top:8px;display:grid;place-items:center;width:23px;height:23px;background:var(--surface);font-size:11px}.selected-mark{position:absolute;right:9px;bottom:9px;width:26px;height:26px;display:grid;place-items:center;background:var(--ink);color:var(--surface);opacity:0}.is-selected .product-image{border-color:var(--ink)}.is-selected .selected-mark{opacity:1}.look-card:hover .product-image{border-color:var(--muted)}.product-name{display:block;font-size:15px;font-weight:500;letter-spacing:-.015em;margin-top:10px}.product-description{display:block;font-size:11px;color:var(--muted);margin-top:2px}.sample-note{font-size:11px;color:var(--muted);margin-top:22px}.viewer{padding:24px 25px 18px;min-width:0;display:flex;align-items:center;flex-direction:column}.viewer-header{display:flex;align-items:center;justify-content:space-between;gap:20px;width:100%;margin-bottom:18px}.viewer-header .eyebrow{margin-bottom:6px}.viewer-header h2{font-size:20px}.view-modes{display:flex;align-items:stretch;gap:1px;border:1px solid var(--line);padding:2px;border-radius:2px;flex-shrink:0}.view-modes button{padding:7px 10px;min-height:40px;font-size:11px;line-height:1.4;background:transparent;border-radius:1px}.view-modes button[aria-pressed=true]{background:var(--ink);color:var(--surface)}.visual-stage{width:100%;min-width:0;display:flex;align-items:center;justify-content:center;background:var(--stage);padding:13px 20px}.comparison-frame{position:relative;width:auto;height:min(62dvh,670px);max-width:100%;aspect-ratio:710/1010;overflow:hidden;background:#ece9df}.image-layer{position:absolute;inset:0;min-width:0;overflow:hidden}.original-photo{width:100%;height:100%;object-fit:contain}.image-layer figcaption{position:absolute;top:11px;left:10px;padding:5px 8px;background:rgba(251,250,247,.94);font-size:10px;line-height:1.4;max-width:calc(100% - 20px);z-index:1}.after-layer{clip-path:inset(0 0 0 var(--position))}.after-layer figcaption{left:auto;right:10px}.result-crop{position:absolute;inset:0;overflow:hidden}.result-crop img{position:absolute;width:225.352112676%;max-width:none;height:auto;top:-16.831683168%;left:-9.154929577%}.visual-stage[data-look=navy] .result-crop img{left:-116.197183099%}.comparison-divider{position:absolute;left:var(--position);top:0;bottom:0;width:1px;background:var(--surface);box-shadow:0 0 0 1px rgba(36,44,39,.12);pointer-events:none}.comparison-divider span{position:absolute;left:0;top:50%;transform:translate(-50%,-50%);height:32px;width:32px;display:grid;place-items:center;background:var(--surface);border-radius:50%;font-size:17px;box-shadow:0 1px 8px #242c2726}.visual-stage[data-mode=side]{padding:13px}.visual-stage[data-mode=side] .comparison-frame{display:grid;grid-template-columns:1fr 1fr;gap:11px;width:100%;height:auto;aspect-ratio:auto;background:none;overflow:visible;align-items:start}.visual-stage[data-mode=side] .image-layer{position:relative;inset:auto;aspect-ratio:710/1010;background:#ece9df}.visual-stage[data-mode=side] .after-layer{clip-path:none}.visual-stage[data-mode=side] .comparison-divider{display:none}.visual-stage[data-mode=side] .original-photo{position:absolute;inset:0}.slider-controls{width:min(100%,470px);margin-top:17px}.slider-caption{display:flex;justify-content:space-between;gap:20px;font-size:12px}.slider-caption output{font-size:11px;color:var(--muted);font-variant-numeric:tabular-nums}input[type=range]{display:block;width:100%;height:32px;margin:3px 0 0;accent-color:var(--ink);cursor:ew-resize}.slider-ends{display:flex;justify-content:space-between;gap:15px;color:var(--muted);font-size:10px}.viewer-note{display:flex;gap:7px;font-size:11px;color:var(--muted);margin-top:17px;text-align:center}.small-star{color:var(--ink);font-size:14px;line-height:1.4}.details h2{font-size:24px;max-width:245px}.details-intro{font-size:13px;color:var(--muted);margin-top:15px}.steps{list-style:none;padding:0;margin:27px 0}.steps li{display:flex;gap:15px;padding:15px 0;border-top:1px solid var(--line)}.steps li>span{font-size:10px;color:var(--muted);padding-top:3px}.steps p{font-size:12px;color:var(--muted);margin-top:5px}.boundary-note{padding:15px 0;border-top:1px solid var(--line);border-bottom:1px solid var(--line)}.boundary-heading{font-size:12px;font-weight:600}.boundary-note p{font-size:11px;color:var(--muted);margin-top:7px}.project-links{margin-top:19px;display:grid;gap:3px}.project-links a{display:flex;align-items:center;justify-content:space-between;gap:12px;text-decoration:none;font-size:12px;min-height:44px;border-bottom:1px solid var(--line)}.project-links a:hover{text-decoration:underline;text-underline-offset:4px}.credits{font-size:10px;color:var(--muted);margin-top:20px}.credits summary{cursor:pointer;min-height:25px}.credits p{margin:7px 0}.credits a{text-underline-offset:2px;overflow-wrap:anywhere}.footer{min-height:43px;border-top:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:20px;padding:12px 30px;font-size:10px;color:var(--muted);letter-spacing:.02em}.footer-cross{padding:0 7px}.noscript{padding:20px;background:var(--accent)}
@media(min-width:1600px){.workspace{grid-template-columns:minmax(260px,22%) minmax(0,1fr) minmax(280px,24%)}.wardrobe,.details{padding:35px}.viewer{padding:29px 38px 22px}.catalog{gap:26px}.product-image{aspect-ratio:1.5}.details-intro{max-width:280px}.steps{margin:33px 0}.comparison-frame{height:min(66dvh,800px)}}
@media(max-width:1100px){.workspace{grid-template-columns:210px minmax(0,1fr)}.details{grid-column:1/-1;border-left:0;border-top:1px solid var(--line);display:grid;grid-template-columns:1fr 1fr;column-gap:35px}.details>.eyebrow,.details>h2,.details-intro{grid-column:1}.details h2{max-width:none}.steps{grid-column:2;grid-row:1/5;margin:0}.boundary-note{grid-column:1;padding-top:16px;margin-top:20px}.project-links{grid-column:2;grid-row:5;margin-top:0}.credits{grid-column:1/-1}.viewer-header{align-items:flex-start;flex-direction:column;gap:12px}.view-modes{align-self:flex-end;margin-top:-12px}.comparison-frame{height:min(65dvh,650px)}.viewer{padding:24px 20px}.visual-stage{padding:12px}.wardrobe{padding:29px 20px}.product-image{aspect-ratio:1}.product-image img{object-fit:cover}}
@media(max-width:650px){.topbar{height:67px;padding:0 17px;gap:12px;flex-wrap:wrap;position:relative}.portfolio-link{font-size:0;width:30px}.portfolio-link::first-letter{font-size:20px}.brand{font-size:20px}.language{width:73px}.language select{font-size:11px}.demo-notice{padding:9px 17px;gap:7px;justify-content:flex-start;font-size:11px}.notice-detail{flex-basis:100%;padding-left:13px}.workspace{display:flex;flex-direction:column;min-height:0}.wardrobe{padding:23px 19px 20px;border-right:0;border-bottom:1px solid var(--line)}.section-top .eyebrow{margin-bottom:8px}.tiny-index{font-size:9px}h1{font-size:26px;max-width:none}.panel-intro{font-size:12px;max-width:none;margin:9px 0 16px}.catalog{grid-template-columns:1fr 1fr;gap:14px}.product-image{aspect-ratio:1.55}.product-image img{object-fit:cover;object-position:center 42%}.product-name{font-size:14px;margin-top:8px}.product-description{font-size:10px}.sample-note{font-size:10px;margin-top:13px}.viewer{padding:23px 17px 21px}.viewer-header{flex-direction:row;align-items:center;gap:12px;margin-bottom:15px}.viewer-header h2{font-size:19px}.viewer-header .eyebrow{font-size:9px}.view-modes{align-self:auto;margin:0}.view-modes button{padding:7px 8px;font-size:10px;max-width:78px}.visual-stage{padding:11px 18px}.comparison-frame{height:auto;width:100%;max-width:370px;aspect-ratio:710/1010}.visual-stage[data-mode=side]{padding:9px}.visual-stage[data-mode=side] .comparison-frame{max-width:none;gap:8px}.image-layer figcaption{font-size:9px;padding:4px 6px;top:8px;left:7px;max-width:calc(100% - 14px)}.after-layer figcaption{left:auto;right:7px}.visual-stage[data-mode=side] figcaption{font-size:8px;top:6px}.slider-controls{margin-top:15px}.slider-caption{font-size:11px}.viewer-note{font-size:10px;max-width:340px;margin-top:14px}.details{display:block;padding:26px 21px}.details h2{font-size:25px}.details-intro{font-size:12px;max-width:none}.steps{margin:22px 0}.steps li{padding:14px 0}.steps p{font-size:12px}.boundary-note{margin-top:0}.project-links{margin-top:18px}.credits{margin-top:19px;font-size:10px}.footer{padding:15px 20px;align-items:flex-start;flex-direction:column;gap:5px;font-size:9px}}
@media(max-width:650px){.portfolio-link::before{content:'←';font-size:20px}.portfolio-link::first-letter{font-size:0}}
.wardrobe h1{max-width:none;text-wrap:balance}
@media(prefers-reduced-motion:reduce){*,*::before,*::after{scroll-behavior:auto!important;transition:none!important}}