@import"https://fonts.googleapis.com/css2?family=Kalam:wght@400;700&family=Inter:wght@400;500;600&display=swap";*{box-sizing:border-box}html,body{margin:0;padding:0}body{background:#d8d5cf;font-family:Inter,system-ui,sans-serif;color:#2a2a2a;-webkit-font-smoothing:antialiased}.app{min-height:100vh;display:flex;justify-content:center;align-items:flex-start;padding:22px 12px}.device{width:400px;max-width:100%;height:840px;max-height:calc(100vh - 44px);background:#fbfbfa;border:2px solid #1a1a1a;border-radius:30px;box-shadow:6px 8px #00000024;overflow:hidden;display:flex;flex-direction:column;position:relative}.statusbar{display:flex;justify-content:space-between;align-items:center;padding:8px 18px 4px;font-size:10px;color:#999;flex:none}.statusbar .dots{letter-spacing:2px}.screen-body{flex:1;overflow-y:auto;padding:14px 16px 18px;display:flex;flex-direction:column;gap:11px}.tabbar{border-top:1px solid #d8d5cf;display:flex;flex:none}.tabbar button{flex:1;background:none;border:0;border-right:1px solid #ececec;padding:11px 0 12px;font-size:10.5px;color:#888;cursor:pointer;font-family:inherit}.tabbar button:last-child{border-right:0}.tabbar button.on{color:#1a1a1a;font-weight:700}.topbar{display:flex;align-items:center;gap:10px;margin:-2px 0 2px}.back{background:none;border:1.5px solid #b7b4ad;border-radius:50%;width:26px;height:26px;font-size:13px;color:#4a4a4a;cursor:pointer;flex:none;line-height:1}.title{font-size:13px;font-weight:700;color:#333}.l{height:8px;background:#e3e1dc;border-radius:3px}.l.t{height:11px;background:#cfccc5}.l.w90{width:90%}.l.w80{width:80%}.l.w70{width:70%}.l.w60{width:60%}.l.w50{width:50%}.l.w40{width:40%}.l.w30{width:30%}.box{background:#e6e4df;border:1px solid #c9c6bf;position:relative}.box.x:before,.box.x:after{content:"";position:absolute;inset:0}.box.x:before{background:linear-gradient(to top right,transparent 49%,#c1beb6 49%,#c1beb6 51%,transparent 51%)}.box.x:after{background:linear-gradient(to top left,transparent 49%,#c1beb6 49%,#c1beb6 51%,transparent 51%)}.thumb{width:44px;height:44px;flex:none;border-radius:8px}.btn{border:1.5px solid #6a6a6a;border-radius:20px;padding:10px 12px;text-align:center;font-size:12px;color:#4a4a4a;font-weight:600;background:#fff;cursor:pointer;font-family:inherit;width:100%;display:block}.btn.fill{background:#3a3a3a;color:#fff;border-color:#3a3a3a}.btn.dis{border-style:dashed;color:#b3b3b3;border-color:#c9c6bf;background:#f4f2ee;cursor:not-allowed}.btn.sm{padding:6px 10px;font-size:10.5px;border-radius:14px;width:auto;display:inline-block}.field{border:1px solid #c2bfb8;border-radius:8px;padding:10px 11px;font-size:11px;color:#a5a29b;background:#fff}.chips{display:flex;gap:6px;flex-wrap:wrap}.chip{border:1px solid #b7b4ad;border-radius:14px;padding:5px 12px;font-size:10.5px;color:#5a5a5a;background:#fff;cursor:pointer}.chip.on{background:#2f2f2f;color:#fff;border-color:#2f2f2f}.card{border:1px solid #cfccc5;border-radius:10px;padding:11px;display:flex;flex-direction:column;gap:8px;background:#fff}.card.tap{cursor:pointer}.card.dash{border-style:dashed;align-items:center;text-align:center;color:#999}.rowline{display:flex;align-items:center;gap:9px}.rowline.jb{justify-content:space-between}.grow{flex:1;display:flex;flex-direction:column;gap:5px;min-width:0}.cap{font-size:9.5px;color:#8a8a8a;font-weight:600;text-transform:uppercase;letter-spacing:.5px}.lbl{font-size:11px;color:#3a3a3a;font-weight:600}.muted{font-size:9.5px;color:#888}.price{font-size:11px;color:#3a3a3a;font-weight:700}.strike{text-decoration:line-through;color:#aaa;font-weight:400}.link{font-size:9.5px;color:#2a78d6;cursor:pointer}.radio{width:14px;height:14px;border:1.5px solid #9a9a9a;border-radius:50%;flex:none;cursor:pointer}.radio.on{border-color:#2f2f2f;background:radial-gradient(circle,#2f2f2f 42%,#fff 46%)}.check{width:14px;height:14px;border:1.5px solid #9a9a9a;border-radius:3px;flex:none}.step{display:inline-flex;align-items:center;border:1px solid #b7b4ad;border-radius:14px;overflow:hidden}.step span{padding:4px 11px;font-size:12px;color:#4a4a4a;cursor:pointer}.step span.mid{border-left:1px solid #d8d5cf;border-right:1px solid #d8d5cf;font-weight:600;cursor:default}.toggle{width:34px;height:18px;border-radius:9px;background:#cfccc5;position:relative;flex:none;cursor:pointer}.toggle:after{content:"";position:absolute;top:2px;left:2px;width:14px;height:14px;border-radius:50%;background:#fff;transition:left .15s}.toggle.on{background:#3a3a3a}.toggle.on:after{left:18px}.banner{font-size:10px;padding:7px 9px;border-radius:6px;text-align:center;font-weight:600}.banner.warn{background:#efe9dc;color:#7a6a3a;border:1px solid #d8cfa8}.banner.err{background:#efe0e0;color:#8a4a4a;border:1px solid #d8b0b0}.stepper{display:flex;flex-direction:column}.stp{display:flex;align-items:center;gap:9px;padding:7px 0}.stp .dot{width:16px;height:16px;border-radius:50%;border:1.5px solid #9a9a9a;flex:none}.stp.done .dot{background:#3a3a3a;border-color:#3a3a3a}.stp.now .dot{border-color:#2f2f2f;box-shadow:0 0 0 3px #dcdcdc}.skel{background:linear-gradient(90deg,#e8e6e1,#f1efeb,#e8e6e1);background-size:200% 100%;border-radius:5px;animation:sk 1.2s ease-in-out infinite}@keyframes sk{0%{background-position:200% 0}to{background-position:-200% 0}}.note{font-size:10px;color:#3a3a3a;line-height:1.45;border-left:2px solid #2a78d6;padding:3px 0 3px 9px;background:#f4f7fb}.note b{color:#2a78d6}.center{align-items:center;text-align:center;justify-content:center}.sticky{margin-top:auto}@media(max-width:440px){.app{padding:0}.device{width:100%;height:100vh;max-height:none;border:0;border-radius:0;box-shadow:none}}