.point-mall-page { min-height:100vh; padding-bottom:calc(82px + env(safe-area-inset-bottom)); background:#fff8fb; color:#503541; }
.point-mall-topbar { position:sticky; top:0; z-index:30; display:grid; grid-template-columns:46px 1fr 100px; align-items:center; width:min(1240px,100%); height:58px; margin:auto; padding:0 16px; border-bottom:1px solid #f3e3e9; background:#fff9fcf2; backdrop-filter:blur(18px); }
.mall-back { display:grid; width:36px; height:36px; place-items:center; border:1px solid #f7dce7; border-radius:50%; color:#a24a6b; font-size:27px; line-height:1; text-decoration:none; }.point-mall-brand { display:flex; align-items:center; gap:8px; color:#ec4d83; text-decoration:none; }.point-mall-brand>span { display:grid; width:34px; height:34px; place-items:center; border-radius:12px; background:#ffe8f0; font-size:20px; }.point-mall-brand strong { font-size:13px; line-height:1; }.point-mall-brand small { display:block; margin-top:3px; font-size:6px; letter-spacing:.13em; }.mall-task-link { justify-self:end; color:#b65477; font-size:10px; font-weight:800; text-decoration:none; }
.point-mall-main { display:grid; gap:13px; width:min(1240px,calc(100% - 24px)); margin:12px auto 0; }.mall-hero { position:relative; display:flex; align-items:center; justify-content:space-between; min-height:150px; overflow:hidden; padding:21px 24px; border:1px solid #f5d6e2; border-radius:22px; background:radial-gradient(ellipse at 75% 30%,#fffdfd 0,#ffe8f0 48%,#ffd5e5 100%); }.mall-hero>div { position:relative; z-index:1; }.mall-hero p,.mall-section-heading p { margin:0 0 3px; color:#c1728e; font-size:8px; font-weight:900; letter-spacing:.15em; }.mall-hero h1 { margin:0; color:#c73770; font-size:29px; font-weight:900; }.mall-hero span { display:block; margin-top:4px; color:#885c6d; font-size:11px; }.mall-hero a { display:inline-block; margin-top:12px; padding:7px 12px; border-radius:99px; background:#fffafc; color:#c64977; font-size:10px; font-weight:800; text-decoration:none; }.mall-hero>img { width:140px; height:120px; object-fit:contain; filter:drop-shadow(0 8px 12px #ce52773a); }
.mall-wallet { display:grid; grid-template-columns:42px 1fr auto; align-items:center; gap:3px 9px; padding:12px 16px; border:1px solid #f3dce6; border-radius:17px; background:#fffdfd; box-shadow:0 5px 18px #d07b9410; }.mall-wallet>img { grid-row:span 2; width:39px; height:39px; object-fit:contain; }.mall-wallet>span { color:#977b87; font-size:10px; }.mall-wallet>strong { color:#ee4d84; font-size:23px; line-height:1.1; }.mall-wallet>a { grid-column:3; grid-row:1/3; padding:8px 11px; border:1px solid #f5dae4; border-radius:99px; color:#b85b7c; font-size:9px; font-weight:800; text-decoration:none; }
.mall-content,.mall-redemptions { padding:14px; border:1px solid #f3e2e9; border-radius:20px; background:#fffdfd; box-shadow:0 7px 22px #d07b940d; }.mall-section-heading { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-bottom:11px; }.mall-section-heading h2 { margin:0; color:#5f3c4a; font-size:16px; font-weight:900; }.mall-section-heading>span { color:#a58b96; font-size:9px; }.mall-categories { display:flex; gap:7px; overflow-x:auto; padding:1px 0 12px; scrollbar-width:thin; }.mall-categories button { flex:0 0 auto; min-height:31px; padding:0 13px; border:1px solid #f2e4ea; border-radius:99px; background:#fff7fa; color:#8c6d7b; font:inherit; font-size:10px; cursor:pointer; }.mall-categories button.active { border-color:#ff5b91; background:#ff5b91; color:white; font-weight:850; }
.mall-products { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }.mall-product-card { overflow:hidden; border:1px solid #f4e7ec; border-radius:16px; background:#fff; box-shadow:0 4px 13px #a9476a0c; }.mall-product-card>img { display:block; width:100%; aspect-ratio:1.25; object-fit:cover; background:#fff0f5; }.mall-product-info { display:grid; gap:5px; padding:9px; }.mall-product-category { color:#c06a89; font-size:8px; font-weight:850; }.mall-product-info h3 { min-height:31px; margin:0; color:#5e414d; font-size:11px; line-height:1.4; }.mall-product-info p { min-height:27px; margin:0; color:#9a808b; font-size:9px; line-height:1.4; }.mall-product-cost { display:flex; align-items:center; gap:5px; color:#ed5788; font-size:12px; font-weight:900; }.mall-product-cost img { width:18px; height:18px; object-fit:contain; }.mall-product-card button { width:100%; min-height:34px; border:0; border-radius:99px; background:linear-gradient(100deg,#ff709b,#f33c7d); color:#fff; font:inherit; font-size:10px; font-weight:850; cursor:pointer; }.mall-product-card button:disabled { background:#f4e6ec; color:#a9949e; cursor:not-allowed; }
.mall-empty { grid-column:1/-1; margin:0; padding:21px 12px; border-radius:14px; background:#fff8fb; color:#a18b95; font-size:10px; text-align:center; }.mall-login-note { display:grid; justify-items:center; gap:7px; padding:20px; border-radius:16px; background:#fff3f7; color:#765362; font-size:12px; }.mall-login-note img { width:60px; height:60px; object-fit:contain; }.mall-login-note button { min-height:36px; padding:0 18px; border:0; border-radius:99px; background:#ff5b91; color:white; font:inherit; font-size:10px; font-weight:800; }
.mall-login-note[hidden] { display:none; }
.mall-redemptions-list { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; }.mall-redemption { display:grid; justify-items:center; gap:4px; padding:12px; border:1px solid #f3e3e9; border-radius:15px; background:#fff9fb; text-align:center; }.mall-redemption strong { color:#664553; font-size:10px; }.mall-redemption p { margin:0; color:#a08792; font-size:9px; }.mall-redemption img { width:112px; max-width:100%; image-rendering:auto; border-radius:6px; background:#fff; }.mall-redemption code { color:#bd4e78; font-size:11px; font-weight:850; letter-spacing:.08em; }
.mall-redeem-dialog { width:min(390px,calc(100vw - 28px)); padding:17px 20px 20px; border:1px solid #f3d9e4; border-radius:23px; background:#fffafd; color:#573a47; box-shadow:0 20px 60px #38162844; }.mall-redeem-dialog::backdrop { background:#2f172499; backdrop-filter:blur(4px); }.mall-dialog-close { display:flex; justify-content:flex-end; margin:-4px -5px 0; }.mall-dialog-close button { width:30px; height:30px; border:0; border-radius:50%; background:#fff0f5; color:#a34c6b; font-size:20px; }.mall-redeem-dialog>img { display:block; width:66px; height:66px; margin:-20px auto 2px; object-fit:contain; }.mall-redeem-dialog h2 { margin:4px 0 2px; text-align:center; font-size:18px; }.mall-redeem-dialog>p { color:#a2788a; font-size:11px; text-align:center; }.mall-redeem-dialog label { display:grid; gap:7px; margin-top:14px; color:#785865; font-size:11px; font-weight:800; }.mall-redeem-dialog select { min-height:42px; padding:0 10px; border:1px solid #f0dce5; border-radius:11px; background:#fff; color:#644653; font:inherit; }.mall-redeem-dialog .mall-dialog-note { line-height:1.55; }.mall-redeem-dialog>#mall-confirm-redeem { width:100%; min-height:42px; border:0; border-radius:99px; background:#ff5b91; color:white; font:inherit; font-weight:850; }.mall-redeem-dialog>#mall-confirm-redeem:disabled { opacity:.55; }.mall-message { position:fixed; z-index:80; right:15px; bottom:calc(75px + env(safe-area-inset-bottom)); left:15px; width:max-content; max-width:calc(100% - 30px); margin:0 auto; padding:0; border-radius:99px; background:#654050; color:white; font-size:11px; }.mall-message:not(:empty) { padding:10px 15px; box-shadow:0 6px 20px #41192b33; }
.point-mall-page .consumer-bottom-nav { position:fixed; z-index:35; right:0; bottom:0; left:0; height:calc(58px + env(safe-area-inset-bottom)); padding:4px 4px env(safe-area-inset-bottom); border-top:1px solid #f2e4e9; background:#fffdfef5; backdrop-filter:blur(18px); }.point-mall-page .consumer-bottom-nav a,.point-mall-page .consumer-bottom-nav button { display:flex; flex:1; flex-direction:column; align-items:center; justify-content:center; gap:1px; min-width:0; padding:0; color:#88737e; text-decoration:none; font-size:9px; }.point-mall-page .consumer-nav-icon { display:grid; width:22px; height:22px; place-items:center; }.point-mall-page .consumer-nav-icon svg { width:19px; height:19px; }.point-mall-page .consumer-bottom-nav a.active { color:#ff5b91; }
@media(min-width:900px) { .point-mall-main { grid-template-columns:1fr 310px; align-items:start; }.mall-hero,.mall-content,.mall-redemptions { grid-column:1/-1; }.mall-hero { min-height:210px; }.mall-wallet { grid-column:1/-1; }.point-mall-page .consumer-bottom-nav { right:50%; left:50%; width:min(600px,100%); transform:translateX(-50%); border:1px solid #f2e4e9; border-bottom:0; border-radius:18px 18px 0 0; } }
@media(max-width:700px) { .point-mall-topbar { grid-template-columns:42px 1fr 88px; height:54px; padding:0 12px; }.point-mall-main { width:calc(100% - 16px); gap:9px; margin-top:8px; }.mall-hero { min-height:131px; padding:15px; border-radius:18px; }.mall-hero h1 { font-size:23px; }.mall-hero span { font-size:9px; }.mall-hero a { margin-top:8px; padding:6px 9px; font-size:9px; }.mall-hero>img { width:97px; height:95px; }.mall-wallet { grid-template-columns:35px 1fr auto; gap:2px 6px; padding:9px 11px; }.mall-wallet>img { width:33px; height:33px; }.mall-wallet>span { font-size:9px; }.mall-wallet>strong { font-size:19px; }.mall-wallet>a { padding:7px 8px; font-size:8px; }.mall-content,.mall-redemptions { padding:11px; border-radius:17px; }.mall-section-heading { margin-bottom:7px; }.mall-section-heading h2 { font-size:14px; }.mall-categories { gap:5px; padding-bottom:9px; }.mall-categories button { min-height:28px; padding:0 10px; font-size:9px; }.mall-products { grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px; }.mall-product-card { border-radius:13px; }.mall-product-card>img { aspect-ratio:1.24; }.mall-product-info { gap:4px; padding:7px; }.mall-product-info h3 { min-height:28px; font-size:10px; }.mall-product-info p { min-height:25px; font-size:8px; }.mall-product-cost { font-size:11px; }.mall-product-card button { min-height:31px; font-size:9px; }.mall-redemptions-list { grid-template-columns:repeat(2,minmax(0,1fr)); gap:7px; }.mall-redemption { padding:9px; }.mall-redemption img { width:88px; } }
.mall-page-title { justify-self:center; color:#5d3949; font-size:15px; font-weight:900; }
.mall-hero { background:radial-gradient(ellipse at 74% 18%,#fffdfd 0,#ffe7ef 45%,#ffd3e4 100%); }
.mall-hero h1 { max-width:530px; font-size:clamp(24px,3vw,36px); }
.mall-product-open { position:relative; display:block; width:100%; padding:0; border:0; background:none; cursor:pointer; }
.mall-product-open>img { display:block; width:100%; aspect-ratio:1.2; object-fit:cover; background:#fff0f5; }
.mall-product-tag { position:absolute; top:8px; left:8px; padding:4px 8px; border-radius:99px; background:#fffaf2e8; color:#c34b75; font-size:9px; font-weight:850; }
.mall-price-row { display:flex; align-items:center; justify-content:space-between; gap:4px; }
.mall-cash-price { color:#8e7781; font-size:10px; font-weight:800; }
.mall-stock { color:#a18a95; font-size:8px; }
.mall-item-dialog,.mall-redeem-dialog { position:relative; width:min(520px,calc(100vw - 24px)); max-height:min(88vh,900px); overflow:auto; padding:18px; border:1px solid #f2dbe5; border-radius:22px; background:#fffdfd; color:#543745; box-shadow:0 22px 70px #38162844; }
.mall-item-dialog::backdrop,.mall-redeem-dialog::backdrop { background:#2f172499; backdrop-filter:blur(4px); }
.mall-modal-x { position:sticky; top:0; z-index:1; float:right; display:grid; width:32px; height:32px; place-items:center; border:0; border-radius:50%; background:#fff0f5; color:#a34c6b; font-size:22px; cursor:pointer; }
.mall-detail-image { display:block; width:100%; max-height:320px; margin-bottom:14px; border-radius:16px; object-fit:cover; background:#fff0f5; }
.mall-item-dialog h2 { margin:5px 0; font-size:22px; }
.mall-detail-description { color:#846a76; font-size:13px; }
.mall-detail-price { display:flex; align-items:center; gap:12px; margin:12px 0; }
.mall-detail-price strong { color:#ed4e83; font-size:20px; }
.mall-detail-price span { color:#917b86; font-weight:800; }
.mall-item-dialog section { margin-top:12px; padding:12px; border:1px solid #f5e5eb; border-radius:14px; background:#fff9fb; }
.mall-item-dialog section h3 { margin:0 0 5px; font-size:13px; }
.mall-item-dialog section p { margin:3px 0; color:#7d6570; font-size:12px; line-height:1.7; white-space:pre-wrap; }
.mall-detail-stock,.mall-payment-note { display:block; margin:9px 0; color:#9c7e8a; font-size:11px; }
.mall-item-dialog #mall-detail-redeem,.mall-item-dialog #mall-detail-login,.mall-redeem-dialog>#mall-confirm-redeem { width:100%; min-height:44px; border:0; border-radius:99px; background:linear-gradient(100deg,#ff709b,#f33c7d); color:white; font:inherit; font-size:13px; font-weight:850; cursor:pointer; }
.mall-confirm-summary { display:grid; grid-template-columns:1fr auto; gap:10px; padding:13px; border-radius:14px; background:#fff3f7; color:#8e7280; font-size:12px; }
.mall-confirm-summary strong { color:#e8477d; text-align:right; }
.mall-redeem-dialog>img { width:55px; height:55px; margin:0 auto 4px; }
.mall-redeem-dialog>h2 { margin:0 0 12px; }
.mall-redeem-dialog label { display:grid; gap:6px; margin:12px 0; color:#785865; font-size:11px; font-weight:800; }
.mall-redeem-dialog select,.mall-redeem-dialog input,.mall-redeem-dialog textarea { width:100%; min-height:42px; padding:9px 10px; border:1px solid #f0dce5; border-radius:11px; background:#fff; color:#644653; font:inherit; }
.mall-redeem-dialog textarea { min-height:75px; resize:vertical; }
.mall-redemption { grid-template-columns:68px minmax(0,1fr); justify-items:start; text-align:left; }
.mall-redemption>img:first-child { grid-row:span 2; width:68px; height:68px; border-radius:10px; object-fit:cover; }
.mall-redemption>div { display:grid; gap:4px; align-self:center; }
.mall-redemption p,.mall-redemption small { margin:0; color:#9b7c89; font-size:9px; }
.mall-ticket-open { grid-column:2; display:inline-flex; align-items:center; justify-content:center; min-height:34px; padding:7px 10px; border:1px solid #ed8bad; border-radius:99px; background:#fff; color:#b24770; font-size:10px; font-weight:850; text-align:center; text-decoration:none; }
.mall-redemption code,.mall-redemption>small,.mall-record-status { grid-column:2; }
.mall-redemption.physical { grid-template-columns:68px minmax(0,1fr); }
.mall-redemptions-list { grid-template-columns:repeat(2,minmax(0,1fr)); }
@media(max-width:700px) { .mall-page-title { font-size:13px; }.mall-redemptions-list { grid-template-columns:1fr; }.mall-item-dialog,.mall-redeem-dialog { padding:14px; }.mall-detail-image { max-height:230px; } }
.mall-login-note[hidden] { display:none!important; }