@import url('https://fonts.googleapis.com/css2?family=DM+Sans:wght@400;500;600;650;700&family=Manrope:wght@400;500;600;700;800&display=swap');
:root{--blue:#224f94;--navy:#142d52;--red:#ed3c50;--ink:#18212d;--muted:#7b8290;--line:#edf0f4;--soft:#f4f5f8}*{box-sizing:border-box}body{margin:0;background:#e8ebf0;color:var(--ink);font:14px 'DM Sans',sans-serif;display:flex;align-items:center;justify-content:center;gap:105px;min-height:100vh;padding:32px}button,input,select,textarea{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button{cursor:pointer}button:focus-visible,a:focus-visible{outline:3px solid #93b8ef;outline-offset:3px}button{border:0}a{color:inherit;text-decoration:none}.intro{width:390px;align-self:stretch;max-height:880px;display:flex;flex-direction:column;justify-content:space-between;padding:30px 0}.wordmark{font:800 37px Arial,sans-serif;letter-spacing:-1.6px;color:var(--blue)}.wordmark>span:first-child,.dot{color:var(--red)}.intro h1{font:800 60px/1.1 Manrope,sans-serif;letter-spacing:-3px;margin:25px 0}.intro h1 span{color:var(--red)}.intro p{font-size:17px;color:#737d8c;line-height:1.7}.eyebrow{font-size:10px;font-weight:800;letter-spacing:2px;color:var(--blue)}.intro-line{height:2px;width:40px;background:var(--red);margin:30px 0}.intro small{letter-spacing:2px;font-size:10px}.intro .fine{font-size:12px}.reset{background:none;text-align:left;padding:10px 0;color:#68768a}.device{width:414px;height:870px;flex-shrink:0;background:white;border:8px solid #1d2025;border-radius:55px;box-shadow:0 25px 80px #24395426,0 0 0 2px #b2b5ba;position:relative;overflow:hidden;display:flex;flex-direction:column}.status{height:44px;flex-shrink:0;display:flex;align-items:center;justify-content:space-between;padding:0 26px;font-size:13px;position:relative}.island{position:absolute;background:#17191d;width:104px;height:26px;border-radius:20px;left:calc(50% - 52px);top:7px}.demo-bar{text-align:center;font-size:8px;font-weight:700;letter-spacing:1.6px;color:#8a94a3;padding:5px 0;border-bottom:1px solid var(--line)}main{flex:1;overflow:auto;scrollbar-width:none;padding:22px 21px 24px}main::-webkit-scrollbar{display:none}nav{display:flex;justify-content:space-around;border-top:1px solid var(--line);background:#fff;padding:10px 6px 4px;flex-shrink:0}nav a{display:flex;gap:5px;align-items:center;flex-direction:column;color:#8a919c;font-size:9px;font-weight:600;width:20%;padding:3px 0}nav a.active{color:var(--blue)}nav a.sell svg{background:var(--blue);border-radius:12px;color:white;width:39px;height:32px;padding:6px;margin-top:-5px}svg.icon{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.homebar{height:18px;flex-shrink:0;position:relative}.homebar:after{content:'';width:110px;height:4px;border-radius:5px;background:#202329;position:absolute;left:calc(50% - 55px);top:6px}.head{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.head .wordmark{font-size:27px}.head small{display:block;font-size:10px;color:var(--muted);margin-top:3px}.avatar{width:36px;height:36px;background:#edf2fb;border-radius:50%;display:grid;place-items:center;color:var(--blue);font-weight:700}.search{background:var(--soft);border-radius:13px;display:flex;align-items:center;padding:12px 14px;gap:9px}.search input{width:100%;border:0;outline:none;background:none;font-size:12px}.categories{display:flex;gap:15px;overflow:auto;padding:19px 0;scrollbar-width:none}.cat{background:none;padding:0;min-width:67px;font-size:10px;font-weight:600;color:#5e6571}.cat-art{width:67px;height:67px;border-radius:18px;display:grid;place-items:center;background:#f1f3f7;margin-bottom:7px}.cat-art svg{width:60px;height:60px}.cat.active .cat-art{background:#e5edfb;box-shadow:inset 0 0 0 1px #c4d5ef}.banner{background:var(--navy);color:white;border-radius:19px;position:relative;overflow:hidden;padding:22px 20px;margin:1px 0 23px;min-height:153px}.banner small{color:#a8bddb;letter-spacing:1.4px;font-size:8px}.banner h2{font:700 23px/1.2 Manrope;margin:10px 0;letter-spacing:-.7px;position:relative;z-index:1}.banner a{font-size:10px;color:#d4e1f4;position:relative;z-index:1}.banner .heroart{position:absolute;width:165px;height:165px;right:-22px;top:8px;transform:rotate(15deg)}.section{display:flex;justify-content:space-between;align-items:center;margin:18px 0 13px}.section h2{font:800 17px Manrope;margin:0;letter-spacing:-.5px}.section a{font-size:10px;color:var(--blue);font-weight:700}.pills{display:flex;gap:8px;margin:0 0 16px;overflow:auto}.pill{background:var(--soft);border-radius:20px;padding:8px 12px;font-size:10px;white-space:nowrap}.pill.selected{background:var(--ink);color:#fff}.grid{display:grid;grid-template-columns:1fr 1fr;gap:19px 12px}.card{position:relative;min-width:0}.product-art{border-radius:16px;background:#f0f1f3;height:173px;position:relative;overflow:hidden;display:grid;place-items:center}.product-art svg{width:95%;height:95%;transition:transform .3s}.card:hover .product-art svg{transform:rotate(-4deg) scale(1.05)}.heart{position:absolute;right:8px;top:8px;background:#ffffffd9;width:29px;height:29px;border-radius:50%;display:grid;place-items:center;color:#66717b}.heart svg{width:16px;height:16px}.heart.on{color:var(--red)}.heart.on svg{fill:#ed3c5020}.card .condition{font-size:9px;color:var(--muted);margin-top:9px}.card h3{font-size:12px;line-height:1.4;margin:4px 0;font-weight:600}.price{font-weight:800;font-size:15px}.seller-line{display:flex;align-items:center;gap:5px;font-size:9px;color:#8a919b;margin-top:5px}.badge{font-size:9px;padding:5px 8px;border-radius:6px;background:#edf3fc;color:var(--blue);display:inline-block}.back{background:none;padding:0;display:flex;align-items:center;gap:12px}.page-title{font:800 20px Manrope;margin:0;letter-spacing:-.6px}.detail-art{height:310px;background:#f1f2f4;border-radius:22px;display:grid;place-items:center;margin:15px 0}.detail-art svg{width:95%;height:95%}.detail h1{font:800 25px/1.2 Manrope;letter-spacing:-.9px;margin:12px 0}.detail .price{font-size:25px;color:var(--blue)}.row{display:flex;align-items:center;justify-content:space-between;gap:10px}.desc{font-size:12px;line-height:1.8;color:#717986}.box{border:1px solid var(--line);border-radius:15px;padding:15px;margin:15px 0}.box.tint{border:0;background:#f0f5fc}.box h3{font-size:12px;margin:0 0 8px}.box p{font-size:11px;line-height:1.7;color:#707c8c;margin:6px 0}.primary,.secondary{width:100%;border-radius:12px;padding:15px 16px;font-weight:700;font-size:12px;margin-top:10px;background:var(--blue);color:white;display:block;text-align:center}.secondary{background:var(--soft);color:var(--ink)}.primary:disabled{opacity:.5;cursor:default}.stack{display:grid;gap:12px;margin-top:22px}label{display:block;font-size:11px;font-weight:600;color:#5b6675}label input,label select,label textarea{display:block;margin-top:7px;width:100%;border:1px solid #e2e6ed;border-radius:11px;padding:13px;background:white;outline-color:var(--blue);color:var(--ink)}label textarea{min-height:90px;resize:vertical}.notice{font-size:10px;color:#86909c;line-height:1.7;text-align:center;margin:15px 0}.big-icon{margin:25px auto 20px;width:75px;height:75px;border-radius:25px;background:#edf3fc;color:var(--blue);display:grid;place-items:center}.big-icon svg{width:35px;height:35px}.center{text-align:center}.center h1{font:800 25px Manrope;letter-spacing:-1px}.center p{font-size:12px;line-height:1.8;color:#7a8390}.menu-item{display:flex;align-items:center;gap:13px;padding:18px 0;border-bottom:1px solid var(--line);font-size:12px;background:none;width:100%;text-align:left}.menu-item span:last-child{margin-left:auto;color:#9ca5b1}.mini{width:60px;height:65px;border-radius:12px;background:var(--soft);flex-shrink:0;overflow:hidden}.mini svg{width:100%;height:100%}.summary{display:flex;gap:13px;align-items:center}.summary h3{font-size:12px;margin:0 0 7px}.summary p{font-size:10px;color:var(--muted);margin:0}.amounts{display:grid;gap:13px;font-size:12px;margin:20px 0}.amounts .total{border-top:1px solid var(--line);padding-top:15px;font-weight:800;font-size:17px}.choice{display:flex;align-items:center;gap:10px;padding:15px;border:1px solid #e4e8ef;border-radius:13px;margin:10px 0;font-size:12px}.choice:has(input:checked){border-color:var(--blue);background:#f4f7fc}.choice input{accent-color:var(--blue);width:auto;margin:0}.choice span{flex:1}.choice small{display:block;color:var(--muted);font-size:10px;margin-top:5px}.timeline{margin:22px 0}.step{display:flex;gap:12px;font-size:12px;padding:10px 0}.step i{width:22px;height:22px;display:grid;place-items:center;border-radius:50%;background:#eef1f5;color:#99a2b0;font-style:normal;font-size:10px}.step.done i{background:#e8f2ed;color:#3b8062}.step small{display:block;color:var(--muted);margin-top:4px;font-size:10px}.tools{padding:12px;background:#fff7e9;border-radius:12px;font-size:10px;color:#8d6b30;margin:20px 0}.tools button{background:white;padding:10px;border-radius:8px;margin-top:8px;width:100%;color:#775b2e}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin:20px 0}.stats div{background:var(--soft);padding:15px 10px;border-radius:12px;text-align:center}.stats b{display:block;font-size:21px}.stats small{font-size:9px;color:var(--muted)}.empty{padding:28px 10px;text-align:center;color:var(--muted);font-size:12px;line-height:1.8}#toast{position:fixed;bottom:35px;left:50%;transform:translateX(-50%);padding:13px 20px;background:#162d4e;color:white;border-radius:12px;font-size:12px;box-shadow:0 6px 30px #0002;opacity:0;pointer-events:none;transition:.2s;z-index:5}#toast.show{opacity:1}.upload{border:1px dashed #b7c9e3;border-radius:14px;padding:20px;text-align:center;color:var(--blue);background:#f7f9fd}.upload input{font-size:10px;border:0;padding:6px}.photo-preview{max-width:100%;max-height:150px;border-radius:12px}.sold{position:absolute;bottom:10px;left:10px;background:#172b48;color:white;padding:5px 9px;border-radius:6px;font-size:9px}@media(max-width:850px){body{padding:0;background:white;display:block}.intro{display:none}.device{width:100%;max-width:480px;height:100dvh;border:0;border-radius:0;box-shadow:none;margin:auto}.status{display:none}.homebar{height:env(safe-area-inset-bottom,8px)}main{padding-top:20px}nav{padding-bottom:12px}.product-art{height:190px}.demo-bar{padding-top:max(6px,env(safe-area-inset-top))}}@media(min-width:851px) and (max-height:930px){body{padding:20px}.device{height:calc(100vh - 40px);min-height:660px}.intro h1{font-size:52px}}
