html, body {
    width: 100vw;
    min-height: 100vh;
    margin: 0;
    font-family: Arial, "Microsoft YaHei", sans-serif;
    background: #f5f6f7;
    color: #222;
    overflow-x: hidden;
}

body.home-page {
    height: 100vh;
    overflow: hidden;
}

* {
    box-sizing: border-box;
}

a {
    color: inherit;
    text-decoration: none;
}

button, input {
    font-family: inherit;
}

.wrapper {
    width: 100%;
    min-height: 100vh;
    padding-bottom: 16vw;
    background: #f5f6f7;
}

.home-page .wrapper {
    height: 100vh;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 14vw;
}

.wrapper.no-footer {
    padding-bottom: 0;
}

.top-orange {
    height: 14.6vw;
    display: flex;
    align-items: center;
    padding: 0 4vw;
    color: #fff;
    background: #ff5a00;
}

.logo {
    margin-right: 2vw;
    font-size: 7.4vw;
    font-weight: 900;
    letter-spacing: -.2vw;
}

.location {
    flex: 1;
    display: flex;
    align-items: center;
    gap: 1vw;
    min-width: 0;
    font-size: 4.4vw;
    font-weight: 700;
}

.location span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.search-area {
    padding: 2.2vw 3.2vw;
    background: #fff;
}

.search-panel {
    height: 9vw;
    display: flex;
    align-items: center;
    border: .45vw solid #ff7b31;
    border-radius: 1.3vw;
    overflow: hidden;
    background: #fff;
}

.search-panel i {
    width: 9vw;
    text-align: center;
    color: #b9b9b9;
    font-size: 3vw;
}

.search-panel input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    color: #333;
    font-size: 3.5vw;
}

.search-panel button,
.search-link-btn {
    width: 17vw;
    height: 100%;
    border: 0;
    color: #fff;
    background: #ff5a00;
    font-size: 3.5vw;
    font-weight: 800;
}

.banner {
    margin: 0 3.2vw 4vw;
    height: 22.5vw;
    border-radius: 1.4vw;
    background: url("../img/ref/banner-redpack.png") center/cover no-repeat;
    overflow: hidden;
}

.section-title {
    margin: 2.6vw 3.2vw 2vw;
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 3vw;
    color: #9a9a9a;
    font-size: 3.4vw;
}

.section-title:before,
.section-title:after {
    content: "";
    flex: 1;
    height: 1px;
    background: #dedede;
}

.business-list {
    padding: 0 2.4vw 2vw;
}

.home-page .business-list {
    flex: 1;
    min-height: 0;
    overflow-y: auto;
    padding-bottom: 4vw;
    -webkit-overflow-scrolling: touch;
}

.business-card {
    position: relative;
    display: flex;
    gap: 3vw;
    margin-bottom: 2.4vw;
    padding: 2.6vw;
    border-radius: 1.6vw;
    background: #fff;
    box-shadow: 0 .2vw 1.5vw rgba(0,0,0,.04);
}

.home-page .business-card {
    gap: 2.4vw;
    margin-bottom: 2vw;
    padding: 2.4vw;
}

.business-card img {
    flex: 0 0 26vw;
    width: 26vw;
    height: 26vw;
    border-radius: 1.2vw;
    object-fit: cover;
    background: #eee;
}

.home-page .business-card img {
    flex-basis: 27vw;
    width: 27vw;
    height: 27vw;
}

.business-info {
    flex: 1;
    min-width: 0;
}

.business-title {
    margin: .5vw 0 1.4vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 4.5vw;
    font-weight: 900;
}

.home-page .business-title {
    margin: .2vw 0 .8vw;
    font-size: 4.25vw;
}

.sale-line,
.delivery-line,
.good-line,
.tag-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 1.4vw;
    margin-top: 1.1vw;
    font-size: 3.05vw;
    color: #555;
}

.home-page .sale-line,
.home-page .delivery-line,
.home-page .good-line,
.home-page .tag-line {
    gap: 1.1vw;
    margin-top: .7vw;
    font-size: 2.9vw;
    line-height: 1.18;
}

.home-page .tag-line {
    max-height: 7.4vw;
    overflow: hidden;
}

.sale-line .score {
    color: #ff5a00;
    font-weight: 900;
}

.delivery-tag {
    margin-left: auto;
    padding: .5vw 1.4vw;
    border-radius: .7vw;
    color: #ff5a00;
    background: #fff1e8;
    font-size: 3vw;
    font-weight: 700;
}

.good-line span {
    color: #f27a00;
    font-weight: 700;
}

.tag {
    padding: .6vw 1.4vw;
    border: 1px solid #ececec;
    border-radius: .8vw;
    color: #777;
    background: #fafafa;
}

.tag.red {
    border-color: #ffd6c4;
    color: #f15b22;
    background: #fff7f3;
}

.more-dot {
    position: absolute;
    right: 3vw;
    bottom: 2vw;
    color: #c5c5c5;
}

.footer {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 0;
    height: 14vw;
    display: flex;
    border-top: 1px solid #e7e7e7;
    background: #fff;
    z-index: 40;
}

.footer a {
    flex: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: .9vw;
    color: #333;
    font-size: 3vw;
}

.footer i {
    font-size: 5.3vw;
}

.footer .active {
    color: #ff5a00;
}

.page-head {
    height: 12vw;
    display: flex;
    align-items: center;
    padding: 0 3vw;
    background: #fff;
    border-bottom: 1px solid #e9e9e9;
    font-size: 4.4vw;
    font-weight: 800;
}

.page-head button {
    width: 8vw;
    height: 8vw;
    margin-right: 1vw;
    border: 0;
    background: transparent;
    font-size: 5vw;
}

.white-card {
    margin: 2.5vw;
    padding: 3.2vw;
    border-radius: 1.8vw;
    background: #fff;
}

.tabs {
    position: sticky;
    top: 0;
    z-index: 20;
    display: flex;
    height: 11vw;
    background: #fff;
    border-bottom: 1px solid #eeeeee;
}

.tabs button,
.tabs a {
    flex: 1;
    border: 0;
    background: #fff;
    text-align: center;
    line-height: 11vw;
    font-size: 3.8vw;
    font-weight: 700;
}

.tabs .active {
    color: #ff5a00;
    border-bottom: .7vw solid #ff5a00;
}

.shop-cover {
    min-height: 60vw;
    color: #fff;
    background: linear-gradient(180deg, rgba(0,0,0,.4), rgba(0,0,0,.1)), url("../img/index_banner.png") center/cover;
}

.shop-cover .page-head {
    color: #fff;
    background: transparent;
    border: 0;
}

.shop-card {
    margin: 18vw 3vw 0;
    padding: 3vw;
    border-radius: 2vw;
    color: #222;
    background: #fff;
}

.shop-name {
    margin: 0 0 2vw;
    font-size: 5vw;
    font-weight: 900;
}

.shop-data {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    text-align: center;
    color: #555;
    font-size: 3vw;
}

.shop-data strong {
    display: block;
    margin-bottom: .5vw;
    color: #222;
    font-size: 4vw;
}

.notice {
    margin-top: 2.5vw;
    color: #666;
    font-size: 3vw;
    line-height: 1.45;
}

.coupon-row {
    display: flex;
    gap: 2vw;
    overflow-x: auto;
    padding: 2.5vw 3vw;
    background: #fff;
}

.coupon-row span {
    flex: 0 0 auto;
    padding: 1.4vw 2vw;
    border-radius: 1vw;
    color: #e84c16;
    background: #fff0e8;
    font-size: 3vw;
    font-weight: 800;
}

.menu-area {
    display: flex;
    height: calc(100vh - 11vw);
    background: #fff;
}

.side-menu {
    flex: 0 0 25vw;
    overflow-y: auto;
    background: #f5f6f7;
}

.side-menu button {
    width: 100%;
    min-height: 13vw;
    padding: 2vw;
    border: 0;
    background: transparent;
    color: #555;
    text-align: left;
    font-size: 3.2vw;
}

.side-menu .active {
    color: #222;
    background: #fff;
    font-weight: 900;
}

.food-list {
    flex: 1;
    overflow-y: auto;
    padding-bottom: 20vw;
}

.category-title {
    padding: 3vw;
    font-size: 4vw;
    font-weight: 900;
}

.food {
    display: flex;
    gap: 2.5vw;
    padding: 3vw;
    border-bottom: 1px solid #f0f0f0;
}

.food img {
    width: 20vw;
    height: 20vw;
    border-radius: 1.2vw;
    object-fit: cover;
}

.food h4 {
    margin: 0 0 1vw;
    font-size: 3.8vw;
    line-height: 1.25;
}

.food p {
    margin: 0 0 1vw;
    color: #777;
    font-size: 3vw;
    line-height: 1.35;
}

.price {
    color: #ff4d00;
    font-size: 4.5vw;
    font-weight: 900;
}

.old-price {
    color: #999;
    font-size: 3vw;
    text-decoration: line-through;
}

.food button,
.round-btn {
    min-width: 15vw;
    height: 7.5vw;
    border: 0;
    border-radius: 4vw;
    color: #fff;
    background: #ff5a00;
    font-size: 3.2vw;
    font-weight: 800;
}

.cart-bar {
    position: fixed;
    left: 3vw;
    right: 3vw;
    bottom: 3vw;
    height: 13vw;
    display: flex;
    align-items: center;
    overflow: hidden;
    border-radius: 7vw;
    color: #fff;
    background: #30323a;
    z-index: 50;
}

.cart-bar div {
    flex: 1;
    padding-left: 5vw;
}

.cart-bar button {
    align-self: stretch;
    width: 27vw;
    border: 0;
    color: #fff;
    background: #00b956;
    font-size: 3.8vw;
    font-weight: 900;
}

.modal-mask {
    position: fixed;
    inset: 0;
    display: none;
    background: rgba(0,0,0,.45);
    z-index: 80;
}

.modal-mask.show {
    display: block;
}

.spec-modal {
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    padding: 4vw;
    border-radius: 4vw 4vw 0 0;
    background: #fff;
}

.spec-modal h3 {
    margin: 0 0 2vw;
    font-size: 4.5vw;
}

.spec-options {
    display: flex;
    flex-wrap: wrap;
    gap: 2vw;
    margin: 3vw 0;
}

.spec-options button {
    padding: 1.8vw 3vw;
    border: 1px solid #eee;
    border-radius: 1vw;
    background: #f7f7f7;
    font-size: 3.3vw;
}

.spec-options .active {
    color: #ff5a00;
    border-color: #ff5a00;
    background: #fff4ee;
}

.row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3vw;
}

.cell {
    min-height: 12vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 3vw;
    border-bottom: 1px solid #f0f0f0;
    font-size: 3.5vw;
}

.cell:last-child {
    border-bottom: 0;
}

.muted {
    color: #888;
}

.small {
    font-size: 3vw;
}

.orange {
    color: #ff5a00;
}

.order-card h3,
.white-card h3 {
    margin: 0 0 2vw;
    font-size: 4.2vw;
}

.pill-list {
    display: flex;
    flex-wrap: wrap;
    gap: 2vw;
}

.pill-list span {
    padding: 1.4vw 2.2vw;
    border-radius: 4vw;
    color: #52606d;
    background: #eef6ff;
    font-size: 3vw;
}

.timeline {
    position: relative;
    padding-left: 6vw;
}

.timeline:before {
    content: "";
    position: absolute;
    left: 1.7vw;
    top: 1vw;
    bottom: 1vw;
    width: 1px;
    background: #ddd;
}

.timeline div {
    position: relative;
    margin-bottom: 4vw;
}

.timeline div:before {
    content: "";
    position: absolute;
    left: -5.2vw;
    top: .5vw;
    width: 2.7vw;
    height: 2.7vw;
    border-radius: 50%;
    background: #ff5a00;
}

body.shop-page {
    height: 100vh;
    overflow: hidden;
    background: #fff;
}

.shop-page .wrapper {
    height: 100vh;
    min-height: 0;
    display: flex;
    flex-direction: column;
    overflow: hidden;
    padding-bottom: 0;
    background: #fff;
}

.shop-hero {
    position: relative;
    flex: 0 0 auto;
    min-height: 43vw;
    padding-top: 2vw;
    background-position: center;
    background-size: cover;
}

.shop-topbar {
    display: flex;
    align-items: center;
    gap: 3vw;
    padding: 1vw 3.2vw 0;
}

.shop-topbar button {
    width: 8vw;
    height: 8vw;
    border: 0;
    color: #fff;
    background: transparent;
    font-size: 5.2vw;
}

.shop-search {
    flex: 1;
    height: 9vw;
    display: flex;
    align-items: center;
    gap: 2vw;
    padding: 0 3vw;
    border-radius: 1.8vw;
    color: #999;
    background: rgba(255,255,255,.86);
    font-size: 3.4vw;
}

.shop-info-card {
    position: relative;
    display: flex;
    gap: 3vw;
    margin: 20vw 3.2vw 0;
    padding: 2.6vw 2.6vw 2.2vw;
    border-radius: 2vw 2vw 0 0;
    background: #fff;
}

.shop-info-card img {
    flex: 0 0 16vw;
    width: 16vw;
    height: 16vw;
    border-radius: 1.2vw;
    object-fit: cover;
    box-shadow: 0 .4vw 1.4vw rgba(0,0,0,.12);
}

.shop-main-info {
    flex: 1;
    min-width: 0;
}

.shop-main-info h1 {
    margin: 0 0 1.4vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 5vw;
    font-weight: 900;
}

.shop-data-line {
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    gap: 3vw;
    color: #777;
    font-size: 3vw;
}

.shop-data-line b {
    color: #ff5a00;
    font-size: 4vw;
}

.shop-main-info p {
    margin: 1.5vw 0 0;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #777;
    font-size: 3vw;
}

.shop-page .coupon-row {
    flex: 0 0 auto;
    padding: 2vw 3vw;
}

.shop-page .coupon-row span {
    color: #ff5a00;
    background: #fff3e9;
}

.shop-tabs {
    flex: 0 0 11vw;
    position: relative;
}

.shop-tabs .story-tip {
    color: #ff5a00;
    font-size: 2.3vw;
}

.shop-page .shop-panel {
    min-height: 0;
}

.shop-page #panel-menu {
    flex: 1;
    overflow: hidden;
    position: relative;
}

.shop-page .menu-area {
    height: 100%;
    min-height: 0;
    padding-bottom: 28vw;
}

.shop-page .side-menu {
    flex-basis: 23vw;
}

.shop-page .side-menu button {
    min-height: 12vw;
    font-size: 3vw;
}

.shop-page .food-list {
    padding-bottom: 38vw;
    background: #fff;
}

.shop-feature-row {
    display: flex;
    gap: 2vw;
    overflow-x: auto;
    padding: 3vw;
    background: #f20;
}

.feature-food {
    position: relative;
    flex: 0 0 28vw;
    min-height: 36vw;
    padding: 1.5vw;
    border-radius: 1.5vw;
    background: #fff;
}

.feature-food img {
    width: 100%;
    height: 18vw;
    object-fit: cover;
    border-radius: 1vw;
}

.feature-food span {
    display: block;
    height: 8vw;
    overflow: hidden;
    margin-top: 1vw;
    font-size: 2.8vw;
    line-height: 1.3;
}

.feature-food b {
    color: #ff4d00;
    font-size: 3.2vw;
}

.feature-food button {
    position: absolute;
    right: 1.5vw;
    bottom: 1.4vw;
    width: 6vw;
    height: 6vw;
    min-width: 0;
    border-radius: 50%;
    font-size: 4.5vw;
    line-height: 6vw;
}

.food-info {
    flex: 1;
    min-width: 0;
}

.food-bottom {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 2vw;
}

.food-bottom button {
    min-width: 13vw;
    height: 6.8vw;
    padding: 0 2vw;
}

.cart-promo {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 18vw;
    height: 9vw;
    display: flex;
    align-items: center;
    gap: 2vw;
    padding: 0 4vw;
    color: #ff5a00;
    background: #fff3dd;
    font-size: 3.2vw;
    z-index: 49;
}

.cart-promo i {
    width: 4.8vw;
    height: 4.8vw;
    border-radius: 1vw;
    color: #fff;
    background: #ff3d2e;
    text-align: center;
    line-height: 4.8vw;
    font-size: 2.8vw;
}

.cart-promo span {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.shop-page .cart-bar {
    left: 0;
    right: 0;
    bottom: 0;
    height: 18vw;
    border-radius: 0;
    color: #111;
    background: #fff;
    box-shadow: 0 -.3vw 1.8vw rgba(0,0,0,.08);
    overflow: visible;
    z-index: 75;
}

.shop-page .cart-icon {
    position: absolute;
    left: 4vw;
    top: 3vw;
    width: 12vw;
    height: 12vw;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #ff6a00;
    cursor: pointer;
}

.shop-page .cart-icon svg {
    width: 6.8vw;
    height: 6.8vw;
    fill: none;
    stroke: #fff;
    stroke-width: 2;
    stroke-linecap: round;
    stroke-linejoin: round;
}

.shop-page .cart-icon em {
    position: absolute;
    right: -1vw;
    top: -1.6vw;
    min-width: 4.8vw;
    height: 4.8vw;
    padding: 0 1vw;
    border-radius: 3vw;
    color: #fff;
    background: #ff2f22;
    text-align: center;
    font-style: normal;
    font-size: 3vw;
    font-weight: 900;
    line-height: 4.8vw;
    box-sizing: border-box;
}

.shop-page .cart-bar div {
    min-width: 0;
    padding-left: 17vw;
    line-height: 1.18;
    cursor: pointer;
}

.shop-page .cart-bar strong {
    display: inline-block;
    margin-bottom: .7vw;
    color: #111;
    font-size: 5.6vw;
    line-height: 1;
}

.shop-page .cart-bar:before {
    content: none;
}

.shop-page .cart-bar:after {
    content: none;
}

.shop-page .cart-bar button {
    margin-right: 3vw;
    align-self: center;
    width: 31vw;
    height: 12vw;
    border-radius: 2vw;
    background: #ff6a00;
    font-size: 4.4vw;
}

.shop-page .cart-bar button.disabled {
    background: #ffb27a;
}

.shop-page .cart-bar button.active {
    background: #ff5a00;
}

.shop-page .cart-bar .small {
    display: block;
    overflow: hidden;
    max-width: 47vw;
    color: #7f8a99;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 3.1vw;
}

.cart-panel-mask {
    position: fixed;
    inset: 0;
    display: none;
    background: rgba(0,0,0,.55);
    z-index: 55;
}

.cart-panel-mask.show {
    display: block;
}

.cart-panel {
    position: fixed;
    left: 0;
    right: 0;
    bottom: 18vw;
    display: none;
    max-height: 72vh;
    overflow: hidden;
    border-radius: 3vw 3vw 0 0;
    background: #fff;
    z-index: 60;
}

.cart-panel.show {
    display: block;
}

.cart-panel-promo {
    height: 9vw;
    display: flex;
    align-items: center;
    gap: 2vw;
    padding: 0 3vw;
    color: #ff4d35;
    background: linear-gradient(90deg, #fff1e8, #fff8e8);
    font-size: 3.1vw;
    white-space: nowrap;
}

.cart-panel-promo span {
    height: 5vw;
    display: inline-flex;
    align-items: center;
    gap: 1vw;
    padding: 0 1.4vw;
    border: 1px solid #ff553b;
    border-radius: 3vw;
    background: #fff;
}

.cart-panel-promo span:first-child {
    color: #fff;
    background: #ff3d2e;
}

.cart-panel-promo b {
    flex: 1;
    height: 1px;
    min-width: 3vw;
    background: #ff4d35;
}

.cart-panel-promo em {
    color: #ff3d2e;
    font-style: normal;
    font-weight: 800;
}

.cart-panel-head {
    height: 14vw;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 0 4vw;
    border-bottom: 1px solid #eee;
    color: #19202b;
    background: #fff;
}

.cart-panel-head strong {
    margin-right: 2vw;
    font-size: 4.2vw;
}

.cart-panel-head span {
    color: #7a8494;
    font-size: 3.2vw;
}

.cart-panel-head b {
    color: #ff4d35;
}

.cart-panel-head i {
    margin-left: 1vw;
    color: #b7bdc7;
    font-size: 3.4vw;
}

.cart-panel-head button {
    border: 0;
    color: #8a94a3;
    background: transparent;
    font-size: 3.4vw;
}

.cart-panel-list {
    max-height: 47vh;
    overflow-y: auto;
    padding: 0 4vw 2vw;
}

.cart-empty {
    padding: 10vw 0;
    color: #9aa3ad;
    text-align: center;
    font-size: 3.5vw;
}

.cart-bag-title {
    height: 13vw;
    display: flex;
    align-items: center;
    gap: 3vw;
    color: #111;
    font-size: 4vw;
}

.cart-bag-title strong {
    font-size: 4.2vw;
}

.checked-dot,
.cart-bag-title span {
    width: 6vw;
    height: 6vw;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border: 1px solid #ff5a00;
    border-radius: 50%;
    color: #fff;
    background: #ff5a00;
    box-sizing: border-box;
    font-size: 3.2vw;
}

.cart-bag-off {
    color: #555;
}

.cart-bag-off span {
    background: #fff;
    border-color: #cfd3d8;
}

.cart-line {
    min-height: 22vw;
    display: flex;
    gap: 3vw;
    padding-bottom: 3vw;
}

.cart-line img {
    flex: 0 0 18vw;
    width: 18vw;
    height: 18vw;
    border-radius: 1vw;
    object-fit: cover;
    background: #f7f7f7;
}

.cart-line-main {
    flex: 1;
    min-width: 0;
}

.cart-line-main h4 {
    margin: 0 0 1.4vw;
    overflow: hidden;
    color: #252a31;
    font-size: 3.7vw;
    line-height: 1.35;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
}

.cart-line-main h4 span {
    display: inline-block;
    margin-right: 1.5vw;
    padding: .5vw 1vw;
    border-radius: .8vw;
    color: #fff;
    background: #ff4c35;
    font-size: 2.8vw;
    line-height: 1;
    vertical-align: middle;
}

.cart-line-main p {
    margin: 0 0 1.4vw;
    color: #8c95a3;
    font-size: 3vw;
}

.cart-line-price {
    display: flex;
    align-items: baseline;
    gap: 2vw;
}

.cart-line-price b {
    color: #ff4d35;
    font-size: 4.4vw;
}

.cart-line-price em {
    color: #9299a5;
    text-decoration: line-through;
    font-style: normal;
    font-size: 3.2vw;
}

.cart-stepper {
    flex: 0 0 27vw;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 3vw;
}

.cart-stepper button {
    width: 7vw;
    height: 7vw;
    border: 1px solid #ff5a00;
    border-radius: 50%;
    color: #ff5a00;
    background: #fff;
    font-size: 4.6vw;
    line-height: 6vw;
    font-weight: 800;
}

.cart-stepper button:last-child {
    color: #fff;
    background: #ff5a00;
}

.cart-stepper span {
    min-width: 4vw;
    color: #222;
    text-align: center;
    font-size: 3.8vw;
}

.cart-panel-tip {
    padding: 0 4vw 3vw;
    color: #8c95a3;
    font-size: 3.3vw;
}

.review-panel,
.merchant-panel {
    flex: 1;
    overflow-y: auto;
    background: #f5f6f7;
}

.review-tags {
    display: flex;
    gap: 6vw;
    overflow-x: auto;
    padding: 3vw;
    background: #fff;
    color: #333;
    font-size: 3.4vw;
}

.review-tags .active {
    color: #ff5a00;
    font-weight: 900;
}

.review-card img {
    width: 44vw;
    height: 28vw;
    border-radius: 1vw;
    object-fit: cover;
}

.merchant-reply {
    margin-top: 2vw;
    padding: 2.4vw;
    border-radius: 1vw;
    color: #69727d;
    background: #f3f4f5;
    font-size: 3vw;
    line-height: 1.45;
}

.shop-spec-modal {
    max-height: 83vh;
    overflow-y: auto;
    padding: 4vw 3.2vw 3vw;
    border-radius: 2vw 2vw 0 0;
}

.spec-close {
    position: absolute;
    right: 3vw;
    top: 3vw;
    width: 8vw;
    height: 8vw;
    border: 0;
    color: #222;
    background: transparent;
    font-size: 5vw;
}

.spec-head {
    display: flex;
    gap: 3vw;
    padding-right: 9vw;
}

.spec-head img {
    width: 22vw;
    height: 22vw;
    border-radius: 1vw;
    object-fit: cover;
}

.spec-head h3 {
    margin: 0 0 1vw;
    font-size: 4.6vw;
    line-height: 1.25;
}

.spec-badge {
    display: inline-block;
    margin: 1vw 0;
    padding: .5vw 1vw;
    border: 1px solid #ff6a00;
    color: #ff5a00;
    font-size: 2.8vw;
}

.spec-price-line {
    display: flex;
    align-items: baseline;
    gap: 2vw;
}

.spec-section-title {
    margin: 5vw 0 2vw;
    color: #333;
    font-size: 3.5vw;
    font-weight: 800;
}

.spec-card-options {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 3vw;
}

.spec-option-card {
    min-height: 42vw;
    padding: 1.8vw;
    border: 1px solid #eee;
    border-radius: 1vw;
    background: #f8f8f8;
    text-align: left;
}

.spec-option-card.active {
    border-color: #ff6a00;
    background: #fffaf6;
}

.spec-option-card img {
    width: 100%;
    height: 22vw;
    border-radius: .8vw;
    object-fit: cover;
    background: #fff;
}

.spec-option-card span {
    display: block;
    min-height: 8vw;
    margin: 1vw 0;
    color: #333;
    font-size: 3vw;
    line-height: 1.25;
}

.spec-option-card b {
    font-size: 3.4vw;
}

.spec-count-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin: 7vw 0;
    font-size: 3.8vw;
}

.stepper {
    display: flex;
    align-items: center;
    gap: 4vw;
}

.stepper button {
    width: 7vw;
    height: 7vw;
    border: 0;
    background: transparent;
    color: #555;
    font-size: 5vw;
}

.stepper span {
    min-width: 8vw;
    height: 7vw;
    text-align: center;
    line-height: 7vw;
    background: #f5f5f5;
}

.spec-submit {
    width: 100%;
    height: 12vw;
    border: 0;
    border-radius: 1.4vw;
    color: #fff;
    background: #ff5a00;
    font-size: 4.2vw;
    font-weight: 800;
}

.login-page {
    background: #fff;
}

.login-wrapper {
    min-height: 100vh;
    padding: 6vw 4.5vw;
    background: #fff;
}

.login-back {
    width: 9vw;
    height: 9vw;
    border: 0;
    color: #333;
    background: transparent;
    font-size: 5vw;
}

.login-brand {
    margin-top: 8vw;
    text-align: center;
}

.login-logo {
    width: 18vw;
    height: 18vw;
    margin: 0 auto 4vw;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 4vw;
    color: #fff;
    background: linear-gradient(180deg, #ff8b32, #ff5a00);
    box-shadow: 0 3vw 5vw rgba(255,90,0,.18);
    font-size: 5vw;
    line-height: 1.05;
    font-weight: 900;
}

.login-brand h1 {
    margin: 0 0 8vw;
    color: #ff5a00;
    font-size: 7.5vw;
    font-weight: 900;
}

.login-tabs {
    display: flex;
    justify-content: center;
    gap: 8vw;
    margin-bottom: 5vw;
}

.login-tabs button {
    border: 0;
    color: #777;
    background: transparent;
    font-size: 4.6vw;
    font-weight: 800;
}

.login-tabs button.active {
    color: #111;
}

.login-panel {
    padding: 0 .5vw;
}

.login-input-row {
    height: 13.4vw;
    display: flex;
    align-items: center;
    margin-bottom: 3.4vw;
    padding: 0 5vw;
    border-radius: 1.6vw;
    background: #f3f5f7;
}

.login-input-row span {
    flex: 0 0 22vw;
    color: #333;
    font-size: 4.5vw;
}

.login-input-row input {
    flex: 1;
    min-width: 0;
    border: 0;
    outline: 0;
    color: #333;
    background: transparent;
    font-size: 4.5vw;
}

.login-input-row button {
    flex: 0 0 24vw;
    border: 0;
    color: #ff5a00;
    background: transparent;
    font-size: 4vw;
    font-weight: 700;
}

.login-agree {
    display: flex;
    align-items: flex-start;
    gap: 2vw;
    margin: 5vw 0;
    color: #6f7890;
    font-size: 3.5vw;
    line-height: 1.45;
}

.login-agree button {
    flex: 0 0 5.2vw;
    width: 5.2vw;
    height: 5.2vw;
    margin-top: .4vw;
    border: .5vw solid #c9d0d8;
    border-radius: 50%;
    background: #fff;
}

.login-agree button.checked {
    border-color: #ff5a00;
    background: #ff5a00;
    box-shadow: inset 0 0 0 1.2vw #fff;
}

.login-agree a {
    color: #1677ff;
}

.login-submit {
    width: 100%;
    height: 13vw;
    border: 0;
    border-radius: 1.5vw;
    color: #fff;
    background: #ffad7c;
    font-size: 4.5vw;
    font-weight: 900;
}

.auth-message {
    min-height: 6vw;
    margin: 4vw 0 0;
    color: #ff5a00;
    text-align: center;
    font-size: 3.5vw;
}