/* UFU/KasetPrompt — ธีมฐาน (แปลตรงจาก source Angular: color.scss + styles.scss + component scss)
   ★ หน้าตาเหมือนต้นฉบับ 100% — รื้อ markup/backend ใหม่ แต่คง "ดีไซน์เดิม"
   ฟอนต์ FC-Iconic เป็น asset ดีไซน์เดิมจริง (ไม่ใช่โค้ดที่คนเขียน) */

/* ---------- FC-Iconic (จาก src/styles.scss บรรทัด 9-22) ---------- */
@font-face{font-family:"FCIconicRegular";src:url("../fonts/FC-Iconic-Regular-ver-1.10.woff") format("woff");font-weight:normal;font-style:normal}
@font-face{font-family:"FCIconicRegular";src:url("../fonts/FC-Iconic-SemiBold-ver-1.10.woff") format("woff");font-weight:bold;font-style:normal}

/* ---------- color tokens (จาก src/app/scss/color.scss :root) ---------- */
:root{
  --main-color:#57C225;--white-color:#fff;--black-color:#000;--bg-secondary:#FE9495;
  --orange:#FE9495;--white:#fff;--green:green;--yellow:#FFDA27;--light-gray:#FCFCFC;
  --light-blue:#7293AE;--dark-sea:#75b6ff;--dark-navy:#005686;--light-blue-plus:#C0D7EA;
  --light-blue-more:#89A9C3;--bg-color:#F3F7FF;--red:#FF1D30;--primary:#0004d8;--main:#57C225;
  --bg-head-nav:#22259F;--ufu-red:#FF1D30;--blue:#0F74ED;--pink:#FF407D;--success:#26BEAC;
}

/* ---------- base (จาก styles.scss บรรทัด 24-27) ---------- */
*{font-size:14.8px;font-family:'FCIconicRegular',sans-serif;box-sizing:border-box;touch-action:initial}
html,body{margin:0;padding:0;background:#fff}
a{text-decoration:none;color:inherit}

/* ---------- Bootstrap grid เฉพาะที่ใช้ (container/row/col + utilities) ---------- */
.container{width:100%;padding-right:12px;padding-left:12px;margin-right:auto;margin-left:auto}
@media(min-width:576px){.container{max-width:540px}}
@media(min-width:768px){.container{max-width:720px}}
@media(min-width:992px){.container{max-width:960px}}
@media(min-width:1200px){.container{max-width:1140px}}
.row{display:flex;flex-wrap:wrap;margin-right:-12px;margin-left:-12px}
.col-12{position:relative;width:100%;flex:0 0 100%;max-width:100%;padding-right:12px;padding-left:12px}
.col-3{position:relative;flex:0 0 25%;max-width:25%;padding-right:12px;padding-left:12px}
.p-2{padding:.5rem}.pt-3{padding-top:1rem}.p-0{padding:0}.m-0{margin:0}
.border-0{border:0}.rounded-pill{border-radius:50rem}
.img-thumbnail{padding:.25rem;background-color:#fff;border:1px solid #dee2e6;border-radius:.25rem;max-width:100%;height:auto}
.mouse-pointer,.carousel-cell,a{cursor:pointer}

/* ---------- main (จาก main.component.scss) ---------- */
.container.dashboard-main{background-color:var(--bg-color);padding-bottom:40px}

/* location bar (app-location) */
.app-location{display:flex;align-items:center;gap:8px;padding:6px 4px;color:#1d2a3a;font-weight:bold}
.app-location .pin{color:var(--main-color);font-size:18px}
.app-location .label{color:#89A9C3;font-weight:normal;font-size:12.6px}

/* news/promotion (app-ufu-promotion) — แถบสไลด์ข่าว */
.ufu-promotion{margin:8px 0}
.ufu-promotion .slide{height:150px;border-radius:14px;background:#C0D7EA;background-size:cover;background-position:center;
  display:flex;align-items:flex-end;color:#fff;padding:12px;font-weight:bold}

/* หมวดหมู่สินค้า (food-catagories-card — override block บรรทัด 168-211) */
.food-catagories-card .food-catagories-header{display:flex;justify-content:space-between;vertical-align:middle;padding-top:5px;padding-bottom:5px}
.food-catagories-card .food-catagories-header .title{font-size:100%;font-weight:bold;padding-left:5px}
.category-container{text-align:center;overflow:hidden;margin:0}
.category-container .category-name{font-size:80%;margin:6px 0 0}
.category-container img{max-width:50px}

/* ร้านค้าแนะนำ (shop-near-you-card) */
.shop-near-you-card .shop-near-you-header{display:flex;justify-content:space-between;padding-top:5px;padding-bottom:5px;font-size:100%}
.shop-near-you-card .shop-near-you-header .title{font-size:100%;font-weight:bold;padding-left:5px}
.shop-near-you-card .shop-near-you-header .more{font-size:100%;padding-right:10px;color:var(--light-blue-more)}
.shop-near-you-row{display:flex;gap:10px;overflow-x:auto;padding:4px 2px 2px}
.shop-near-you-menu .shop{width:120px;padding-top:10px;min-height:124px;transition:.5s}
.shop-near-you-menu .shop-image{width:110px;height:110px;background-size:cover;background-position:center;border-radius:15px}
.shop-near-you-menu .shop-name{width:120px;display:block;margin-top:5px;font-size:100%;overflow-wrap:break-word;text-align:center}

/* แท็บสินค้า (food-hot-hit-navbar) */
.food-hot-hit-navbar{background-color:#DEECF7;position:relative;top:0;justify-content:space-between;display:flex;width:100%;transition:top .3s}
.food-hot-hit-navbar a{display:inline-block;color:#1656a5;width:150px;text-align:center;padding-bottom:15px;padding-top:15px;text-decoration:none}
.food-hot-hit-navbar a:hover,.food-hot-hit-navbar a:focus{background:red;color:#fff}
.food-hot-hit-navbar a.active{background:red;color:#fff}

/* ตารางสินค้า (food-new-top-promo-card + mat-grid) */
.food-new-top-promo-card{padding-left:10px;padding-top:20px;padding-bottom:30px}
.grid2{display:grid;grid-template-columns:1fr 1fr;gap:1px}
.grid2 .tile{min-height:260px;overflow:visible;display:flex;justify-content:flex-start;align-items:flex-start}
.product{height:150px;width:150px;line-height:110%}
.product .image{border-radius:20px;border:3px solid #fff;box-shadow:rgba(149,157,165,.2) 0 8px 24px;width:150px;height:150px;
  background-position:center center;background-size:cover;background-repeat:no-repeat;position:relative}
.product .image .discount{transition:.5s ease;opacity:1;position:absolute;background:red;width:50px;top:10%;left:2px;
  border-top-right-radius:25px;border-bottom-right-radius:25px;text-align:center}
.product .image .discount .percent{font-size:93%;color:#fff}
.product .title{padding-top:5px;font-weight:bold}
.product .rating{font-size:smaller;color:red}
.product .rating .number{color:#000}
.product .price-info{color:var(--light-blue);font-size:90%;display:flex;justify-content:space-between}
.product .price-info .rates{padding-top:5px}
.product .price-info .rates .new-price{color:red;font-size:120%;font-weight:bold}
.product .price-info .rates .price{text-decoration:line-through;padding-left:5px;font-size:120%}
.product .price-info .rates .price.inactive-discount{text-decoration:none}

/* ===================================================================== */
/* REAL v2-shopping/main (จับจากเว็บจริง ufu.life + แปลตรงจาก source scss) */
/* ===================================================================== */

/* ---- app shell (responsive เหมือนจริง: header/nav เต็มกว้าง · เนื้อหา container กลาง) ---- */
.ufu-app{width:100%;background:var(--bg-color);min-height:100vh;position:relative;padding-bottom:70px}

/* ---- red header (shopping layout shell) ---- */
.shop-header{background:var(--ufu-red);display:flex;align-items:center;gap:10px;padding:12px 14px;
  border-bottom-left-radius:18px;border-bottom-right-radius:18px}
.shop-header .back{width:34px;height:34px;min-width:34px;border-radius:50%;background:rgba(255,255,255,.18);
  display:flex;align-items:center;justify-content:center}
.shop-header .back svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.4}
.shop-header .searchbar{flex:1;background:#fff;border-radius:22px;height:40px;display:flex;align-items:center;
  padding:0 16px;color:#9aa6b2;font-size:97%}
.shop-header .cart{position:relative;width:30px;height:30px;display:flex;align-items:center;justify-content:center}
.shop-header .cart svg{width:26px;height:26px;stroke:#fff;fill:none;stroke-width:1.8}
.shop-header .cart .badge{position:absolute;top:-6px;right:-7px;background:#fff;color:var(--ufu-red);
  border-radius:50%;min-width:17px;height:17px;font-size:11px;font-weight:bold;display:flex;align-items:center;justify-content:center;padding:0 3px}
.shop-header .hamb{width:26px;display:flex;flex-direction:column;gap:4px}
.shop-header .hamb span{display:block;height:2.4px;background:#fff;border-radius:2px}

.shop-body{padding:14px 14px 0;width:100%;max-width:1160px;margin:0 auto}

/* ---- Delivery Address card (app-location .location-card) ---- */
.location-card{background:#fff;padding:10px;padding-top:15px;border-radius:15px;width:100%;
  border:.5px solid var(--light-blue-plus);display:flex;align-items:center;gap:15px}
.location-card .icon{width:50px;height:50px;min-width:50px;display:flex;align-items:center;justify-content:center}
.location-card .icon svg{width:44px;height:44px}
.location-card .location{flex:1;line-height:100%}
.location-card .location .title{font-size:90%;color:var(--light-blue)}
.location-card .location .address{width:100%}
.location-card .location .address .ph{height:41px;border-radius:25px;padding:0 10px;display:flex;align-items:center;
  font-weight:bold;font-size:100%;color:#aeb8c4}
.location-card .icon-2{width:22px;height:22px;min-width:22px;display:flex;align-items:center;justify-content:center}
.location-card .icon-2 svg{width:22px;height:22px}

/* ---- Product Category (food-catagories-card + app-product-category) ---- */
.food-catagories-card .food-catagories-header{padding:5px 0;padding-left:5px}
.food-catagories-card .food-catagories-header .title{font-size:115%;font-weight:bold}
.category-container{text-align:center;overflow:hidden;margin:0;display:grid;grid-template-columns:repeat(4,1fr);row-gap:14px}
.category-container .cell{padding:0;cursor:pointer}
.category-container .cell img,.category-container .cell .cat-ic{width:50px;height:50px;border-radius:50rem;margin:0 auto;display:block;
  object-fit:cover;background:#eef3f8}
.category-container .category-name{font-size:80%;margin:8px 4px 0;line-height:1.15;color:#2a3645}

/* carousel dots */
.cat-dots{display:flex;gap:7px;justify-content:center;padding:16px 0 4px}
.cat-dots .dot{width:34px;height:6px;border-radius:4px;background:#cdd7e1}
.cat-dots .dot.active{background:var(--blue)}

/* ---- bottom nav (home/post/chat/highlight/wallet) ---- */
.ufu-bottomnav{position:absolute;left:0;right:0;bottom:0;background:#fff;
  display:flex;justify-content:space-around;align-items:flex-end;padding:8px 6px 10px;box-shadow:0 -2px 10px rgba(0,0,0,.06)}
.ufu-bottomnav .nav-item{display:flex;flex-direction:column;align-items:center;gap:3px;color:#b7c0cc;font-size:76%}
.ufu-bottomnav .nav-item svg{width:24px;height:24px;fill:currentColor}
.ufu-bottomnav .nav-item.active{color:var(--ufu-red)}
.ufu-bottomnav .nav-item.home .brand{font-weight:800;color:var(--ufu-red);font-size:17px;line-height:1}

/* ===================================================================== */
/* REAL v2-shopping product detail (ProductComponent · จับจากเว็บจริง)    */
/* ===================================================================== */
.prod-pic{width:100%;background:var(--bg-color);text-align:center}
.prod-pic img,.prod-pic .ph-img{width:100%;max-width:560px;margin:0 auto;display:block;aspect-ratio:1/1;object-fit:cover}
/* price line (info/price-info) */
.price-line{background:#fff;padding:0 12px 14px;color:var(--light-blue);font-size:100%}
.price-line .amt{padding-left:8px;font-weight:bold}
.product-title{background:#fff;padding-top:20px;padding-left:12px;padding-right:12px;font-size:110%;font-weight:bold}
.statistic{background:#fff;display:flex;justify-content:space-between;align-items:center;padding:8px 12px 10px}
.statistic .stats{display:flex;align-items:center;gap:10px}
.statistic .stats .num{color:#000;font-size:110%;font-weight:bold}
.statistic .stats .bm svg,.statistic .share svg{width:20px;height:20px;stroke:#8795a4;fill:none;stroke-width:1.8}
.statistic .stats .num-wrap{display:flex;align-items:center;gap:6px;color:red}

/* action bar (menu-bottom) — ของจริง Order Now = แดง */
.menu-bottom{display:flex;width:100%;height:60px;position:sticky;bottom:0;z-index:20}
.menu-bottom>div{display:flex;flex-direction:column;align-items:center;justify-content:center;color:#fff;text-align:center;gap:3px}
.menu-bottom .chat{background:var(--dark-navy);width:24%}
.menu-bottom .add{background:#81A2BC;width:38%}
.menu-bottom .order{background:var(--ufu-red);width:38%;font-size:108%;font-weight:bold}
.menu-bottom .icon svg{width:22px;height:22px;stroke:#fff;fill:none;stroke-width:1.8}
.menu-bottom .text{font-size:82%}

/* discount code + delivery */
.prod-extra{padding:10px 12px}
.discount-btn{width:100%;background:var(--blue);color:#fff;border:0;border-radius:8px;padding:12px;font-weight:bold;font-size:100%;text-align:center}
@media(min-width:768px){.discount-btn{width:auto;min-width:260px;padding-left:40px;padding-right:40px}}
.delivery{display:flex;align-items:center;gap:8px;padding:12px 2px 2px;color:#2a3645;font-size:95%}
.delivery .icon svg{width:22px;height:22px;stroke:#7293AE;fill:none;stroke-width:1.6}

/* store card */
.store{padding:10px 12px}
.detail-store{display:flex;justify-content:space-between;align-items:center;background:#fff;border-radius:12px;padding:10px}
.detail-store .store-profile{display:flex;gap:10px}
.detail-store .store-profile-picture img,.detail-store .store-profile-picture .ph{width:65px;height:65px;border-radius:50%;object-fit:cover;background:#dfe8f1;display:block}
.detail-store .store-name{padding-top:4px}
.detail-store .store-name .title{display:flex;align-items:center;gap:5px}
.detail-store .store-name .title .text{font-size:130%;font-weight:bold}
.detail-store .store-name .title .verify svg{width:17px;height:17px}
.detail-store .store-location{display:flex;align-items:center;gap:5px;padding-top:6px;color:var(--light-blue);font-size:92%}
.detail-store .store-location svg{width:15px;height:15px;stroke:var(--light-blue);fill:none;stroke-width:1.8}
.follow-button{border:1px solid red;height:35px;font-size:90%;padding:5px 15px;border-radius:20px;color:red;display:flex;align-items:center;white-space:nowrap}

/* tabs */
.product-details{padding:0 12px}
.prod-tabs{display:flex;border-bottom:1px solid #e2e9f0}
.prod-tabs .tab{flex:1;text-align:center;padding:14px 0;color:var(--dark-navy);font-weight:bold}
.prod-tabs .tab.active{color:var(--ufu-red);border-bottom:3px solid var(--ufu-red)}

/* related products section header (ร้านแนะนำ) */
.recommend-head{display:flex;justify-content:space-between;align-items:center;padding:16px 12px 6px}
.recommend-head .title{font-weight:bold;font-size:103%}
.recommend-head .more{color:var(--light-blue-more);font-size:92%}
.recommend-grid{display:flex;flex-wrap:wrap;gap:14px;padding:4px 12px 16px}
.recommend-grid .rp{width:calc(50% - 7px);max-width:165px}
.recommend-grid .rp .img,.recommend-grid .rp img{width:100%;aspect-ratio:1/1;border-radius:14px;object-fit:cover;background:#dfe8f1;display:block}
.recommend-grid .rp .name{font-weight:bold;padding-top:6px;font-size:97%}
.recommend-grid .rp .price{color:var(--light-blue);font-size:90%}

/* ===================================================================== */
/* REAL v2-shopping/order (ตะกร้า+ชำระเงิน · จับจากเว็บจริง)              */
/* ===================================================================== */
.order-head{text-align:center;font-weight:bold;padding:14px 0 4px;font-size:108%}
.order-body{max-width:1160px;margin:0 auto;padding:6px 14px 90px;display:flex;flex-direction:column;gap:15px}

/* steps (3 dots) */
.order-steps{display:flex;padding:10px 6px 4px}
.order-steps .item{flex:1;display:flex;flex-direction:column;align-items:center;text-align:center;position:relative}
.order-steps .item .dot{width:20px;height:20px;border-radius:50%;background:#cdd7e1;border:3px solid #cdd7e1;z-index:1}
.order-steps .item.active .dot{background:var(--ufu-red);border-color:var(--ufu-red)}
.order-steps .item:not(:last-child)::before{content:'';position:absolute;top:9px;left:50%;width:100%;height:3px;background:#cdd7e1}
.order-steps .item.active:not(:last-child)::before{background:var(--ufu-red)}
.order-steps .item .lb{margin-top:7px;font-size:84%;color:#415262}
.order-steps .item.active .lb{color:#1d2a3a}

/* generic white card */
.ocard{background:#fff;border-radius:15px;padding:14px;border:.5px solid var(--light-blue-plus)}

/* address card */
.addr-top{display:flex;align-items:center;justify-content:space-between}
.addr-top .lbl{display:flex;align-items:center;gap:8px;font-weight:bold}
.addr-top .lbl svg{width:20px;height:20px;stroke:#1d2a3a;fill:none;stroke-width:1.8}
.addr-top .sel{display:flex;flex-direction:column;align-items:center;color:var(--light-blue-more);font-size:80%}
.addr-top .sel svg{width:20px;height:20px;stroke:var(--light-blue-more);fill:none;stroke-width:1.8}
.addr-card .name{font-weight:bold;padding-top:10px}
.addr-card .line{color:#2a3645;font-size:94%;padding-top:3px}

/* store + shipping */
.ostore .top{display:flex;align-items:center;gap:10px}
.ostore .top .pf{width:34px;height:34px;border-radius:50%;background:#dfe8f1}
.ostore .top .nm{font-weight:bold}
.ostore .top .more{margin-left:auto;display:flex;align-items:center;gap:6px;color:var(--ufu-red);font-size:92%}
.ostore .top .more .plus{width:20px;height:20px;border-radius:50%;background:var(--ufu-red);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:bold}
.ostore .cnt{color:#607183;font-size:90%;padding-top:6px}
.ostore .ship{display:flex;align-items:center;gap:8px;border-top:1px solid #eef2f6;margin-top:10px;padding-top:12px;color:#2a3645}
.ostore .ship svg{width:22px;height:22px;stroke:#415262;fill:none;stroke-width:1.6}
.ostore .ship .pick{color:var(--light-blue-more)}
.ostore .ship .fee{margin-left:auto;font-weight:bold}
.ostore .all{display:flex;justify-content:space-between;padding-top:12px;font-weight:bold}

/* coupon bar */
.coupon-bar{display:flex;align-items:center;gap:12px;background:#fff;border-radius:12px;border:.5px solid var(--light-blue-plus);padding:14px}
.coupon-bar .tk{width:36px;height:36px;border-radius:8px;background:var(--ufu-red);display:flex;align-items:center;justify-content:center}
.coupon-bar .tk svg{width:20px;height:20px;stroke:#fff;fill:none;stroke-width:1.8}
.coupon-bar .ph{color:#6b7684}

/* payment method */
.pay-method .ttl{font-weight:bold;padding:2px 2px 10px}
.pay-items{display:flex;gap:10px;overflow-x:auto;padding-bottom:4px}
.pay-items .pm{min-width:86px;width:86px;background:#fff;border:1px solid #e4ebf2;border-radius:12px;padding:12px 6px;
  display:flex;flex-direction:column;align-items:center;gap:8px;position:relative}
.pay-items .pm.sel{border:1.5px solid var(--ufu-red)}
.pay-items .pm .chk{position:absolute;top:-7px;right:-7px;width:20px;height:20px;border-radius:50%;background:var(--ufu-red);
  display:flex;align-items:center;justify-content:center}
.pay-items .pm .chk svg{width:12px;height:12px;stroke:#fff;fill:none;stroke-width:2.4}
.pay-items .pm .ic{width:40px;height:40px;display:flex;align-items:center;justify-content:center}
.pay-items .pm .ic svg{width:38px;height:38px}
.pay-items .pm .nm{font-size:82%;color:#2a3645;text-align:center}

/* summary + pay */
.title-summary{font-weight:bold;font-size:108%;padding:6px 2px}
.pay-btn{width:100%;background:var(--ufu-red);color:#fff;border:0;border-radius:0;padding:16px;font-weight:bold;font-size:110%;text-align:center}
.total-lines{display:flex;flex-direction:column;gap:10px;padding-top:12px}
.total-lines .ln{display:flex;justify-content:space-between;color:#2a3645}
.total-lines .ln.grand{border-top:1px solid #e2e9f0;padding-top:12px;font-weight:bold}

/* ===================================================================== */
/* REAL v2-shopping summary(สำเร็จ) + payment-qrcode                      */
/* ===================================================================== */
.pay-wrap{background:#fff;border-radius:20px;margin:14px;padding:40px 16px 56px;display:flex;flex-direction:column;align-items:center}
/* success */
.pay-wrap .check{width:84px;height:84px}
.pay-wrap .success-text{padding-top:14px;font-size:130%;color:#000;text-align:center;font-weight:bold}
.pay-wrap .deliv-pic{width:80%;max-width:300px;padding:24px 0 36px;margin:auto}
.pay-wrap .deliv-pic svg{width:100%;height:auto}
.show-btn{padding:14px 22px;border-radius:35px;color:#fff;background:var(--bg-head-nav);width:62%;max-width:300px;
  font-size:108%;text-align:center;display:flex;align-items:center;justify-content:center;gap:8px}
.show-btn svg{width:16px;height:16px;stroke:#fff;fill:none;stroke-width:2.4}
/* qr payment */
.pay-wrap .qr-title{font-weight:bold;display:flex;align-items:center;gap:8px;font-size:100%}
.pay-wrap .qr-title svg{width:20px;height:20px}
.pay-wrap .paid{padding-top:14px;font-size:118%}
.pay-wrap .paid .big{font-size:150%;font-weight:bold}
.pay-wrap .qr-img{width:62%;max-width:240px;aspect-ratio:1/1;margin:20px 0;background:#fff;border:1px solid #e4ebf2;border-radius:10px;padding:10px}
.pay-wrap .qr-img svg{width:100%;height:100%}
.save-qr{background:var(--dark-navy);color:#fff;border-radius:25px;padding:10px 22px;font-size:95%}
.pay-wrap .remaining{text-align:center;padding-top:18px}
.pay-wrap .remaining .time{font-size:150%;font-weight:bold;color:var(--ufu-red)}
.pay-wrap .tips{text-align:center;color:#415262;font-size:92%;padding-top:14px;line-height:1.7}
.pay-wrap .pp{width:140px;padding-top:18px}
.pay-wrap .pp svg{width:100%}
.button-payment{background:var(--ufu-red);color:#fff;text-align:center;padding:16px;font-weight:bold}

/* category placeholder colors (fallback when no icon image) */
.cat-c1{background:#ffe1e3}.cat-c2{background:#e3f0ff}.cat-c3{background:#ffeede}.cat-c4{background:#e7ffe9}
.cat-c5{background:#f3e6ff}.cat-c6{background:#ffe6f2}.cat-c7{background:#e6f7ff}.cat-c8{background:#fff6de}
/* header search form/input + back as link/button reset */
.shop-header .searchbar-input{width:100%;background:#fff;border:0;border-radius:22px;height:40px;padding:0 16px;color:#1d2a3a;font-size:97%;font-family:inherit}
.shop-header .searchbar-input::placeholder{color:#9aa6b2}
.shop-header .back,.shop-header .cart{text-decoration:none}
.shop-header .hamb{border:0;background:transparent;cursor:pointer}
.ufu-bottomnav .nav-item{text-decoration:none}
/* ── เฟส 2: บัญชี/ฟอร์ม/คำสั่งซื้อ/ราคาตลาด/รีวิว ───────────────────── */
.ufu-flash{max-width:1160px;margin:10px auto 0;background:#eafff3;border:1px solid #bfe9d2;color:#1b7a46;padding:10px 14px;border-radius:10px;font-size:95%}
.ufu-auth{max-width:420px;margin:0 auto;padding:30px 20px 90px}
.ufu-auth .brand{text-align:center;font-weight:800;color:var(--ufu-red);font-size:34px;line-height:1;margin-bottom:6px}
.ufu-auth .sub{text-align:center;color:#6b7684;margin-bottom:22px}
.ufu-field{display:block;margin-bottom:14px}
.ufu-field .lb{font-size:92%;color:#2a3645;margin-bottom:6px}
.ufu-input{width:100%;height:46px;background:#fff;border:1px solid #dbe3ec;border-radius:12px;padding:0 14px;font-size:98%;font-family:inherit;color:#1d2a3a;box-sizing:border-box}
textarea.ufu-input{height:auto;padding:12px 14px}
.ufu-input:focus{outline:none;border-color:var(--ufu-red)}
.ufu-btn{display:block;width:100%;height:48px;line-height:48px;background:var(--ufu-red);color:#fff;border:0;border-radius:20px;font-weight:bold;font-size:106%;cursor:pointer;font-family:inherit;text-align:center;padding:0}
.ufu-btn.ghost{background:#fff;color:var(--ufu-red);border:1.5px solid var(--ufu-red);line-height:46px}
.ufu-err{color:var(--ufu-red);font-size:90%;margin:-8px 0 12px}
.ufu-alt{text-align:center;margin-top:16px;color:#6b7684;font-size:94%}
.ufu-alt a{color:var(--ufu-red);font-weight:bold}
.ufu-pay-choice{display:flex;gap:10px;margin-top:6px}
.ufu-pay-choice label{flex:1;border:1.5px solid #dbe3ec;border-radius:12px;padding:12px;text-align:center;cursor:pointer;font-size:95%}
.ufu-pay-choice input{display:none}
.ufu-pay-choice label:has(input:checked){border-color:var(--ufu-red);background:#fff5f5;color:var(--ufu-red);font-weight:bold}
.ord-row{display:flex;align-items:center;gap:10px}
.ord-row .no{font-weight:bold}
.ord-row .st{margin-left:auto;font-size:86%;padding:3px 10px;border-radius:20px;background:#eef2f6;color:#45535f}
.ord-row .st.paid,.ord-row .st.confirmed{background:#eafff3;color:#1b7a46}
.ord-row .st.completed{background:#e7f0ff;color:#1558c0}
.ord-row .st.cancelled{background:#ffeaea;color:#c0281d}
.ord-meta{color:#6b7684;font-size:90%;padding-top:6px}
.order-nos{display:flex;flex-wrap:wrap;gap:8px;justify-content:center;margin:6px 0 4px}
.order-nos a{background:#f1f5f9;border-radius:20px;padding:4px 12px;color:#2a3645;font-size:92%}
.mkt-head{text-align:center;font-weight:bold;padding:14px 0 2px;font-size:108%}
.mkt-asof{text-align:center;color:#6b7684;font-size:90%;margin-bottom:8px}
.mkt-table{max-width:900px;margin:0 auto;padding:0 12px 90px}
.mkt-item{display:flex;align-items:center;gap:12px;background:#fff;border:.5px solid var(--light-blue-plus);border-radius:12px;padding:10px 12px;margin-bottom:8px}
.mkt-item .ic{width:40px;height:40px;border-radius:8px;background:#eef3f8 center/cover;flex:none}
.mkt-item .nm{font-weight:600}
.mkt-item .u{color:#6b7684;font-size:88%}
.mkt-item .pr{margin-left:auto;text-align:right;font-weight:bold;color:var(--ufu-red)}
.mkt-empty{max-width:600px;margin:30px auto;text-align:center;color:#6b7684;padding:0 16px}
.rv-card{background:#fff;border:.5px solid var(--light-blue-plus);border-radius:15px;padding:14px;margin:12px 14px}
.rv-stars{display:flex;gap:6px;direction:rtl;justify-content:flex-end}
.rv-stars input{display:none}
.rv-stars label{font-size:26px;color:#dcdfe4;cursor:pointer}
.rv-stars input:checked ~ label,.rv-stars label:hover,.rv-stars label:hover ~ label{color:#ffb400}