:root{--ink:#172431;--line:#d7dfe3;--slate:#38535d;--red:#e31c16;--muted:#62717b;--green:#177138}*{box-sizing:border-box}body{margin:0;background:#edf0f1;font:16px Arial,sans-serif;color:var(--ink)}.app{height:100vh;min-height:720px;width:100vw;display:grid;grid-template-columns:175px minmax(520px,1.12fr) minmax(590px,.9fr);grid-template-rows:1fr 105px;overflow:hidden;background:#fcfbf9;border:1px solid #b7c1c6;border-radius:8px;position:relative}.sides{padding:43px 28px;background:#fff;border-right:1px solid var(--line);display:flex;flex-direction:column;gap:26px}.side{position:relative;border:1px solid var(--line);border-radius:7px;background:#fff;padding:10px;display:grid;gap:8px;text-align:center;font-size:17px;cursor:pointer}.side.active{border:2px solid var(--ink)}.side img{height:130px;width:100%;object-fit:cover}.side b{position:absolute;right:7px;top:6px;color:white;background:var(--slate);border-radius:50%;font-size:12px;padding:2px 4px}.side:not(.active) b{display:none}.canvas{position:relative;background:#fff;display:grid;place-items:center;overflow:hidden}.canvas>img{max-height:81vh;max-width:94%;object-fit:contain}.history{position:absolute;right:26px;top:42px;z-index:1;display:flex;gap:12px}.history button{height:54px;width:54px;background:#fff;border:1px solid var(--line);border-radius:8px;font-size:32px;cursor:pointer}.canvas #art{position:absolute;left:50%;top:49%;transform:translate(-50%,-25%);font-size:clamp(40px,5vw,82px);font-weight:900;line-height:.9;text-align:center;color:#fff;text-shadow:0 2px 5px #000;cursor:move}.controls{background:#fff;border-left:1px solid var(--line);overflow:auto}.controls nav{display:grid;grid-template-columns:repeat(3,1fr);margin:31px 30px 0;border:1px solid var(--line);border-radius:7px;overflow:hidden}.controls nav button{height:95px;border:0;border-right:1px solid var(--line);background:#fff;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:8px;font-size:18px;cursor:pointer}.controls nav button:last-child{border-right:0}.controls nav i{font-size:35px;font-style:normal}.controls nav .active{background:var(--slate);color:#fff}#panel{padding:26px 35px 16px}h1{font-size:27px;margin:0 0 18px}.color-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:12px}.color-card{height:122px;border:1px solid var(--line);border-radius:7px;background:white;display:flex;gap:8px;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;font-size:14px}.color-card i{height:58px;width:58px;border:1px solid #ddd;border-radius:5px}.color-card.selected{border:2px solid #688599}.more{width:100%;height:44px;margin-top:16px;border:1px solid #bdc9cf;border-radius:5px;background:#fff;color:#294d62;font-size:16px;cursor:pointer}.entry{display:grid;grid-template-columns:1fr 1fr;gap:18px;margin-top:20px}.entry button{height:205px;background:#fff;border:1px solid var(--line);border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;cursor:pointer}.entry b{font-size:50px;font-weight:400}.entry strong{font-size:20px}.entry small{color:var(--muted)}.back,.link{padding:0;border:0;background:transparent;color:#355362;cursor:pointer}.drop{height:345px;border:1px dashed #96a7b0;border-radius:8px;background:#fbfcfc;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:12px;cursor:pointer}.drop input{display:none}.drop b{font-size:42px}.drop em{font-style:normal;color:var(--red);font-weight:bold}.drop small{color:var(--muted)}.image-row{border:1px solid var(--line);border-radius:7px;padding:15px;display:flex;gap:18px}.placeholder{height:105px;width:105px;background:#cbd4d8;display:grid;place-items:center;text-align:center;font-weight:bold}.image-row small{display:block;margin:8px 0;color:var(--muted)}.textbtn{border:0;background:transparent;text-decoration:underline;color:#355362;cursor:pointer;margin-right:12px}.services{margin-top:17px;border-top:1px solid var(--line)}.services label{display:block;padding:16px 0;border-bottom:1px solid var(--line);font-size:17px}.services b{float:right}.addmore{display:grid;grid-template-columns:1fr 1fr;gap:13px;margin-top:21px}.addmore button{height:50px;background:#fff;border:1px solid #cbd5da;border-radius:6px;font-size:16px;cursor:pointer}textarea{width:100%;resize:none;padding:14px;border:1px solid #bdc8cd;border-radius:6px;font-size:18px;line-height:1.45}.panel-primary{float:right;margin-top:15px;height:48px;padding:0 24px}.summary{width:100%;display:flex;justify-content:space-between;gap:10px;border:1px solid var(--line);border-radius:6px;background:#fff;padding:12px;text-align:left;cursor:pointer}.summary span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.summary b{color:#355362}.field{height:53px;width:100%;margin-top:17px;padding:10px 13px;border:1px solid var(--line);border-radius:6px;background:#fff;display:flex;align-items:center;justify-content:space-between}.field select{border:0;font-weight:bold;font-size:18px}.mini{width:25px;height:25px;background:white;border:1px solid #111;border-radius:4px;margin-left:auto;margin-right:10px}.align{display:grid;grid-template-columns:1fr repeat(3,74px);gap:8px;align-items:center;margin-top:18px}.align button{height:42px;border:1px solid var(--line);background:white;border-radius:5px}.align .on{background:var(--slate);color:white}.hint{color:var(--muted)}.sizehead{display:flex;gap:20px;align-items:center}.sizehead button{border:0;background:transparent;color:var(--red);font-weight:bold;cursor:pointer;margin-bottom:18px}.group{border:1px solid var(--line);border-radius:7px;margin-bottom:12px;background:#fff}.group header{display:flex;align-items:center;min-height:55px}.toggle{flex:1;padding:9px 16px;border:0;background:#fff;display:flex;gap:12px;align-items:center;text-align:left;cursor:pointer}.toggle i{width:33px;height:33px;border-radius:3px;border:1px solid #ddd}.toggle span{margin-left:auto;font-size:14px}.toggle b{margin-left:14px}.remove{border:0;background:white;color:#a0abb0;margin-right:14px;cursor:pointer}.sizegrid{display:grid;grid-template-columns:1fr 1fr;gap:9px;padding:0 16px 15px}.sizegrid>div{border:1px solid #e0e5e7;border-radius:5px;padding:7px 10px;display:flex;justify-content:space-between;align-items:center}.sizegrid span{display:flex;gap:11px;align-items:center}.sizegrid button{height:27px;width:27px;border:1px solid var(--line);border-radius:4px;background:#fff;cursor:pointer}.sizegrid output{min-width:12px;text-align:center}.chooser{border:1px solid var(--line);border-radius:7px;padding:14px;background:#fbfcfc}.chooser header{display:flex;justify-content:space-between;margin-bottom:12px}.chooser header button{border:0;background:transparent;color:var(--muted);cursor:pointer}.chooser div{display:grid;grid-template-columns:repeat(5,1fr);gap:9px}.chooser div button{height:72px;background:#fff;border:1px solid var(--line);border-radius:5px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;cursor:pointer;font-size:11px}.chooser i{height:34px;width:34px;border:1px solid #ddd;border-radius:3px}.chooser button:disabled{opacity:.4}.price{margin-top:15px;border:1px solid var(--line);border-radius:7px;padding:15px;display:flex;justify-content:space-between;gap:16px}.price small,.price span{display:block}.price strong{display:block;font-size:28px}.price b{display:block;color:var(--green);margin-top:5px}.price>div:last-child{text-align:right}.return{border:0;background:transparent;color:var(--muted);text-decoration:underline;margin-top:12px;padding:0;cursor:pointer}footer{grid-column:1/-1;border-top:1px solid var(--line);background:#fff;padding:0 48px;display:flex;align-items:center;justify-content:space-between}footer>div{display:flex;gap:35px;align-items:center;font-size:20px}footer #changeProduct{border:0;background:transparent;color:var(--red);font-size:16px;cursor:pointer}.outline,.primary{height:68px;padding:0 54px;border-radius:7px;font-size:20px;cursor:pointer}.outline{background:#fff;border:2px solid var(--ink)}.primary{background:var(--red);color:#fff;border:0}.hidden{display:none!important}#shade{position:absolute;inset:0;background:rgba(23,36,49,.18);z-index:3}#popup{position:absolute;z-index:4}.x{position:absolute;right:14px;top:12px;border:0;background:transparent;font-size:28px;cursor:pointer}.savepop{position:absolute;right:145px;bottom:106px;width:390px;padding:24px;background:white;border-radius:8px;box-shadow:0 18px 38px #17243133}.savepop:after{content:"";position:absolute;bottom:-10px;left:50%;height:18px;width:18px;background:#fff;transform:rotate(45deg)}.savepop h2{margin:0 0 7px}.savepop p{margin:0 0 15px;color:#3d4b53}.savepop label{font-size:14px;font-weight:bold}.savepop input{display:block;width:100%;margin-top:6px;padding:11px;border:1px solid #b8c5ca;border-radius:5px}.savepop>div{margin-top:16px;display:flex;justify-content:space-between;align-items:center}.savepop .primary{height:42px;padding:0 18px;font-size:15px}.check{width:37px;height:37px;border-radius:50%;display:grid;place-items:center;background:#26333e;color:#fff;margin-bottom:14px}.minipop{position:absolute;right:28px;top:255px;width:340px;padding:25px;background:#fff;border-radius:8px;box-shadow:0 18px 38px #17243133}.textcolors{display:grid;grid-template-columns:repeat(8,1fr);gap:11px;margin-top:18px}.textcolors button{height:29px;width:29px;border:1px solid #aeb9bf;border-radius:5px}.guide{position:absolute;top:0;right:0;width:min(650px,50vw);height:calc(100vh - 105px);padding:37px 32px;background:#fff;box-shadow:-12px 0 32px #17243122}.guide h1{margin:0 0 8px}.guide p{margin-top:0}.guide table{width:100%;border-collapse:collapse;margin-top:24px;border:1px solid var(--line)}.guide th,.guide td{text-align:left;padding:15px 18px;border-bottom:1px solid var(--line)}.guide th{background:#fafafa}.guide small{display:block;margin-top:18px;color:var(--muted)}.products{position:absolute;left:196px;right:calc(50vw - 310px);top:24px;bottom:128px;padding:25px 26px;background:#fff;border-radius:10px;box-shadow:0 18px 44px #17243133;overflow:auto}.products h1{margin:0 0 24px}.products h3{font-size:15px;margin:13px 0 10px}.pgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.psections{display:grid;grid-template-columns:1fr 2fr;gap:14px}.pcard{position:relative;border:1px solid var(--line);border-radius:7px;padding:12px;background:#fff;text-align:left;cursor:pointer}.pcard.current{border:2px solid #688599}.pcard>strong{display:block;margin-top:6px}.pcard small{display:block;color:#4d5a63;margin:4px 0}.pcard>b{position:absolute;right:8px;top:7px;background:var(--slate);color:#fff;border-radius:50%;padding:1px 4px}.dots{font-size:11px;color:#4d5a63;display:flex;align-items:center;gap:4px}.dots i{height:10px;width:10px;border-radius:50%;background:#111}.dots i:nth-child(2){background:#243f64}.dots i:nth-child(3){background:#969696}.dots i:nth-child(4){background:#e9e7e2}.dots i:nth-child(5){background:#b3a895}.garment{height:104px;width:90px;margin:auto;background:#d5d4d0;clip-path:polygon(24% 5%,76% 5%,86% 20%,100% 27%,84% 54%,76% 48%,76% 100%,24% 100%,24% 48%,16% 54%,0 27%,14% 20%);filter:drop-shadow(0 2px 2px #b4b7b8)}.hoodie{clip-path:polygon(30% 0,70% 0,78% 15%,100% 28%,84% 59%,75% 52%,75% 100%,25% 100%,25% 52%,16% 59%,0 28%,22% 15%)}.women{clip-path:polygon(28% 5%,72% 5%,85% 20%,100% 28%,83% 54%,72% 48%,68% 100%,32% 100%,28% 48%,17% 54%,0 28%,15% 20%)}.youth,.kids{transform:scale(.78);transform-origin:top}.tank{clip-path:polygon(28% 5%,42% 20%,58% 20%,72% 5%,83% 10%,77% 100%,23% 100%,17% 10%)}.washed{background:linear-gradient(135deg,#bcbab5,#deddd9,#aaa9a4)}.confirm{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:510px;padding:34px;background:#fff;border-radius:9px;box-shadow:0 18px 44px #17243144;text-align:center}.confirm h2{margin:0 0 10px}.confirm p{margin:0;color:#3b4a53}.pair{display:flex;justify-content:center;align-items:center;gap:30px;margin:22px 0}.pair .garment{height:90px;width:75px}.confirm>div:last-child{display:flex;gap:16px}.confirm .outline,.confirm .primary{height:54px;flex:1;padding:0;font-size:16px}@media(max-width:1300px){.app{grid-template-columns:135px minmax(440px,1fr) minmax(470px,.95fr)}.sides{padding:32px 20px}.side img{height:110px}#panel{padding:22px 25px}.controls nav{margin:25px 20px 0}.products{left:150px;right:45%}.outline,.primary{padding:0 34px}}