:root {
  --green: #08c66a;
  --green-dark: #02a95a;
  --page-width: 430px;
  --soft: #f4f5f6;
  --border: #e6e6e6;
  --text: #4a4a4a;
}
* { box-sizing: border-box; }
html { background: #eceff1; }
body {
  margin: 0;
  background: #eceff1;
  color: var(--text);
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
}
a { color: inherit; text-decoration: none; }
button { font: inherit; }
.disabled { pointer-events: none; opacity: .58; }

.app-shell {
  width: 100%;
  max-width: var(--page-width);
  min-height: 100vh;
  margin: 0 auto;
  padding-bottom: 84px;
  background: #fff;
  box-shadow: 0 0 18px rgba(0,0,0,.07);
}

.topbar {
  height: 43px;
  padding: 5px 10px;
  display: grid;
  grid-template-columns: 74px 1fr 104px;
  align-items: center;
  border-bottom: 1px solid #eee;
  background: #fff;
}
.brand-block {
  height: 31px;
  border-radius: 3px;
  background: var(--green);
  color: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  line-height: 1.02;
}
.brand-block strong { font-size: 12px; }
.brand-block span { font-size: 9px; margin-top: 2px; }
.topbar h1 { margin: 0; text-align: center; font-weight: 500; font-size: 18px; color: #333; }
.top-actions { display: flex; justify-content: flex-end; gap: 15px; }
.top-actions a { display: flex; flex-direction: column; align-items: center; font-size: 10px; line-height: 1; color: #222; }
.top-actions i { font-size: 18px; margin-bottom: 2px; }

.hero-banner { background: #f2f3f5; overflow: hidden; }
.hero-banner .carousel { cursor: grab; touch-action: pan-y; user-select: none; }
.hero-banner .carousel.is-dragging { cursor: grabbing; }
.hero-banner .carousel-inner { aspect-ratio: 750 / 280; }
.hero-banner .carousel-item,
.hero-banner .carousel-item > a { width: 100%; height: 100%; }
.hero-banner img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  user-select: none;
  -webkit-user-drag: none;
  pointer-events: none;
}
.hero-banner .carousel-indicators { margin-bottom: 5px; gap: 3px; }
.hero-banner .carousel-indicators [data-bs-target] { width: 5px; height: 5px; border: 0; border-radius: 50%; }

.alert-strip {
  height: 20px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 6px;
  overflow: hidden;
  white-space: nowrap;
  background: #ff1c1c;
  color: #fff;
  font-size: 11px;
  font-weight: 700;
}
.notice-bar {
  height: 27px;
  padding: 0 8px;
  display: flex;
  align-items: center;
  gap: 5px;
  border-bottom: 1px solid #eee;
  background: #fff;
  overflow: hidden;
}
.notice-bar i { flex: 0 0 auto; color: #ff5d5d; }
.notice-window { flex: 1; min-width: 0; overflow: hidden; }
.notice-marquee {
  --marquee-distance: -300px;
  --marquee-duration: 18s;
  display: flex;
  width: max-content;
  min-width: 100%;
  white-space: nowrap;
  will-change: transform;
}
.notice-marquee-segment {
  flex: 0 0 auto;
  padding-right: 64px;
}
.notice-marquee.is-scrolling {
  animation: notice-scroll var(--marquee-duration) linear infinite;
}
.notice-window:hover .notice-marquee.is-scrolling { animation-play-state: paused; }
@keyframes notice-scroll {
  from { transform: translate3d(0, 0, 0); }
  to { transform: translate3d(var(--marquee-distance), 0, 0); }
}

.market-tabs {
  display: grid;
  gap: 6px;
  padding: 7px 8px 0;
  background: #f5f5f5;
}
.market-tab {
  min-width: 0;
  border: 0;
  height: 44px;
  padding: 2px 4px;
  border-radius: 6px 6px 0 0;
  background: #fff;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  color: #666;
}
.market-tab strong { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 600; }
.market-tab span { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-size: 10px; color: #999; }
.market-tab.active { background: var(--green); color: #fff; }
.market-tab.active span { color: rgba(255,255,255,.9); }
.market-tab.has-error:not(.active) span { color: #d94343; }

.live-toggle {
  width: 104px;
  height: 23px;
  margin: 12px auto 4px;
  clip-path: polygon(0 0,100% 0,85% 100%,15% 100%);
  background: #0dcaf0;
  color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: 11px;
}

.lottery-card {
  margin: 0 8px;
  border: 1px solid var(--green);
  border-radius: 3px;
  background: #fff;
  padding: 11px 12px 8px;
}
.lottery-head {
  display: grid;
  grid-template-columns: auto 1fr auto;
  align-items: center;
  gap: 8px;
  font-size: clamp(12px, 3.2vw, 16px);
  line-height: 1.2;
}
.lottery-head > span { white-space: nowrap; }
.lottery-head strong {
  color: red;
  font-size: clamp(11px, 2.9vw, 15px);
  font-weight: 400;
  text-align: center;
  white-space: nowrap;
}
.lottery-head a {
  color: #04ae5b;
  font-size: clamp(11px, 2.9vw, 15px);
  white-space: nowrap;
}
.ball-row {
  min-height: clamp(66px, 17vw, 82px);
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0;
  margin-top: 10px;
  overflow: visible;
}
.ball-item {
  flex: 0 0 auto;
  min-width: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.ball {
  width: clamp(36px, 11vw, 52px);
  height: clamp(36px, 11vw, 52px);
  display: flex;
  align-items: center;
  justify-content: center;
  background-position: center;
  background-repeat: no-repeat;
  background-size: contain;
  color: #62676b;
  font-size: clamp(18px, 5.1vw, 26px);
  font-weight: 700;
  line-height: 1;
}
.ball-red { background-image: url("../../img/hong.png"); }
.ball-blue { background-image: url("../../img/lan.png"); }
.ball-green { background-image: url("../../img/lv.png"); }
.ball-gray { background-image: url("../../img/hui.png"); }
.ball-item small {
  display: flex;
  align-items: center;
  margin-top: 4px;
  color: #333;
  font-size: clamp(10px, 2.8vw, 14px);
  line-height: 1;
  white-space: nowrap;
}
.ball-item small span { color: inherit; }
.wx-gold, .wx-wood, .wx-water, .wx-fire, .wx-earth, .wx-default { color: inherit; }
.plus-sign {
  flex: 0 0 auto;
  align-self: flex-start;
  margin-top: clamp(15px, 4.3vw, 0px);
  color: #888;
  font-size: clamp(18px, 4.8vw, 24px);
  line-height: 1;
}
.lottery-foot {
  margin-top: 2px;
  text-align: center;
  color: red;
  font-size: clamp(10px, 2.7vw, 13px);
  line-height: 1.25;
}
.lottery-loading {
  width: 100%;
  min-height: 60px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  font-size: 12px;
}
.lottery-error {
  margin-top: 5px;
  padding: 4px 6px;
  background: #fff1f1;
  color: #c33;
  border-radius: 3px;
  font-size: 10px;
  text-align: center;
  word-break: break-all;
}

.quick-links {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 8px 9px;
  padding: 9px 9px 11px;
  border-bottom: 5px solid #f2f2f2;
}
.quick-links a {
  height: 30px;
  min-width: 0;
  padding: 0 3px;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
  border-radius: 5px;
  background: #f4f4f4;
  color: #555;
  font-size: 13px;
}
.quick-links a.disabled { pointer-events: none; opacity: 1; color: #777; }

.feature-grid {
  display: grid;
  grid-template-columns: repeat(6, 1fr);
  row-gap: 13px;
  padding: 18px 4px 12px;
  border-bottom: 5px solid #f2f2f2;
}
.feature-grid a { display: flex; flex-direction: column; align-items: center; min-width: 0; }
.feature-grid em { margin-top: 7px; font-style: normal; color: #666; font-size: 12px; white-space: nowrap; }
.feature-icon {
  width: 43px;
  height: 43px;
  border-radius: 50%;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
  box-shadow: inset 0 -2px 0 rgba(0,0,0,.08);
}
.feature-icon i { font-size: 23px; }
.feature-icon b {
  position: absolute;
  right: -4px;
  top: -10px;
  width: 24px;
  height: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 2px solid #fff;
  border-radius: 50%;
  background: #25cf9a;
  color: #fff;
  font-size: 21px;
  line-height: 1;
  font-weight: 400;
  box-shadow: 0 2px 7px rgba(0,0,0,.22);
}
.c1{background:#48d9ad}.c2{background:#3e94df}.c3{background:#f08a18}.c4{background:#4bd35e}.c5{background:#35aed5}
.c6{background:#cf5ceb}.c7{background:#eb5b55}.c8{background:#426fe6}.c9{background:#31bfc4}.c10{background:#ff776d}

.year-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding: 10px 3px 8px;
  border-bottom: 1px solid #eee;
  overflow: hidden;
}
.year-tabs button {
  border: 0;
  background: transparent;
  padding: 0;
  color: #666;
  white-space: nowrap;
  overflow: hidden;
  font-size: 12px;
}
.year-tabs button:disabled { opacity: .55; }
.year-tabs span {
  width: 50px;
  height: 50px;
  border-radius: 50px;
  margin: 0 auto 6px;
  background: #ddd;
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
}
.year-tabs button.active { color: #2f8d65; }
.year-tabs button.active span { background: #25cb92; }
.year-tabs i { font-size: 30px; }

.series-tabs {
  display: flex;
  align-items: center;
  gap: 7px;
  padding: 8px;
  overflow: hidden;
  background: #fff;
}
.series-tabs-scroll {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 7px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  -ms-overflow-style: none;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  touch-action: pan-x;
  cursor: grab;
  user-select: none;
}
.series-tabs-scroll.is-dragging { cursor: grabbing; scroll-snap-type: none; }
.series-tabs-scroll::-webkit-scrollbar { display: none; }
.series-tabs button {
  flex: 0 0 94px;
  height: 29px;
  min-width: 0;
  padding: 0 7px;
  border: 1px solid var(--green);
  border-radius: 3px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  scroll-snap-align: start;
  background: var(--green);
  color: #fff;
}
.series-tabs button.active {
  background: var(--green-dark);
  border-color: var(--green-dark);
  box-shadow: inset 0 0 0 1px rgba(255,255,255,.18);
}
.series-tabs button:disabled { opacity: .55; }
.series-tabs .more {
  flex: 0 0 42px;
  position: relative;
  z-index: 1;
  padding: 0 3px;
  background: #fff;
  color: var(--green);
  border-color: var(--green);
  box-shadow: -7px 0 10px rgba(255,255,255,.95);
}

.gallery-section {
  min-height: 240px;
  padding: 0 4px 18px;
  background: #fafafa;
}
.gallery-grid {
  margin: 0;
  padding: 0 4px;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: start;
  gap: 0 8px;
}
.gallery-column {
  min-width: 0;
  display: flex;
  flex-direction: column;
  gap: 8px;
}
.gallery-item {
  width: 100%;
  padding: 0;
}
.gallery-card {
  overflow: hidden;
  border: 1px solid #ddd;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 1px 3px rgba(0,0,0,.13);
}
.gallery-image-box {
  cursor: pointer;
  position: relative;
  min-height: 118px;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  background: #f2f3f5;
}
.gallery-image-box:focus-visible {
  outline: 2px solid var(--green);
  outline-offset: -2px;
}
.gallery-image-box::before {
  content: "\F42A";
  position: absolute;
  font-family: "bootstrap-icons";
  font-size: 30px;
  color: #d3d7db;
}
.gallery-image-box.is-error {
  min-height: 170px;
  background-color: #f2f3f5;
  background-image: url("../../img/pic404.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
}
.gallery-image-box.is-error::before {
  display: none;
}
.gallery-card img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: auto;
  min-height: 118px;
  object-fit: cover;
  background: #f2f3f5;
}
.gallery-image-box.is-error img {
  display: none;
}
.gallery-card h3 {
  margin: 0;
  min-height: 35px;
  padding: 7px 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 13px;
  font-weight: 400;
  color: #444;
  text-align: center;
}
.gallery-state {
  min-height: 74px;
  padding: 24px 10px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #999;
  text-align: center;
  font-size: 13px;
}
.gallery-state[hidden] { display: none !important; }
.gallery-load-more {
  width: calc(100% - 16px);
  min-height: 38px;
  margin: 4px 8px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 5px;
  background: #f4f6f7;
  color: #7a838b;
  font-size: 12px;
}
.gallery-load-more::before {
  content: "";
  width: 14px;
  height: 14px;
  margin-right: 7px;
  border: 2px solid #cbd1d5;
  border-top-color: var(--green);
  border-radius: 50%;
  opacity: 0;
}
.gallery-load-more.is-loading::before {
  opacity: 1;
  animation: gallery-loading-spin .72s linear infinite;
}
@keyframes gallery-loading-spin { to { transform: rotate(360deg); } }

.app-download-banner {
  position: fixed;
  z-index: 10;
  left: 50%;
  bottom: calc(54px + env(safe-area-inset-bottom));
  transform: translateX(-50%);
  width: calc(100% - 16px);
  max-width: calc(var(--page-width) - 16px);
  min-height: 50px;
  padding: 0 38px 0 0;
  border-radius: 8px;
  overflow: hidden;
  background: linear-gradient(135deg, #10c979, #04a95c);
  color: #fff;
  box-shadow: 0 4px 14px rgba(0, 100, 55, .28);
}
.app-download-link {
  width: 100%;
  min-height: 50px;
  padding: 7px 8px 7px 10px;
  display: flex;
  align-items: center;
  gap: 8px;
  color: #fff;
}
.app-download-link > i { flex: 0 0 auto; font-size: 24px; }
.app-download-link span {
  flex: 1;
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  font-size: 13px;
}
.app-download-link strong {
  flex: 0 0 auto;
  padding: 5px 7px;
  border-radius: 4px;
  background: rgba(255,255,255,.2);
  font-size: 11px;
  white-space: nowrap;
}
.app-download-close {
  position: absolute;
  top: 50%;
  right: 7px;
  width: 25px;
  height: 25px;
  padding: 0;
  transform: translateY(-50%);
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.22);
  color: #fff;
}
.app-download-close i { font-size: 13px; }
body.has-app-download .app-shell { padding-bottom: 140px; }


/* 顶部“分享 / 客服”弹层 */
.action-modal .modal-dialog {
  width: calc(100% - 36px);
  max-width: 340px;
  margin-left: auto;
  margin-right: auto;
}
.action-modal .modal-content {
  overflow: hidden;
  border: 0;
  border-radius: 17px;
  background: #fff;
  box-shadow: 0 18px 40px rgba(0,0,0,.34);
}
.action-modal-header {
  position: relative;
  min-height: 56px;
  padding: 14px 54px 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: linear-gradient(135deg, #0ebc83, #29d69b);
  color: #fff;
}
.action-modal-header h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
}
.action-modal-close {
  position: absolute;
  top: 13px;
  right: 13px;
  width: 29px;
  height: 29px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(0, 125, 90, .26);
  color: #fff;
}
.action-modal-close i { font-size: 14px; }
.action-modal-body {
  padding: 23px 24px 24px;
  display: flex;
  flex-direction: column;
  align-items: center;
  text-align: center;
}
.action-modal-icon {
  position: relative;
  width: 58px;
  height: 58px;
  margin-bottom: 13px;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 1px solid #dff7ec;
  border-radius: 50%;
  background: #f4fff9;
  color: #0bc46b;
}
.action-modal-icon i { font-size: 25px; }
.action-modal-icon.service-icon span {
  position: absolute;
  top: 4px;
  right: 7px;
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: #f39a9a;
  box-shadow: 0 0 0 2px #fff;
}
.share-intro {
  margin: 0 0 18px;
  color: #48505c;
  font-size: 14px;
  line-height: 1.55;
}
.share-url-input {
  width: 100%;
  height: 32px;
  margin-bottom: 20px;
  padding: 0 12px;
  border: 1px solid #dfe2e8;
  border-radius: 8px;
  outline: none;
  background: #faf9fc;
  color: #747d8a;
  font-size: 12px;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.03);
}
.share-url-input:focus {
  border-color: #19c78b;
  box-shadow: 0 0 0 2px rgba(25,199,139,.12);
}
.action-primary-button {
  width: 100%;
  min-height: 47px;
  padding: 0 18px;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  border: 0;
  border-radius: 26px;
  background: linear-gradient(135deg, #0ab77e, #08c794);
  color: #fff;
  font-size: 16px;
  font-weight: 700;
  box-shadow: 0 8px 16px rgba(6, 182, 126, .25);
}
.action-primary-button:hover,
.action-primary-button:focus { color: #fff; }
.action-primary-button i { font-size: 17px; }
.service-modal .action-modal-body { padding-top: 24px; }
.service-modal .action-modal-icon { margin-bottom: 16px; }
.service-modal .action-modal-body h3 {
  margin: 0 0 11px;
  color: #182330;
  font-size: 18px;
  font-weight: 800;
}
.service-intro {
  margin: 0 0 24px;
  color: #7b818b;
  font-size: 13px;
  line-height: 1.65;
}
.service-intro span { color: #08bc68; font-weight: 700; }
.service-later-button {
  margin-top: 18px;
  padding: 0;
  border: 0;
  border-bottom: 1px solid #9fa4aa;
  background: transparent;
  color: #9a9fa7;
  font-size: 12px;
  line-height: 1.4;
}

.series-modal .modal-dialog {
  width: calc(100% - 56px);
  max-width: 360px;
  margin-left: auto;
  margin-right: auto;
}
.series-modal .modal-content {
  border: 0;
  border-radius: 18px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 18px 34px rgba(0,0,0,.32);
}
.series-modal-header {
  position: relative;
  min-height: 62px;
  padding: 17px 50px 8px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.series-modal-header h2 {
  margin: 0;
  color: #1f2b36;
  font-size: 21px;
  font-weight: 700;
  line-height: 1.25;
  text-align: center;
}
.series-modal-close {
  position: absolute;
  top: 15px;
  right: 14px;
  width: 29px;
  height: 29px;
  padding: 0;
  border: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #ec2d2d;
  color: #fff;
}
.series-modal-close i { font-size: 14px; }
.series-modal-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 8px 9px;
  padding: 4px 16px 24px;
}
.series-modal-grid button {
  min-width: 0;
  min-height: 37px;
  padding: 5px 3px;
  border: 1px solid transparent;
  border-radius: 4px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  background: #fdfbfe;
  color: #263746;
  font-size: 13px;
}
.series-modal-grid button.active {
  border-color: var(--green);
  background: #fff;
  color: #21333f;
}
.modal-backdrop.show {
  opacity: .62;
  backdrop-filter: blur(3px);
  -webkit-backdrop-filter: blur(3px);
}


/* 漂浮“＋/−”扇形快捷导航 */
.radial-floating-toggle {
  position: fixed;
  z-index: 1095;
  top: 50%;
  right: max(12px, calc((10vw - var(--page-width)) / 2 + 12px));
  width: 60px;
  height: 60px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 4px solid rgba(255,255,255,.96);
  border-radius: 50%;
  background: linear-gradient(145deg, #19d7a4, #1598df);
  color: #fff;
  box-shadow: 0 7px 22px rgba(0, 126, 137, .38), 0 0 0 1px rgba(10, 181, 148, .14);
  transform: translateY(-50%);
  transition: transform .2s ease, box-shadow .2s ease, background .2s ease;
  touch-action: manipulation;
}
.radial-floating-toggle:hover { transform: translateY(-50%) scale(1.04); }
.radial-floating-toggle:active { transform: translateY(-50%) scale(.96); }
.radial-floating-toggle.is-open {
  background: linear-gradient(145deg, #ff9c31, #f26832);
  box-shadow: 0 7px 22px rgba(219, 91, 22, .4), 0 0 0 1px rgba(242, 104, 50, .16);
}
.radial-floating-toggle b {
  display: block;
  font-size: 39px;
  line-height: 1;
  font-weight: 300;
  transform: translateY(-2px);
  user-select: none;
  pointer-events: none;
}
.radial-floating-toggle.is-open b { transform: translateY(-3px); }
.radial-menu-backdrop {
  position: fixed;
  z-index: 1090;
  inset: 0;
  background: rgba(6, 18, 17, .64);
  opacity: 0;
  transition: opacity .2s ease;
  backdrop-filter: blur(1.5px);
  -webkit-backdrop-filter: blur(1.5px);
}
.radial-menu-backdrop.is-open { opacity: 1; }
body.radial-menu-open,
body.expert-iframe-open,
body.attribute-image-open { overflow: hidden; }
.radial-menu {
  --radial-x: 50vw;
  --radial-y: 50vh;
  position: absolute;
  left: var(--radial-x);
  top: var(--radial-y);
  width: 0;
  height: 0;
}
.radial-action {
  position: absolute;
  left: 0;
  top: 0;
  width: 48px;
  height: 48px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid rgba(255,255,255,.96);
  border-radius: 50%;
  color: #fff;
  box-shadow: 0 5px 14px rgba(0,0,0,.25);
  opacity: 0;
  transform: translate(-50%, -50%) scale(.35);
  transition: transform .24s cubic-bezier(.2,.8,.2,1), opacity .18s ease;
}
.radial-action i { font-size: 21px; }
.radial-action-1 { background: #2ed9ae; }
.radial-action-2 { background: #4a72e9; }
.radial-action-3 { background: #22cc8a; }
.radial-action-4 { background: #f08e24; }
.radial-action-5 { background: #3995df; }
.radial-menu-backdrop.is-open .radial-action { opacity: 1; }
.radial-menu-backdrop.is-open .radial-action-1 { transform: translate(-50%, -50%) translate(-8px, -82px) scale(1); }
.radial-menu-backdrop.is-open .radial-action-2 { transform: translate(-50%, -50%) translate(-67px, -58px) scale(1); }
.radial-menu-backdrop.is-open .radial-action-3 { transform: translate(-50%, -50%) translate(-92px, 0) scale(1); }
.radial-menu-backdrop.is-open .radial-action-4 { transform: translate(-50%, -50%) translate(-67px, 58px) scale(1); }
.radial-menu-backdrop.is-open .radial-action-5 { transform: translate(-50%, -50%) translate(-8px, 82px) scale(1); }

/* 生肖属性全屏图片层 */
.attribute-image-layer {
  position: fixed;
  z-index: 1140;
  inset: 0;
  padding: max(14px, env(safe-area-inset-top)) 12px max(14px, env(safe-area-inset-bottom));
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(0, 0, 0, .91);
  opacity: 0;
  transition: opacity .2s ease;
  cursor: zoom-out;
  touch-action: manipulation;
}
.attribute-image-layer.is-open { opacity: 1; }
.attribute-image-stage {
  width: 100%;
  height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 10px;
}
.attribute-image-stage img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(100dvh - 68px);
  object-fit: contain;
  border-radius: 4px;
  box-shadow: 0 10px 34px rgba(0, 0, 0, .38);
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.attribute-image-tip {
  margin: 0;
  color: rgba(255,255,255,.82);
  font-size: 12px;
  letter-spacing: .5px;
  pointer-events: none;
}

/* 高手之家 iframe 全屏层 */
.expert-iframe-layer {
  position: fixed;
  z-index: 1110;
  inset: 0;
  display: flex;
  justify-content: center;
  background: rgba(5, 13, 15, .64);
  opacity: 0;
  transition: opacity .2s ease;
}
.expert-iframe-layer.is-open { opacity: 1; }
.expert-iframe-panel {
  width: 100%;
  max-width: var(--page-width);
  height: 100dvh;
  min-height: 100vh;
  display: flex;
  flex-direction: column;
  background: #eef5f7;
  transform: translateY(18px);
  transition: transform .22s ease;
  box-shadow: 0 0 30px rgba(0,0,0,.28);
}
.expert-iframe-layer.is-open .expert-iframe-panel { transform: translateY(0); }
.expert-iframe-header {
  flex: 0 0 47px;
  height: 47px;
  padding: 0 8px;
  display: grid;
  grid-template-columns: 38px 1fr 38px;
  align-items: center;
  background: linear-gradient(110deg, #08bc82 0%, #13bdb4 46%, #328dea 100%);
  color: #fff;
  box-shadow: 0 3px 10px rgba(0, 120, 132, .2);
}
.expert-iframe-header h2 {
  margin: 0;
  text-align: center;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1px;
}
.expert-iframe-control {
  width: 31px;
  height: 31px;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 0;
  border-radius: 50%;
  background: rgba(255,255,255,.18);
  color: #fff;
}
.expert-iframe-control i { font-size: 17px; }
.expert-iframe-close { justify-self: end; }
.expert-iframe-body {
  position: relative;
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  background: #fff;
  scrollbar-width: thin;
  scrollbar-color: #67bdb7 transparent;
}
.expert-iframe-body iframe {
  width: calc(100% + 7px);
  max-width: none;
  height: 100%;
  display: block;
  border: 0;
  background: #fff;
  scrollbar-width: thin;
  scrollbar-color: #67bdb7 transparent;
}
.expert-iframe-body.is-same-origin iframe { width: 100%; }
.expert-iframe-body::-webkit-scrollbar { width: 5px; height: 5px; }
.expert-iframe-body::-webkit-scrollbar-track { background: transparent; }
.expert-iframe-body::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: linear-gradient(#21c39b, #3d91e8);
}
.expert-iframe-loading {
  position: absolute;
  z-index: 2;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  background: rgba(255,255,255,.94);
  color: #56808a;
  font-size: 13px;
}
.expert-iframe-loading[hidden] { display: none !important; }

.bottom-nav {
  position: fixed;
  z-index: 30;
  left: 50%;
  bottom: 0;
  transform: translateX(-50%);
  width: 100%;
  max-width: var(--page-width);
  height: 48px;
  display: grid;
  grid-template-columns: repeat(5, 1fr);
  padding-bottom: env(safe-area-inset-bottom);
  background: rgba(255,255,255,.97);
  border-top: 1px solid #ddd;
  box-shadow: 0 -2px 7px rgba(0,0,0,.09);
}
.bottom-nav a {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 2px;
  color: #02a95a;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.08;
}
.bottom-nav a span {
  font-size: 12px;
  font-weight: 700;
  white-space: nowrap;
}
.bottom-nav i { font-size: 19px; line-height: 1; }
.bottom-nav .active { color: var(--green-dark); }
.bottom-nav a:nth-child(3) i {
  width: 44px;
  height: 44px;
  margin-top: -26px;
  border-radius: 50%;
  background: var(--green);
  color: #fff;
  display: flex;
  align-items: center;
  justify-content: center;
  border: 3px solid #fff;
  box-shadow: 0 0 0 1px #e9e9e9;
}

@media (min-width: 700px) {
  body { padding: 0; }
}
@media (max-width: 380px) {
  .market-tabs { gap: 4px; padding-left: 5px; padding-right: 5px; }
  .market-tab strong { font-size: 12px; }
  .market-tab span { font-size: 9px; }
  .lottery-card { margin-left: 6px; margin-right: 6px; padding-left: 7px; padding-right: 7px; }
  .lottery-head { gap: 4px; }
}
@media (max-width: 355px) {
  .topbar { grid-template-columns: 66px 1fr 98px; }
  .top-actions { gap: 6px; }
  .quick-links { gap: 7px 6px; }
  .quick-links a { font-size: 12px; }
  .lottery-head { font-size: 11px; }
  .lottery-head strong { font-size: 9px; }
}


/* 子页面不再加载 Bootstrap 主样式，保留原加载动画外观 */
.subpage .spinner-border{display:inline-block;width:2rem;height:2rem;vertical-align:-.125em;border:.25em solid currentColor;border-right-color:transparent;border-radius:50%;animation:subpage-spinner .75s linear infinite}
.subpage .spinner-border-sm{width:1rem;height:1rem;border-width:.2em}
@keyframes subpage-spinner{to{transform:rotate(360deg)}}

/* ===== 搜索 / 图纸详情 / 历史开奖共用子页面 ===== */
.subpage-body{margin:0;background:#eef1f2;color:#34434a;font-family:-apple-system,BlinkMacSystemFont,"Segoe UI","PingFang SC","Microsoft YaHei",sans-serif}.subpage{width:100%;max-width:430px;min-height:100vh;margin:0 auto;background:#fff;box-shadow:0 0 18px rgba(0,0,0,.06)}.subpage button,.subpage input,.subpage select,.subpage textarea{font:inherit}.subpage-header{height:48px;display:grid;grid-template-columns:48px 1fr 48px;align-items:center;background:#fff;border-bottom:1px solid #edf0f1;z-index:50}.subpage-header.fixed-header{position:fixed;top:0;left:50%;width:100%;max-width:430px;transform:translateX(-50%)}.subpage-header.sticky-header{position:sticky;top:0}.subpage-header button{height:48px;border:0;background:transparent;color:#27343a;font-size:21px}.subpage-header button.green{color:#08b96b}.subpage-header h1{margin:0;text-align:center;font-size:17px;font-weight:600;letter-spacing:2px}.subpage-year{justify-self:center;background:#08bf70;color:#fff;font-size:11px;font-weight:700;padding:0px 4px;border-radius:999px}.subpage-loading{padding:36px 12px;text-align:center;color:#8a969c;font-size:13px}.subpage-loading[hidden]{display:none}.subpage-empty{min-height:160px;display:flex;flex-direction:column;gap:9px;align-items:center;justify-content:center;color:#99a2a7;font-size:13px}.subpage-empty i{font-size:28px}.subpage-empty.is-error{color:#d65a5a}.subpage-empty.compact{min-height:100px}.page-toast{position:fixed;left:50%;top:50%;z-index:25000;max-width:80vw;transform:translate(-50%,-50%) scale(.95);padding:11px 18px;border-radius:10px;background:rgba(25,29,31,.9);color:#fff;font-size:13px;font-weight:600;opacity:0;pointer-events:none;transition:.18s}.page-toast.is-show{opacity:1;transform:translate(-50%,-50%) scale(1)}body.subpage-modal-open{overflow:hidden}
.search-toolbar{position:fixed;top:48px;left:50%;z-index:49;width:100%;max-width:430px;height:56px;transform:translateX(-50%);display:flex;align-items:center;gap:10px;padding:9px 12px;background:#fff;border-bottom:1px solid #edf0f1}.search-control{height:37px;flex:1;display:flex;align-items:center;overflow:hidden;border:1px solid #e0e5e7;border-radius:999px;background:#f7f8f9}.search-control label{position:relative;height:100%;display:flex;align-items:center;gap:3px;padding:0 10px 0 13px;border-right:1px solid #e0e5e7;color:#08ad66;white-space:nowrap}.search-control label strong{max-width:85px;overflow:hidden;text-overflow:ellipsis;font-size:12px}.search-control label i{font-size:9px}.search-control select{position:absolute;inset:0;width:100%;opacity:0;cursor:pointer}.search-control input{min-width:0;flex:1;height:100%;padding:0 12px;border:0;outline:0;background:transparent;font-size:13px}.search-toolbar>button{border:0;background:transparent;color:#08ad66;font-size:14px;font-weight:600}.search-spacer{height:104px}.search-content{padding:0 28px 30px 16px}.search-letter-block h2{position:sticky;top:104px;z-index:6;margin:0;padding:8px 0 6px;background:rgba(255,255,255,.96);color:#08b96b;font-size:18px}.search-result-list a{height:48px;display:flex;align-items:center;justify-content:space-between;padding-right:10px;border-bottom:1px solid #f0f2f3;color:#4a555a;text-decoration:none;font-size:14px}.search-result-list a strong{color:#08b96b;font-size:13px}.search-alphabet{position:fixed;right:max(3px,calc((100vw - 430px)/2 + 3px));top:55%;z-index:40;transform:translateY(-50%);display:flex;flex-direction:column}.search-alphabet button{width:24px;height:16px;padding:0;border:0;background:transparent;color:#647078;font-size:10px;font-weight:700;line-height:16px}.search-alphabet button.active{color:#08b96b;font-size:14px}
.history-lottery-tabs{display:flex;justify-content:space-around;border-bottom:1px solid #edf0f1;background:#fff;overflow-x:auto}.history-lottery-tabs button{flex:0 0 auto;min-width:105px;padding:12px 8px 10px;border:0;border-bottom:3px solid transparent;background:#fff;color:#5e696f;font-size:15px}.history-lottery-tabs button.active{border-bottom-color:#08bd70;color:#08ad66;font-weight:700}.history-controls{margin:14px 14px 10px;padding:10px;display:flex;justify-content:space-between;align-items:center;gap:6px;border-radius:9px;background:#f4f6f7}.history-controls>strong{font-size:13px;white-space:nowrap}.history-controls>div{display:flex;gap:5px;align-items:center}.history-controls button,.history-controls select{height:29px;border:0;border-radius:999px;background:#fff;color:#59646a;padding:0 10px;font-size:11px;box-shadow:0 1px 4px rgba(0,0,0,.05)}.history-list{padding:0 13px 26px}.history-result{margin-bottom:18px}.history-result-head{display:flex;justify-content:space-between;align-items:center;padding:0 3px 6px;color:#7b858a;font-size:12px}.history-result-head strong{color:#26343a;font-size:14px}.history-result-card{display:flex;align-items:flex-start;justify-content:space-between;padding:11px 8px;border:1.5px solid #08bd70;border-radius:11px;background:#fff;box-shadow:0 2px 7px rgba(0,0,0,.04)}.history-normal-balls{flex:1;display:flex;justify-content:space-between;gap:2px}.history-ball-item,.detail-ball-item{display:flex;flex-direction:column;align-items:center;min-width:0}.history-ball,.detail-ball{display:flex;align-items:center;justify-content:center;background-repeat:no-repeat;background-position:center;background-size:contain;color:#30383d;font-weight:900}.history-ball{width:43px;height:43px;font-size:20px}.history-ball.ball-red,.detail-ball.ball-red{background-image:url("../../img/hong.png")}.history-ball.ball-blue,.detail-ball.ball-blue{background-image:url("../../img/lan.png")}.history-ball.ball-green,.detail-ball.ball-green{background-image:url("../../img/lv.png")}.history-ball.ball-gray,.detail-ball.ball-gray{background-image:url("../../img/hui.png")}.history-ball-item small,.detail-ball-item small{display:flex;align-items:center;margin-top:4px;color:#59646a;font-size:10px;font-weight:700;white-space:nowrap}.ball-meta-separator{margin:0 1px;color:#c2c7ca}.history-plus,.detail-plus{align-self:center;margin:7px 3px 0;color:#aeb6ba;font-size:21px}.wx-gold{color:#d68b00}.wx-wood{color:#199958}.wx-water{color:#2876d8}.wx-fire{color:#dc4949}.wx-earth{color:#a86d34}.wx-default{color:#67747a}.subpage-layer{position:fixed;inset:0;z-index:20000;display:flex;opacity:0;transition:opacity .18s}.subpage-layer[hidden]{display:none}.subpage-layer.is-open{opacity:1}.layer-backdrop{position:absolute;inset:0;border:0;background:rgba(0,0,0,.58)}.centered-layer{align-items:center;justify-content:center;padding:20px}.year-picker{position:relative;width:min(320px,86vw);overflow:hidden;border-radius:15px;background:#fff;transform:scale(.95);transition:.18s}.is-open>.year-picker{transform:scale(1)}.year-picker header,.bottom-layer section>header{display:flex;align-items:center;justify-content:center;position:relative;padding:12px;background:linear-gradient(90deg,#08b96b,#39d394);color:#fff}.year-picker h2,.bottom-layer h2{margin:0;font-size:16px}.year-picker header button,.bottom-layer header button{position:absolute;right:10px;border:0;background:rgba(255,255,255,.18);color:#fff;border-radius:50%;width:28px;height:28px}.year-picker>div{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;padding:18px}.year-picker>div button{height:38px;border:1px solid #edf0f1;border-radius:8px;background:#f7f8f9;color:#59646a}.year-picker>div button.active{border-color:#38ca8c;background:#e8fbf3;color:#08ad66;font-weight:700}
.pic-page{padding-bottom:58px}.pic-header{position:sticky;top:0;z-index:40;height:55px;display:grid;grid-template-columns:1fr 150px 1fr;align-items:center;border-bottom:1px solid #edf0f1;background:#fff;box-shadow:0 1px 5px rgba(0,0,0,.04)}.pic-header>div{display:flex;align-items:center}.pic-header>div:last-child{justify-content:flex-end}.pic-header button{min-width:42px;height:52px;padding:0 7px;border:0;background:transparent;color:#4f5c62;display:flex;flex-direction:column;align-items:center;justify-content:center}.pic-header button>i{font-size:18px}.pic-header button small{font-size:9px;font-weight:700;white-space:nowrap}.pic-header button.green{color:#08b96b}.pic-header h1{margin:0;overflow:hidden;text-align:center;text-overflow:ellipsis;white-space:nowrap;font-size:15px;font-weight:700}.pic-issue-nav{height:50px;display:flex;align-items:center;border-bottom:1px solid #e7ebed;background:#f6f7f8}.pic-issue-nav>div{min-width:0;flex:1;display:flex;gap:7px;overflow-x:auto;padding:8px;scrollbar-width:none}.pic-issue-nav>div::-webkit-scrollbar{display:none}.pic-issue-nav button{flex:0 0 auto;height:30px;padding:0 11px;border:1px solid #dfe4e6;border-radius:5px;background:#fff;color:#647078;font-size:12px;font-weight:700}.pic-issue-nav>div button.active,.pic-issues-grid button.active{border-color:#08bd70;background:#08bd70;color:#fff}.pic-issue-nav>button{margin-right:8px;border-radius:999px;border-color:#08bd70;background:#08bd70;color:#fff}.pic-draw-result{margin:5px 0;padding:11px 6px 9px;border-radius:22px;background:linear-gradient(145deg,#fff,#f2f9ff);box-shadow:0 5px 14px rgba(0,0,0,.07)}.pic-draw-result h2{margin:0 0 9px;text-align:center;font-size:13px}.pic-draw-result h2 strong{color:#ed4e4e;font-size:15px}.pic-draw-result>div{display:flex;align-items:flex-start;justify-content:center;gap:2px}.detail-ball{width:43px;height:43px;font-size:19px}.pic-image-box{position:relative;min-height:310px;display:flex;align-items:center;justify-content:center;background:#f1f3f4;cursor:zoom-in}.pic-image-box img{display:block;width:100%;height:auto;min-height:250px;object-fit:contain}.pic-image-error{display:none;flex-direction:column;align-items:center;gap:8px;color:#909ba1}.pic-image-error i{font-size:38px}.pic-image-box.is-error{background:#f2f3f4 url("../../img/404.jpg") center/cover no-repeat}.pic-image-box.is-error .pic-image-error{display:flex;background:rgba(255,255,255,.72);padding:10px 14px;border-radius:9px}.pic-zoom-hint{position:absolute;right:14px;bottom:14px;width:40px;height:40px;border:1px solid rgba(255,255,255,.7);border-radius:50%;background:rgba(255,255,255,.84);color:#08b96b;box-shadow:0 3px 12px rgba(0,0,0,.15)}.pic-vote-section{border-bottom:1px solid #edf0f1}.pic-vote-section>button{width:150px;height:36px;margin:0 auto;display:flex;align-items:center;justify-content:center;gap:5px;border:0;background:#08bd70;color:#fff;font-size:13px;font-weight:700;clip-path:polygon(14px 0,calc(100% - 14px) 0,100% 100%,0 100%)}#picVotePanel{display:grid;grid-template-columns:1fr 1fr;gap:10px 18px;padding:13px;background:#fafbfb}#picVotePanel[hidden]{display:none}.pic-vote-row{display:grid;grid-template-columns:22px 1fr 34px;align-items:center;gap:6px;border:0;background:transparent;color:#59646a;font-size:12px}.pic-vote-row i{height:6px;overflow:hidden;border-radius:99px;background:#e6eaec}.pic-vote-row i b{display:block;height:100%;border-radius:99px;background:#08bd70}.pic-vote-row em{font-style:normal;text-align:right;font-size:10px}.pic-stat-nav{height:46px;display:grid;grid-template-columns:repeat(4,1fr);border-bottom:6px solid #f1f3f4;background:#fff}.pic-stat-nav button,.pic-stat-nav>span{border:0;background:transparent;display:flex;align-items:center;justify-content:center;gap:3px;color:#667178;font-size:11px}.pic-stat-nav button.active{color:#08b96b;font-weight:700}.pic-stat-nav i{font-size:15px}.pic-recommend-section{padding:13px 0;border-bottom:6px solid #f1f3f4}.pic-recommend-section h2,.pic-comments>header h2{margin:0 13px 10px;padding-left:8px;border-left:4px solid #08bd70;font-size:14px}.pic-recommend-section>div{display:flex;gap:10px;overflow-x:auto;padding:0 13px;scrollbar-width:none}.pic-recommend-section a{flex:0 0 86px;text-align:center;color:#4f5a60;text-decoration:none}.pic-recommend-section a span{height:82px;display:flex;align-items:center;justify-content:center;overflow:hidden;border-radius:6px;background:#f1f3f4}.pic-recommend-section a span.is-error{background:#f2f3f4 url("../../img/404.jpg") center/cover no-repeat}.pic-recommend-section img{width:100%;height:100%;object-fit:cover}.pic-recommend-section strong{display:block;margin-top:5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:11px}.pic-comments>header{height:49px;display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #eef1f2}.pic-comments>header h2{margin-bottom:0}.pic-comments>header div{margin-right:12px;display:flex;gap:5px}.pic-comments>header button{height:27px;padding:0 10px;border:0;border-radius:999px;background:#f3f5f6;color:#7a858b;font-size:10px}.pic-comments>header button.active{background:#08bd70;color:#fff}.pic-comment{display:flex;gap:10px;padding:13px;border-bottom:1px solid #f0f2f3}.pic-comment-avatar{flex:0 0 36px;height:36px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#e9fbf3;color:#08b96b}.pic-comment>div{min-width:0;flex:1}.pic-comment header{display:flex;justify-content:space-between;gap:8px}.pic-comment header strong{font-size:12px}.pic-comment header time,.pic-comment small{color:#9aa3a8;font-size:9px}.pic-comment p{margin:6px 0 3px;font-size:13px;line-height:1.6}.pic-reply-bar{position:fixed;bottom:0;left:50%;z-index:45;width:100%;max-width:430px;height:56px;transform:translateX(-50%);display:flex;align-items:center;gap:8px;padding:8px 12px calc(8px + env(safe-area-inset-bottom));border-top:1px solid #e5e9eb;background:#fff}.pic-reply-bar button:first-child{min-width:0;flex:1;height:36px;padding:0 14px;border:1px solid #edf0f1;border-radius:999px;background:#f4f6f7;color:#7a858a;text-align:left;font-size:12px}.pic-reply-bar button:last-child{border:0;background:transparent;color:#08b96b;font-weight:700}.pic-loading{position:fixed;inset:0;z-index:15000;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px;background:rgba(255,255,255,.9);color:#08b96b}.pic-loading[hidden]{display:none}.pic-loading b{font-size:13px}.bottom-layer{align-items:flex-end;justify-content:center}.bottom-layer>section{position:relative;width:100%;max-width:430px;max-height:82vh;overflow:hidden;border-radius:16px 16px 0 0;background:#fff;transform:translateY(100%);transition:.2s}.bottom-layer.is-open>section{transform:translateY(0)}.bottom-layer section>header{justify-content:center}.bottom-layer header button.danger{position:absolute;left:12px;right:auto;width:auto;padding:0 8px;border-radius:7px;font-size:11px}.pic-issues-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:9px;max-height:65vh;overflow:auto;padding:14px}.pic-issues-grid button{height:38px;border:1px solid #dfe4e6;border-radius:7px;background:#fff;color:#5c686e;font-size:12px;font-weight:700}.pic-view-history{max-height:60vh;overflow:auto;padding:12px}.pic-view-history a{display:flex;justify-content:space-between;align-items:center;padding:12px;margin-bottom:8px;border:1px solid #eef1f2;border-radius:9px;color:#59646a;text-decoration:none;font-size:12px}.pic-view-history a b{padding:3px 8px;border-radius:999px;background:#08bd70;color:#fff;font-size:10px}.bottom-layer textarea{display:block;width:calc(100% - 24px);height:68px;margin:12px;padding:10px;border:1px solid #e0e5e7;border-radius:9px;background:#f8f9fa;resize:none;outline:none;font-size:12px}.pic-reply-words{display:flex;flex-wrap:wrap;gap:7px;max-height:38vh;overflow:auto;padding:0 12px 12px}.pic-reply-words button{padding:6px 9px;border:1px solid #dfe5e7;border-radius:6px;background:#fff;color:#556168;font-size:11px}.pic-reply-submit{display:block;width:calc(100% - 24px);height:40px;margin:0 12px 14px;border:0;border-radius:9px;background:#08bd70;color:#fff;font-weight:700}.pic-viewer{z-index:30000;align-items:center;justify-content:center;flex-direction:column;background:rgba(0,0,0,.94)}.pic-viewer img{max-width:100%;max-height:90vh;object-fit:contain}.pic-viewer span{position:absolute;bottom:20px;color:rgba(255,255,255,.7);font-size:11px}
@media(max-width:375px){.history-ball{width:38px;height:38px;font-size:18px}.detail-ball{width:38px;height:38px;font-size:17px}.history-result-card{padding-left:5px;padding-right:5px}.pic-header{grid-template-columns:1fr 120px 1fr}.pic-header button{padding:0 4px}.history-controls{align-items:flex-start;flex-direction:column}.history-controls>div{width:100%;justify-content:flex-end}}
