/* Guagua mobile — Vibrant Blocks theme. Presentation only. */
html.ggl-vibrant {
  --vb-paper: #fff4dc;
  --vb-surface: #fffdf7;
  --vb-ink: #171717;
  --vb-muted: #6f655b;
  --vb-line: #171717;
  --vb-orange: #ff5a1f;
  --vb-orange-dark: #d94312;
  --vb-yellow: #ffe42e;
  --vb-mint: #20c997;
  --vb-blue: #5b8def;
  --vb-shadow: 4px 4px 0 #171717;
  --vb-shadow-small: 2px 2px 0 #171717;
  background: var(--vb-paper);
  color: var(--vb-ink);
}

html.ggl-vibrant body {
  background: var(--vb-paper) !important;
  color: var(--vb-ink) !important;
  font-family: "PingFang SC", "Microsoft YaHei", system-ui, sans-serif !important;
}

html.ggl-vibrant body::before {
  background-image: radial-gradient(rgba(23,23,23,.07) .7px, transparent .7px);
  background-size: 13px 13px;
  content: "";
  inset: 0;
  pointer-events: none;
  position: fixed;
  z-index: -1;
}

html.ggl-vibrant a { color: inherit; }
html.ggl-vibrant img { max-width: 100%; }

/* Shared page chrome */
html.ggl-vibrant .header,
html.ggl-vibrant .top,
html.ggl-vibrant .topbar,
html.ggl-vibrant .mui-bar,
html.ggl-vibrant .weui-navbar,
html.ggl-vibrant .nav_head {
  background: var(--vb-yellow) !important;
  border-bottom: 2px solid var(--vb-line) !important;
  box-shadow: 0 3px 0 rgba(23,23,23,.14) !important;
  color: var(--vb-ink) !important;
}

html.ggl-vibrant .header h1,
html.ggl-vibrant .mui-title,
html.ggl-vibrant .topbar .title,
html.ggl-vibrant .nav_head .title {
  color: var(--vb-ink) !important;
  font-weight: 900 !important;
  letter-spacing: .04em;
}

/* Reusable block surfaces across list, detail, user, forms and admin pages */
html.ggl-vibrant .item_title_box,
html.ggl-vibrant .p_module,
html.ggl-vibrant .u_module,
html.ggl-vibrant .div_form,
html.ggl-vibrant .com_mdoule,
html.ggl-vibrant .box,
html.ggl-vibrant .panel,
html.ggl-vibrant .card,
html.ggl-vibrant .module,
html.ggl-vibrant .content form,
html.ggl-vibrant .mui-card,
html.ggl-vibrant .weui-panel,
html.ggl-vibrant .weui-cells,
html.ggl-vibrant .data,
html.ggl-vibrant .popup,
html.ggl-vibrant .tipMask .cont,
html.ggl-vibrant .signMask .cont,
html.ggl-vibrant .layui-layer {
  background: var(--vb-surface) !important;
  border: 2px solid var(--vb-line) !important;
  border-radius: 10px !important;
  box-shadow: var(--vb-shadow) !important;
  color: var(--vb-ink) !important;
}

html.ggl-vibrant .p_module,
html.ggl-vibrant .u_module,
html.ggl-vibrant .div_form,
html.ggl-vibrant .content form,
html.ggl-vibrant .mui-card,
html.ggl-vibrant .weui-panel,
html.ggl-vibrant .weui-cells {
  margin-left: 12px !important;
  margin-right: 12px !important;
}

html.ggl-vibrant .p_m_title,
html.ggl-vibrant .u_m_title,
html.ggl-vibrant .module_title,
html.ggl-vibrant .form_title,
html.ggl-vibrant .weui-cells__title {
  color: var(--vb-ink) !important;
  font-weight: 900 !important;
}

html.ggl-vibrant .p_m_title::before,
html.ggl-vibrant .u_m_title::before,
html.ggl-vibrant .module_title::before {
  background: var(--vb-orange) !important;
}

html.ggl-vibrant hr,
html.ggl-vibrant .line,
html.ggl-vibrant .split,
html.ggl-vibrant .weui-cell::before,
html.ggl-vibrant .weui-cells::before,
html.ggl-vibrant .weui-cells::after {
  border-color: rgba(23,23,23,.2) !important;
}

/* Controls */
html.ggl-vibrant input:not([type="checkbox"]):not([type="radio"]),
html.ggl-vibrant select,
html.ggl-vibrant textarea,
html.ggl-vibrant .weui-input,
html.ggl-vibrant .mui-input-row input {
  background: #fff !important;
  border: 2px solid var(--vb-line) !important;
  border-radius: 8px !important;
  box-sizing: border-box !important;
  color: var(--vb-ink) !important;
  outline: none !important;
}

html.ggl-vibrant input:focus,
html.ggl-vibrant select:focus,
html.ggl-vibrant textarea:focus {
  border-color: var(--vb-orange) !important;
  box-shadow: 0 0 0 3px rgba(255,90,31,.18) !important;
}

html.ggl-vibrant button,
html.ggl-vibrant input[type="button"],
html.ggl-vibrant input[type="submit"],
html.ggl-vibrant .btn,
html.ggl-vibrant .button,
html.ggl-vibrant .form_button,
html.ggl-vibrant .p_m_btn,
html.ggl-vibrant .p_confirmbtn_box2,
html.ggl-vibrant .p_confirmbtn_box2_a,
html.ggl-vibrant .weui-btn_primary,
html.ggl-vibrant .mui-btn-primary,
html.ggl-vibrant .confirm,
html.ggl-vibrant .submit {
  align-items: center !important;
  background: var(--vb-orange) !important;
  border: 2px solid var(--vb-line) !important;
  border-radius: 8px !important;
  box-shadow: var(--vb-shadow-small) !important;
  color: #fff !important;
  display: inline-flex;
  font-weight: 900 !important;
  justify-content: center !important;
  letter-spacing: .04em;
  text-align: center !important;
  text-shadow: 0 1px 0 rgba(0,0,0,.18);
  transition: transform .16s ease, box-shadow .16s ease, filter .16s ease;
}

html.ggl-vibrant button:active,
html.ggl-vibrant .btn:active,
html.ggl-vibrant .form_button:active,
html.ggl-vibrant .p_m_btn:active,
html.ggl-vibrant .p_confirmbtn_box2:active,
html.ggl-vibrant .confirm:active {
  box-shadow: 0 0 0 var(--vb-line) !important;
  transform: translate(2px,2px);
}

html.ggl-vibrant button[disabled],
html.ggl-vibrant .disabled {
  filter: grayscale(.7);
  opacity: .55;
}

/* Details and purchase sheet */
html.ggl-vibrant .item_title_box {
  margin: 12px !important;
  padding: 12px !important;
}

html.ggl-vibrant .item_title_box_desc,
html.ggl-vibrant .item_title_box_desc h1,
html.ggl-vibrant .item_title_box_desc h2,
html.ggl-vibrant .p_name,
html.ggl-vibrant .product_name {
  color: var(--vb-ink) !important;
  font-weight: 900 !important;
}

html.ggl-vibrant .p_tariff .price,
html.ggl-vibrant .price,
html.ggl-vibrant .money,
html.ggl-vibrant .amount,
html.ggl-vibrant .num strong {
  color: var(--vb-orange-dark) !important;
  font-weight: 900 !important;
}

html.ggl-vibrant .progress,
html.ggl-vibrant .timepro,
html.ggl-vibrant .weui-progress__bar {
  background: #ece7dd !important;
  border: 1px solid var(--vb-line) !important;
  border-radius: 999px !important;
  overflow: hidden;
}

html.ggl-vibrant .progress > span,
html.ggl-vibrant .timepro-go,
html.ggl-vibrant .weui-progress__inner-bar {
  background: linear-gradient(90deg,var(--vb-orange),var(--vb-yellow)) !important;
}

html.ggl-vibrant .tipMask,
html.ggl-vibrant .signMask,
html.ggl-vibrant .mask,
html.ggl-vibrant .weui-mask {
  background: rgba(23,23,23,.58) !important;
  backdrop-filter: blur(2px);
}

html.ggl-vibrant .tipMask .cont,
html.ggl-vibrant .signMask .cont,
html.ggl-vibrant .popup {
  border-radius: 14px 14px 0 0 !important;
  padding-bottom: max(16px,env(safe-area-inset-bottom)) !important;
}

/* Personal center and management lists */
html.ggl-vibrant .user_top,
html.ggl-vibrant .user_info,
html.ggl-vibrant .member_top,
html.ggl-vibrant .manage_top,
html.ggl-vibrant .container.user > a > .u_header,
html.ggl-vibrant .container.user > .u_header {
  background: var(--vb-yellow) !important;
  border: 2px solid var(--vb-line) !important;
  border-radius: 10px !important;
  box-shadow: var(--vb-shadow) !important;
  color: var(--vb-ink) !important;
  margin: 12px !important;
  padding: 18px !important;
}

html.ggl-vibrant .u_header_name,
html.ggl-vibrant .ui-admin-heading h1 {
  color: var(--vb-ink) !important;
  font-weight: 900 !important;
}

html.ggl-vibrant .u_h_surplus,
html.ggl-vibrant .u_body,
html.ggl-vibrant .user .data {
  background: var(--vb-surface) !important;
  border: 2px solid var(--vb-line) !important;
  border-radius: 10px !important;
  box-shadow: var(--vb-shadow) !important;
  box-sizing: border-box !important;
  margin: 14px 12px !important;
}

html.ggl-vibrant .u_h_surplus {
  padding: 16px !important;
}

html.ggl-vibrant .u_h_surplus > span {
  color: var(--vb-orange-dark) !important;
  font-weight: 900 !important;
}

html.ggl-vibrant .u_h_s_btn {
  align-items: center !important;
  background: var(--vb-orange) !important;
  border: 2px solid var(--vb-line) !important;
  border-radius: 7px !important;
  box-shadow: var(--vb-shadow-small) !important;
  color: #fff !important;
  display: inline-flex !important;
  font-weight: 900 !important;
  justify-content: center !important;
}

html.ggl-vibrant .u_h_s_btn.type_2 {
  background: var(--vb-yellow) !important;
  color: var(--vb-ink) !important;
}

html.ggl-vibrant .u_body_info,
html.ggl-vibrant .u_m_content .u_m_item {
  color: var(--vb-ink) !important;
  font-weight: 700 !important;
}

html.ggl-vibrant .u_body_info + .u_body_info,
html.ggl-vibrant .u_m_content .u_m_item {
  border-color: rgba(23,23,23,.18) !important;
}

html.ggl-vibrant .u_m_content .u_m_item:active {
  background: #fff0c2 !important;
}

html.ggl-vibrant .weui-cell,
html.ggl-vibrant .mui-table-view-cell,
html.ggl-vibrant .list_item,
html.ggl-vibrant li.item {
  color: var(--vb-ink) !important;
}

html.ggl-vibrant .weui-cell:active,
html.ggl-vibrant .mui-table-view-cell:active,
html.ggl-vibrant .list_item:active {
  background: #fff0c2 !important;
}

html.ggl-vibrant .badge,
html.ggl-vibrant .tag,
html.ggl-vibrant .label,
html.ggl-vibrant .status {
  background: var(--vb-yellow) !important;
  border: 1.5px solid var(--vb-line) !important;
  border-radius: 999px !important;
  color: var(--vb-ink) !important;
  font-weight: 800 !important;
}

/* Bottom navigation */
html.ggl-vibrant .footer,
html.ggl-vibrant .footer_menu,
html.ggl-vibrant .bottom_nav,
html.ggl-vibrant .weui-tabbar,
html.ggl-vibrant .mui-bar-tab {
  background: var(--vb-surface) !important;
  border-top: 2px solid var(--vb-line) !important;
  box-shadow: 0 -3px 0 rgba(23,23,23,.08) !important;
}

html.ggl-vibrant .footer .on,
html.ggl-vibrant .footer .active,
html.ggl-vibrant .footer_menu .on,
html.ggl-vibrant .weui-tabbar__item.weui-bar__item_on,
html.ggl-vibrant .mui-bar-tab .mui-active {
  color: var(--vb-orange) !important;
  font-weight: 900 !important;
}

/* Remove the obsolete lottery shortcut everywhere. */
html.ggl-vibrant .floating-button { display: none !important; }

@media (max-width: 380px) {
  html.ggl-vibrant .p_module,
  html.ggl-vibrant .u_module,
  html.ggl-vibrant .div_form,
  html.ggl-vibrant .content form,
  html.ggl-vibrant .mui-card,
  html.ggl-vibrant .weui-panel,
  html.ggl-vibrant .weui-cells { margin-left: 8px !important; margin-right: 8px !important; }
}

@media (prefers-reduced-motion: reduce) {
  html.ggl-vibrant *,
  html.ggl-vibrant *::before,
  html.ggl-vibrant *::after {
    animation-duration: .001ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .001ms !important;
  }
}


/* 2026-10-25: responsive containment. Never hide horizontal overflow at page level. */
html.ggl-vibrant .com_info {
 flex-wrap:wrap!important; gap:10px 8px!important; min-width:0;
 height:auto!important; box-sizing:border-box;
}
html.ggl-vibrant .com_info > .info_tag { min-width:0; max-width:100%; }
html.ggl-vibrant .com_info > a.db {
 flex:1 1 88px; min-width:0!important; max-width:100%; box-sizing:border-box;
}
html.ggl-vibrant .com_info .c_m_btn {
 min-width:0!important; max-width:100%; margin:0!important; padding:9px 10px!important;
 height:auto!important; min-height:40px; line-height:1.5!important;
 white-space:normal!important; overflow-wrap:anywhere; box-sizing:border-box;
}
html.ggl-vibrant .div_form, html.ggl-vibrant .content form { min-width:0; box-sizing:border-box; }
html.ggl-vibrant .div_form .sear { min-width:0!important; max-width:100%; }
html.ggl-vibrant .div_form .sear > label { display:block; min-width:0; max-width:100%; }
html.ggl-vibrant .div_form .sear input, html.ggl-vibrant .div_form .sear select {
 margin-left:0!important; margin-right:0!important; max-width:100%!important; box-sizing:border-box;
}
html.ggl-vibrant .content .line { min-width:0; height:auto!important; }
html.ggl-vibrant .content .line > *, html.ggl-vibrant .content .uploads { min-width:0; max-width:100%; }
html.ggl-vibrant .content .button { flex-wrap:wrap!important; }
html.ggl-vibrant .content .button > *, html.ggl-vibrant .div_form .form_button {
 min-width:0; max-width:100%; white-space:normal!important; overflow-wrap:anywhere;
}
html.ggl-vibrant .name-time, html.ggl-vibrant .ctitle { min-width:0; height:auto!important; }
html.ggl-vibrant .name-time > *, html.ggl-vibrant .ctitle > * {
 min-width:0; overflow-wrap:anywhere;
}
html.ggl-vibrant .cont .name-time .name { white-space:normal!important; overflow-wrap:anywhere; }
html.ggl-vibrant .name-time .time_a {
 float:none!important; width:auto!important; max-width:100%; white-space:normal!important;
 overflow-wrap:anywhere; box-sizing:border-box;
}
html.ggl-vibrant .list_box, html.ggl-vibrant .list_order,
html.ggl-vibrant .list_info_l, html.ggl-vibrant .list_info_r,
html.ggl-vibrant .list_caozuo_l, html.ggl-vibrant .list_caozuo_r {
 min-width:0; overflow-wrap:anywhere; box-sizing:border-box;
}
html.ggl-vibrant .list_info { display:flex; flex-wrap:wrap; gap:8px; }
html.ggl-vibrant .list_info_l, html.ggl-vibrant .list_info_r { flex:1 1 140px; float:none!important; }
html.ggl-vibrant .prdouct .p_banner { max-width:100%!important; }
html.ggl-vibrant .prdouct .p_m_info { white-space:normal!important; height:auto!important; overflow-wrap:anywhere; }
html.ggl-vibrant .prdouct .name_time .name { white-space:normal; overflow-wrap:anywhere; }
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .p_module_div {
 display:flex; flex-wrap:wrap; align-items:center; gap:8px; min-width:0;
 height:auto!important; padding-bottom:14px!important; margin:14px 0!important;
}
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .p_module_div > .xh,
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .p_module_div > .imgg,
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .p_module_div > .name_time,
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .p_module_div > .num_status {
 float:none!important; min-width:0; max-width:100%;
}
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .name_time { flex:1 1 100px; }
html.ggl-vibrant:not(.ggl-page-mobile-details) .prdouct .num_status { flex:1 1 150px; }
html.ggl-vibrant .tipMask .cont, html.ggl-vibrant .signMask .cont {
 position:fixed!important; left:50%!important; top:50%!important;
 transform:translate(-50%,-50%); width:calc(100% - 32px)!important;
 max-width:360px!important; max-height:calc(100vh - 48px);
 margin:0!important; padding:22px!important; box-sizing:border-box; overflow:auto;
}
html.ggl-vibrant #msgBox { height:100%!important; }
html.ggl-vibrant #msgBox > div {
 position:absolute; left:50%; top:50%; transform:translate(-50%,-50%);
 width:calc(100% - 32px)!important; max-width:360px; max-height:calc(100vh - 48px);
 margin:0!important; box-sizing:border-box; overflow:auto!important;
}
html.ggl-vibrant #msgContent { overflow-wrap:anywhere; }
html.ggl-vibrant #msgBtn { display:flex; flex-wrap:wrap; justify-content:flex-end; gap:8px; }
html.ggl-vibrant table.tablec { display:block; width:100%; max-width:100%; overflow-x:auto; }
@media(max-width:600px) {
 html.ggl-vibrant .content { padding:16px!important; }
 html.ggl-vibrant .content form { margin-left:0!important; margin-right:0!important; padding:16px!important; }
 html.ggl-vibrant .content .button > * { flex:1 1 110px; }
 html.ggl-vibrant .fix-bottom { box-sizing:border-box; width:100%!important; max-height:calc(100vh - 24px); overflow-y:auto; }
 html.ggl-vibrant .fix-bottom .number-box, html.ggl-vibrant .fix-bottom .items,
 html.ggl-vibrant .fix-bottom .money-box { flex-wrap:wrap; gap:10px; min-width:0; }
 html.ggl-vibrant .fix-bottom .number-box > *, html.ggl-vibrant .fix-bottom .money-box > * { min-width:0; max-width:100%; }
 html.ggl-vibrant .fix-bottom .money-box .right { flex:1 1 160px; margin-left:0!important; }
}
@media(max-width:400px) {
 html.ggl-vibrant .prdouct .p_module_div { flex-wrap:wrap!important; }
 html.ggl-vibrant.ggl-page-mobile-details .prdouct .p_module_div .name_time { flex:1 1 calc(100% - 80px)!important; }
 html.ggl-vibrant.ggl-page-mobile-details .prdouct .p_module_div .num_status {
 flex:1 1 100%!important; min-width:0!important; width:100%; margin-top:4px!important;
 }
 html.ggl-vibrant.ggl-page-mobile-details .prdouct .p_module_div .name_time .time { white-space:normal!important; }
 html.ggl-vibrant .prdouct .p_module_div .status { flex-wrap:wrap!important; max-width:100%; }
 html.ggl-vibrant .name-time { flex-wrap:wrap; gap:6px; }
}