:root {
  color-scheme: light;
  --ink: #1b2d30;
  --muted: #5d6e72;
  --line: #d4dedf;
  --surface: #fff;
  --paper: #f1f5f5;
  --teal: #08786c;
  --red: #bd2839;
  --gold: #d9b169;
  --dark: #142c2c;
  font-family: -apple-system, BlinkMacSystemFont, "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 14px;
  line-height: 1.5;
  letter-spacing: 0;
}
* { box-sizing: border-box; }
body { margin: 0; color: var(--ink); background: var(--paper); }
button, select { font: inherit; color: inherit; }
button { cursor: pointer; }
button, select, dialog { border-radius: 6px; }
button { border: 1px solid transparent; }
button:disabled { cursor: default; opacity: .42; }
button:focus-visible, select:focus-visible, summary:focus-visible { outline: 3px solid #d2a455; outline-offset: 3px; }
button:not(:disabled):hover { filter: brightness(.96); }
svg { display: inline-block; width: 20px; height: 20px; flex: 0 0 20px; vertical-align: middle; stroke-width: 1.8; }
h1, h2, p { margin: 0; }
h1 { font-size: 24px; line-height: 1.4; }
h2 { font-size: 17px; line-height: 1.45; }
small { font-size: 12px; }
strong, b { font-weight: 650; }
img { max-width: 100%; }
.muted, .provenance-line { color: var(--muted); }
.nowrap { white-space: nowrap; }
.topbar {
  height: 72px; display: flex; align-items: center; gap: 16px; padding: 0 28px;
  background: var(--dark); color: #f9fcfc; position: sticky; top: 0; z-index: 10;
}
.brand { display: flex; align-items: center; gap: 12px; margin-right: auto; }
.brand img { border-radius: 6px; width: 40px; height: 40px; object-fit: cover; }
.brand div { display: flex; align-items: baseline; gap: 10px; }
.brand strong { font-size: 22px; }
.brand span { color: #dfbd80; font-size: 14px; }
.preview-badge { border: 1px solid #738a81; padding: 3px 9px; font-size: 12px; color: #dbe6e3; border-radius: 4px; white-space: nowrap; }
.icon-button {
  display: inline-flex; align-items: center; justify-content: center; width: 38px; height: 38px;
  flex: 0 0 38px; padding: 0; color: var(--ink); background: var(--surface); border: 1px solid var(--line);
}
.topbar .icon-button, .media-controls .icon-button { color: #fff; background: #243d3be8; border-color: #8b9d8a; }
[data-tip] { position: relative; }
[data-tip]:hover::after {
  content: attr(data-tip); position: absolute; z-index: 20; right: 0; top: calc(100% + 7px);
  color: white; background: var(--dark); padding: 5px 8px; font-size: 12px; white-space: nowrap; border-radius: 4px;
}
.market-bar { display: flex; align-items: center; gap: 18px; padding: 20px 28px 16px; margin-left: 168px; max-width: 1416px; }
.market-switch { display: grid; grid-template-columns: 1fr 1fr; gap: 4px; background: #e1e8e8; border-radius: 6px; padding: 4px; }
.market-switch button { display: flex; align-items: center; justify-content: center; gap: 8px; padding: 9px 21px; background: transparent; font-weight: 650; white-space: nowrap; }
.market-switch button[aria-pressed="true"] { background: var(--teal); color: white; }
body[data-market="pc28"] .market-switch button[aria-pressed="true"] { background: var(--red); }
.source-state { margin-left: auto; font-size: 12px; color: var(--muted); white-space: nowrap; }
main { margin-left: 168px; max-width: 1416px; padding: 0 28px 40px; min-height: calc(100vh - 155px); }
.bottom-nav { position: fixed; left: 0; top: 72px; bottom: 0; width: 168px; border-right: 1px solid var(--line); padding: 24px 12px; background: #fff; z-index: 11; display: flex; flex-direction: column; gap: 6px; }
.bottom-nav button { display: flex; align-items: center; gap: 15px; min-height: 48px; padding: 11px 17px; background: transparent; color: var(--muted); font-weight: 600; }
.bottom-nav button[aria-current="page"] { background: #e6f2ef; color: var(--teal); }
.bottom-nav button[aria-current="page"]::after { content: ""; width: 5px; height: 5px; border-radius: 50%; background: currentColor; margin-left: auto; }
.home-media { position: relative; width: 100%; aspect-ratio: 4.4 / 1; overflow: hidden; background: var(--dark); }
.home-media > img { display: block; width: 100%; height: 100%; object-fit: cover; }
.media-controls { position: absolute; right: 14px; bottom: 12px; display: flex; align-items: center; gap: 9px; color: #fff; background: #112829cc; border-radius: 4px; padding: 4px; }
.media-controls span { font-size: 12px; min-width: 35px; text-align: center; }
.media-controls .icon-button { width: 28px; height: 28px; flex-basis: 28px; border: 0; }
.draw-band { padding: 24px 30px 0; background: #fff; border-bottom: 1px solid var(--line); }
.draw-band header { display: flex; justify-content: space-between; align-items: flex-start; gap: 12px; }
.draw-band header small { color: var(--teal); font-weight: 600; }
.draw-band h1 { margin: 4px 0; font-size: 28px; font-variant-numeric: tabular-nums; }
.draw-band h1 strong { color: var(--red); }
.draw-band header p { font-size: 13px; color: var(--muted); }
.status-label { display: inline-flex; align-items: center; gap: 6px; padding: 5px 9px; background: #edf6f2; color: #117461; border-radius: 4px; font-size: 12px; white-space: nowrap; }
.status-label i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.newao-balls { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 10px; max-width: 740px; margin: 25px auto 23px; }
.number-cell { display: flex; align-items: center; flex-direction: column; gap: 7px; position: relative; min-width: 0; }
.lottery-ball { width: 70px; height: 70px; border-radius: 50%; display: inline-flex; justify-content: center; align-items: center; color: #fff; font-size: 30px; font-weight: 750; box-shadow: inset 0 -4px 5px #0003, inset 0 2px 2px #ffffff8a, 0 3px 6px #182d2b25; font-variant-numeric: tabular-nums; flex-shrink: 0; border: 1px solid #ffffff80; }
.ball-red { background: radial-gradient(circle at 35% 25%, #ffaba5, #d94140 60%, #ad1c37); }
.ball-green { background: radial-gradient(circle at 35% 25%, #8adeb6, #16825b 60%, #096142); }
.ball-blue { background: radial-gradient(circle at 35% 25%, #a3d9ff, #247db4 60%, #164e87); }
.ball-violet { background: radial-gradient(circle at 35% 25%, #d3bfff, #7963ba 60%, #4f3b8e); }
.number-cell small { font-size: 12px; color: var(--muted); white-space: nowrap; }
.special-cell .lottery-ball { outline: 2px solid var(--gold); outline-offset: 2px; }
.special-label { position: absolute; top: -7px; right: 7px; color: #422d09; background: #f7ce79; font-size: 10px; font-weight: 650; padding: 0 3px; border-radius: 3px; }
.next-draw { display: flex; align-items: center; justify-content: center; gap: 17px; padding: 14px 0; border-top: 1px solid var(--line); }
.next-draw span { color: var(--muted); font-size: 13px; }
.next-draw strong { font-size: 23px; font-variant-numeric: tabular-nums; min-width: 115px; text-align: center; }
.next-draw small { color: var(--muted); }
.pc28-balls { display: grid; grid-template-columns: 70px 25px 70px 25px 70px 25px 70px; justify-content: center; align-items: center; gap: 12px; margin: 24px 0 14px; }
.math-sign { font-size: 25px; text-align: center; }
.draw-tags { display: flex; gap: 8px; justify-content: center; margin: 0 0 20px; }
.draw-tags span { border: 1px solid var(--line); color: var(--muted); padding: 2px 10px; border-radius: 4px; font-size: 12px; }
.notice-band { display: flex; gap: 9px; align-items: center; padding: 10px 2px; font-size: 12px; color: var(--muted); }
.notice-band svg { width: 16px; height: 16px; flex-basis: 16px; color: var(--red); }
.home-shortcuts { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); border-top: 1px solid var(--line); border-bottom: 1px solid var(--line); background: white; }
.home-shortcuts button { display: flex; gap: 11px; align-items: center; min-height: 65px; padding: 13px 20px; background: transparent; border-radius: 0; }
.home-shortcuts button:not(:last-child) { border-right: 1px solid var(--line); }
.home-shortcuts button > svg:first-child { color: var(--teal); }
.home-shortcuts button:nth-child(2) > svg:first-child { color: var(--red); }
.shortcut-chevron { margin-left: auto; color: #98a6a6; width: 14px; height: 14px; flex-basis: 14px; }
.home-research { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 24px 4px; border-bottom: 1px solid var(--line); }
.home-research small, .partner-band small { display: block; color: var(--muted); margin-bottom: 4px; }
.home-research h2 { font-size: 19px; }
.home-research p { font-size: 13px; color: var(--muted); margin-top: 5px; }
.action-button { display: inline-flex; align-items: center; justify-content: center; gap: 8px; padding: 10px 15px; min-height: 40px; background: var(--teal); color: white; font-size: 13px; font-weight: 600; }
.partner-band { display: flex; justify-content: space-between; align-items: center; gap: 16px; padding: 20px 4px; }
.partner-band .action-button { background: var(--dark); }
.section-heading { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 18px 20px; background: #173636; color: white; border-bottom: 3px solid var(--gold); }
.section-heading small { color: #cbdcd8; display: block; margin-bottom: 4px; }
.section-heading > svg { color: var(--gold); }
.section-heading .outlined-tag { color: #f1d39b; border-color: #b59762; }
.outlined-tag { display: inline-flex; padding: 4px 8px; border: 1px solid #a9bfba; color: var(--teal); border-radius: 4px; font-size: 12px; white-space: nowrap; }
.provenance-line { margin: 14px 0; font-size: 12px; }
.research-fold { border-bottom: 1px solid var(--line); margin-bottom: 16px; }
summary { cursor: pointer; list-style: none; }
summary::-webkit-details-marker { display: none; }
.research-fold > summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; padding: 15px 0; font-weight: 650; font-size: 17px; }
.research-fold > summary span { display: flex; align-items: center; gap: 9px; }
.research-fold > summary svg { color: var(--teal); }
details[open] > summary > svg:last-child { transform: rotate(180deg); }
.selection-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding-bottom: 20px; }
.selection-item, .direction-item { min-width: 0; background: var(--surface); border: 1px solid var(--line); border-radius: 6px; padding: 17px; }
.selection-item > header, .direction-item > header { display: flex; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 13px; }
.selection-item > header strong { font-size: 21px; color: var(--teal); white-space: nowrap; font-variant-numeric: tabular-nums; }
.selection-numbers { display: flex; flex-wrap: wrap; gap: 6px; min-height: 35px; margin-bottom: 13px; }
.selection-numbers span { display: inline-flex; justify-content: center; align-items: center; border-bottom: 2px solid #d6b16f; background: #f5f0e7; padding: 3px 9px; min-width: 37px; height: 29px; font-size: 16px; font-weight: 650; color: #805313; }
.selection-stats { display: flex; gap: 5px; flex-direction: column; color: var(--muted); font-size: 12px; }
.period-fold { border-top: 1px solid var(--line); margin-top: 15px; }
.period-fold > summary { padding: 12px 0 0; display: flex; align-items: center; justify-content: space-between; font-size: 12px; color: var(--teal); }
.period-fold > table { margin-top: 12px; font-size: 12px; }
.period-fold > summary svg { width: 16px; height: 16px; flex-basis: 16px; }
table { width: 100%; border-collapse: collapse; font-variant-numeric: tabular-nums; }
th, td { padding: 10px 7px; border-bottom: 1px solid var(--line); text-align: center; }
th { color: var(--muted); font-weight: 600; font-size: 12px; white-space: nowrap; }
tr:last-child td { border-bottom: 0; }
.hit { color: #087668; font-weight: 600; }
.miss { color: #b72b39; font-weight: 600; }
.direction-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; padding-bottom: 20px; }
.confidence { font-size: 11px; padding: 2px 6px; border-radius: 3px; white-space: nowrap; }
.confidence.high { color: #087668; background: #e3f5ed; }
.confidence.medium { color: #88590e; background: #fff2d2; }
.confidence.low { color: #b22b37; background: #fde8eb; }
.direction-choice { display: flex; align-items: baseline; justify-content: space-between; gap: 10px; margin-bottom: 17px; }
.direction-choice strong { color: var(--dark); font-size: 25px; }
.direction-choice span { color: var(--muted); font-size: 12px; }
.direction-rate { display: flex; align-items: center; justify-content: space-between; gap: 7px; font-size: 12px; }
.direction-rate span { color: var(--muted); }
.direction-rate strong { color: var(--red); font-size: 18px; }
.last-replay { display: block; color: var(--muted); font-size: 11px; margin-top: 10px; }
.premium-section { padding-bottom: 20px; }
.premium-section .section-heading { border-bottom: 3px solid var(--gold); }
.table-wrap { background: white; padding: 10px 12px; border-top: 1px solid var(--line); }
.combo-numbers { font-size: 13px; word-spacing: 5px; }
.empty-state, .access-block { text-align: center; padding: 65px 24px; border-bottom: 1px solid var(--line); }
.empty-state > svg, .access-block > svg { width: 37px; height: 37px; color: #76918c; margin-bottom: 16px; }
.empty-state h2, .access-block h2 { font-size: 20px; margin-bottom: 8px; }
.empty-state p, .access-block p { font-size: 13px; color: var(--muted); max-width: 450px; margin: 0 auto 20px; }
.empty-state .action-button { margin-top: 16px; }
.access-block > div { display: flex; justify-content: center; gap: 10px; flex-wrap: wrap; }
.gallery-toolbar { display: flex; align-items: center; gap: 15px; flex-wrap: wrap; margin: 20px 0; }
.gallery-toolbar label { display: flex; align-items: center; gap: 8px; color: var(--muted); font-size: 12px; }
select { border: 1px solid #b7c9c6; background: #fff; min-height: 36px; padding: 5px 28px 5px 9px; font-size: 13px; max-width: 180px; }
.gallery-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.material-item { min-width: 0; border: 1px solid var(--line); border-radius: 6px; background: white; overflow: hidden; }
.image-preview { display: block; width: 100%; height: auto; aspect-ratio: 4 / 5; padding: 0; background: #e1e6e6; border-radius: 0; overflow: hidden; }
.image-preview img { display: block; width: 100%; height: 100%; object-fit: contain; }
.material-meta { padding: 12px; }
.material-meta > small { color: var(--muted); font-size: 11px; }
.material-meta h2 { font-size: 14px; font-weight: 650; margin-top: 4px; overflow-wrap: anywhere; }
.material-meta > div { display: flex; align-items: center; gap: 7px; justify-content: space-between; margin-top: 4px; }
.material-meta > div span { color: var(--muted); font-size: 12px; overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
.material-meta .icon-button { width: 30px; height: 30px; flex-basis: 30px; border: 0; }
.gallery-heading-actions { display: flex; align-items: center; gap: 10px; }
.is-saved { color: #9b6f24; background: #fff3ce; }
.is-saved svg { fill: #efcf85; }
.pagination { display: flex; justify-content: center; align-items: center; gap: 16px; padding: 22px 0 5px; font-size: 13px; color: var(--muted); }
.error-line { color: var(--red); padding: 16px 0; }
.account-band { display: flex; gap: 16px; align-items: center; padding: 24px 0; border-bottom: 1px solid var(--line); }
.account-band img { width: 64px; height: 64px; border-radius: 6px; object-fit: cover; }
.account-band > div { margin-right: auto; }
.account-band p { margin-top: 4px; font-size: 12px; color: var(--muted); }
.entitlements, .rewards { padding-top: 23px; }
.entitlements h2, .rewards h2 { padding-bottom: 15px; }
.entitlement-row, .reward-row { border-top: 1px solid var(--line); display: flex; gap: 13px; align-items: center; justify-content: space-between; padding: 17px 0; }
.entitlement-row > div, .reward-row > div { display: flex; flex-direction: column; gap: 4px; flex: 1; min-width: 0; }
.entitlement-row small, .reward-row > div span { font-size: 12px; color: var(--muted); }
.entitlement-row > span { color: var(--red); font-size: 12px; white-space: nowrap; }
.reward-row > svg { color: var(--teal); }
.reward-row > span { font-size: 12px; white-space: nowrap; }
.account-links { margin-top: 20px; border-top: 1px solid var(--line); }
.account-links button { display: flex; gap: 13px; align-items: center; width: 100%; padding: 17px 0; border-bottom: 1px solid var(--line); border-radius: 0; background: transparent; text-align: left; }
.account-links button svg:first-child { color: var(--teal); }
.account-links button svg:last-child { margin-left: auto; color: #8b9c9b; }
dialog { width: min(560px, calc(100% - 28px)); max-height: 88dvh; padding: 22px; margin: auto; border: 1px solid #b3c6c3; background: white; color: var(--ink); box-shadow: 0 20px 100px #142c2c40; }
dialog::backdrop { background: #112526a8; }
dialog > header { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding-bottom: 17px; border-bottom: 1px solid var(--line); margin-bottom: 20px; }
dialog > header small { display: block; color: var(--teal); margin-bottom: 4px; }
dialog > header h2 { font-size: 20px; }
.fee-scope { padding: 0 0 20px; border-bottom: 1px solid var(--line); }
.fee-scope > svg { color: var(--teal); margin-right: 7px; }
.fee-scope p { font-size: 13px; color: var(--muted); margin-top: 10px; }
.fee-details { margin: 18px 0; }
.fee-details > div { display: flex; justify-content: space-between; align-items: center; gap: 20px; padding: 7px 0; }
.fee-details dt { color: var(--muted); font-size: 13px; }
.fee-details dd { margin: 0; font-weight: 600; }
.fee-note { font-size: 12px; color: var(--muted); padding: 15px 0 23px; border-top: 1px solid var(--line); }
.fee-dialog .action-button { width: 100%; }
.history-dialog { width: min(660px, calc(100% - 28px)); }
.history-seven { display: inline-flex; flex-wrap: wrap; gap: 6px; justify-content: center; }
.wave-red { color: #c62636; }
.wave-blue { color: #1b6dab; }
.wave-green { color: #08785b; }
.image-dialog { width: min(850px, calc(100% - 20px)); }
.image-dialog header h2 { font-size: 16px; overflow-wrap: anywhere; }
.image-dialog > img { display: block; width: 100%; height: auto; }
#toast { position: fixed; z-index: 60; bottom: calc(90px + env(safe-area-inset-bottom)); left: 50%; transform: translateX(-50%); max-width: calc(100% - 24px); background: var(--dark); color: white; padding: 10px 16px; border-radius: 4px; font-size: 14px; text-align: center; }
[data-favourite]:hover::after, [data-favourite]:focus-visible::after { content: attr(data-tip); position: absolute; z-index: 20; right: 0; top: auto; bottom: calc(100% + 6px); color: white; background: var(--dark); padding: 5px 8px; font-size: 12px; white-space: nowrap; border-radius: 4px; }
@media (min-width: 1600px) { main, .market-bar { margin-left: max(168px, calc((100vw - 1230px) / 2)); } }
@media (max-width: 1150px) {
  .selection-grid, .direction-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .home-shortcuts button { padding: 13px 12px; gap: 7px; }
  .shortcut-chevron { display: none; }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 899px) {
  .topbar { height: 62px; padding: 0 20px; gap: 12px; }
  .brand strong { font-size: 19px; }
  .brand span { font-size: 12px; }
  .market-bar { margin: 0; padding: 16px 20px; }
  main { margin: 0; padding: 0 20px calc(88px + env(safe-area-inset-bottom)); }
  .bottom-nav { top: auto; bottom: 0; left: 0; right: 0; width: 100%; height: calc(68px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; padding: 5px 10px env(safe-area-inset-bottom); border-right: 0; border-top: 1px solid var(--line); }
  .bottom-nav button { flex-direction: column; gap: 3px; min-height: 55px; padding: 6px 0; font-size: 11px; border-radius: 4px; }
  .bottom-nav button[aria-current="page"]::after { display: none; }
  .home-media { aspect-ratio: 3.2 / 1; }
  .gallery-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); }
}
@media (max-width: 559px) {
  h1 { font-size: 22px; }
  .topbar { padding: 0 16px; gap: 9px; }
  .brand { gap: 9px; }
  .brand div { flex-direction: column; gap: 0; line-height: 1.3; }
  .brand strong { font-size: 17px; }
  .brand span { font-size: 11px; }
  .brand img { width: 34px; height: 34px; }
  .preview-badge { font-size: 10px; padding: 3px 6px; }
  .topbar .icon-button { width: 34px; height: 34px; flex-basis: 34px; }
  .market-bar { padding: 13px 14px; gap: 8px; align-items: stretch; }
  .market-switch { flex: 1; min-width: 0; }
  .market-switch button { padding: 7px 9px; font-size: 13px; gap: 6px; }
  .market-switch button svg { width: 17px; height: 17px; flex-basis: 17px; }
  .source-state { display: none; }
  main { padding-left: 14px; padding-right: 14px; }
  .home-media { aspect-ratio: 2.75 / 1; }
  .media-controls { bottom: 6px; right: 6px; gap: 4px; padding: 2px; }
  .media-controls .icon-button { width: 24px; height: 24px; flex-basis: 24px; }
  .draw-band { padding: 18px 12px 0; }
  .draw-band h1 { font-size: 23px; }
  .draw-band header small { font-size: 11px; }
  .draw-band header p { font-size: 12px; }
  .status-label { font-size: 10px; padding: 3px 6px; }
  .newao-balls { gap: 5px; margin-top: 22px; margin-bottom: 20px; }
  .lottery-ball { width: 43px; height: 43px; font-size: 22px; }
  .number-cell small { font-size: 9px; }
  .special-label { right: -1px; top: -8px; font-size: 9px; }
  .next-draw { gap: 10px; padding: 12px 0; }
  .next-draw span { font-size: 11px; }
  .next-draw strong { font-size: 19px; min-width: 99px; }
  .next-draw small { font-size: 10px; }
  .pc28-balls { grid-template-columns: 45px 14px 45px 14px 45px 14px 45px; gap: 6px; }
  .pc28-balls .lottery-ball { width: 45px; height: 45px; }
  .math-sign { font-size: 18px; }
  .home-shortcuts button { min-height: 80px; flex-direction: column; justify-content: center; padding: 13px 2px; font-size: 12px; gap: 7px; }
  .home-research { align-items: flex-start; flex-direction: column; gap: 14px; padding: 21px 2px; }
  .home-research h2 { font-size: 18px; }
  .partner-band { padding-left: 2px; padding-right: 2px; }
  .section-heading { padding: 14px 13px; gap: 10px; }
  .section-heading small { font-size: 11px; }
  .section-heading .action-button { font-size: 11px; padding: 8px 9px; gap: 5px; }
  .section-heading .action-button svg { width: 15px; height: 15px; flex-basis: 15px; }
  .outlined-tag { font-size: 10px; padding: 3px 5px; }
  .provenance-line { font-size: 11px; }
  .research-fold > summary { font-size: 16px; }
  .selection-grid, .direction-grid { grid-template-columns: minmax(0, 1fr); gap: 12px; }
  .selection-item, .direction-item { padding: 16px; }
  .selection-stats { flex-direction: row; justify-content: space-between; gap: 7px; flex-wrap: wrap; font-size: 11px; }
  .direction-choice { margin-bottom: 11px; }
  .table-wrap { padding: 6px 3px; }
  .table-wrap td { font-size: 11px; padding: 12px 4px; }
  .table-wrap th { font-size: 10px; padding: 10px 4px; }
  .combo-numbers { max-width: 100px; word-spacing: 1px; }
  .gallery-toolbar { gap: 10px; margin: 16px 0; }
  .gallery-toolbar label { flex-direction: column; align-items: stretch; gap: 4px; flex: 1 1 80px; min-width: 0; }
  .gallery-toolbar select { padding: 6px 22px 6px 7px; width: 100%; font-size: 12px; }
  .gallery-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
  .material-meta { padding: 9px; }
  .material-meta h2 { font-size: 13px; }
  .material-meta > small { font-size: 10px; }
  .material-meta > div span { font-size: 11px; }
  .empty-state, .access-block { padding: 55px 10px; }
  .account-band { flex-wrap: wrap; }
  .account-band > .action-button { width: 100%; }
  .reward-row { gap: 10px; }
  .reward-row strong, .entitlement-row strong { font-size: 13px; }
  .reward-row > span { font-size: 10px; }
  .account-links button { font-size: 13px; }
  dialog { padding: 17px; }
  dialog > header h2 { font-size: 18px; }
  .history-dialog td { font-size: 11px; padding: 12px 3px; }
  .history-dialog th { font-size: 11px; }
  .history-seven { max-width: 115px; gap: 2px 5px; }
}
@media (max-width: 369px) {
  .lottery-ball { width: 35px; height: 35px; font-size: 19px; }
  .number-cell small { font-size: 8px; }
  .draw-band h1 { font-size: 20px; }
  .next-draw { flex-wrap: wrap; }
  .status-label { gap: 4px; }
  .selection-item { padding: 13px; }
}
@media (prefers-reduced-motion: reduce) { * { scroll-behavior: auto !important; } }

/* The shared shell follows the original research academy navigation. */
:root { --ink: #172333; --muted: #64748b; --paper: #f5f2ed; --line: #c7d4e8; --teal: #1e40af; --dark: #0c2939; }
[hidden] { display: none !important; }
.topbar { position: relative; height: 96px; padding: 16px 26px; background: linear-gradient(112deg, #08202f, #204b54); border-bottom: 3px solid #d7a548; }
.brand img, .account-band img { border-radius: 50%; object-fit: cover; }
.brand img { width: 60px; height: 60px; border: 1px solid #d7a548; }
.brand div { flex-direction: column; align-items: flex-start; gap: 2px; }
.brand strong { color: #f3d48f; font-size: 25px; }
.brand span { color: #c3d7e3; font-size: 13px; }
.preview-badge { border-color: #597583; color: #bbccd4; }
.topbar .icon-button { background: #0d2838; border-color: #a58a5d; }
.market-bar { margin: 0; max-width: none; padding: 16px 20px 18px; background: radial-gradient(ellipse at 82% 24%, #244653 0%, #0b2431 42%, #040c17 100%); border: 0; }
.market-refresh { color: #f2d79e; background: #092333a3; border-color: #bca67580; border-radius: 50%; box-shadow: 0 5px 14px #06131e40; }
.market-switch { background: #061b2b80; border: 1px solid #9abbb94d; border-radius: 30px; padding: 5px; gap: 4px; box-shadow: 0 6px 18px #04121d50, inset 0 1px #d5e8eb1a; }
.market-switch button { border-radius: 25px; color: #d1e3eb; font-size: 16px; padding: 10px 25px; }
.market-switch button[aria-pressed="true"], body[data-market="pc28"] .market-switch button[aria-pressed="true"] { background: linear-gradient(105deg, #438eff, #2868db); color: white; border: 0; padding: 10px 25px; }
.market-flag { font-size: 20px; line-height: 1; }
.source-state { color: #bed1de; }
main { max-width: none; margin: 0; padding: 0 0 calc(98px + env(safe-area-inset-bottom)); min-height: calc(100vh - 160px); }
.page-content { width: min(1440px, calc(100% - 32px)); margin: 18px auto 0; }
.original-home { display: block; width: 100%; border: 0; background: transparent; overflow: hidden; }
.bottom-nav { position: fixed; top: auto; left: 0; right: 0; bottom: 0; width: 100%; height: calc(82px + env(safe-area-inset-bottom)); display: grid; grid-template-columns: repeat(5, minmax(0, 1fr)); gap: 0; padding: 0 max(10px, calc((100vw - 900px) / 2)) env(safe-area-inset-bottom); border: 0; border-top: 1px solid #d9dfe8; background: #fff; box-shadow: 0 -2px 9px #0c29390a; }
.bottom-nav button { position: relative; display: flex; flex-direction: column; justify-content: center; gap: 6px; padding: 10px 2px 7px; min-height: 0; border-radius: 0; color: #18202c; font-size: 14px; background: #fff; }
.bottom-nav button > svg { width: 30px; height: 30px; flex: 0 0 30px; stroke-width: 1.8; }
.bottom-nav button[data-view="home"] > svg { width: 34px; height: 34px; flex-basis: 34px; }
.bottom-nav button[aria-current="page"] { color: #2449bd; background: #fff; }
.bottom-nav button[aria-current="page"]::after { display: block; position: absolute; top: 0; left: 0; right: 0; height: 4px; width: auto; margin: 0; border-radius: 0; background: #2449bd; }
.nav-history-ball { width: 32px; height: 32px; object-fit: contain; }
.nav-home-horse { display: block; width: 34px; height: 34px; font-family: Georgia, serif; font-size: 40px; line-height: 34px; }
.bottom-limit-hint { position: fixed; left: 50%; bottom: calc(80px + env(safe-area-inset-bottom)); z-index: 45; width: max-content; max-width: calc(100vw - 24px); padding: 7px 12px; border: 1px solid #c7dbff; border-radius: 999px; color: #fff; background: #1d4ed8; box-shadow: 0 8px 24px rgba(15, 42, 92, .25); font-family: "Noto Sans TC", "Microsoft YaHei", Arial, sans-serif; font-size: 12px; font-weight: 800; white-space: nowrap; text-align: center; transform: translateX(-50%); pointer-events: none; }
.section-heading { background: linear-gradient(112deg, #12374f, #2859a0, #4d94ac); border-bottom: 0; border-radius: 13px; }
.account-band { background: white; margin-top: 15px; padding: 20px; border: 1px solid var(--line); border-radius: 12px; }
.entitlements, .rewards, .account-links { padding-left: 12px; padding-right: 12px; }
.forum-dialog { width: min(560px, calc(100% - 24px)); }
.forum-dialog form { display: grid; gap: 14px; padding: 18px; }
.forum-dialog label { display: grid; gap: 7px; color: #254b84; font-weight: 700; }
.forum-dialog input, .forum-dialog textarea { width: 100%; min-width: 0; padding: 10px; border: 1px solid #bccce0; border-radius: 6px; background: #fff; color: #18202c; font: inherit; }
.forum-dialog textarea { resize: vertical; }
.forum-dialog footer { display: flex; flex-wrap: wrap; gap: 10px; }
.forum-rule, #forumStatus { margin: 0; font-size: 13px; color: #64748b; }
#forumError { margin: 0; color: #c41b31; font-size: 14px; }
.original-history-list { margin-top: 14px; background: #fff; border: 1px solid #b8c8df; border-radius: 13px; overflow: hidden; }
.original-history-row { padding: 16px 20px; border-bottom: 1px solid #d9e2ef; }
.original-history-row:last-child { border-bottom: 0; }
.original-history-row > header { display: flex; align-items: center; justify-content: space-between; gap: 10px; font-size: 15px; }
.original-history-row header b { color: #e11b25; }
.original-history-row time { font-size: 13px; color: #64748b; }
.original-history-numbers { display: flex; align-items: center; gap: 8px; margin-top: 12px; }
.original-history-numbers > div:not(.pc28-history-digits) { display: flex; flex-direction: column; align-items: center; gap: 3px; }
.original-history-numbers small { color: #18202c; font-size: 13px; }
.square-ball { display: inline-flex; align-items: center; justify-content: center; width: 47px; height: 47px; font-size: 25px; font-weight: 750; color: white; background: #058f08; }
.square-ball.wave-red { background: #ff0808; }.square-ball.wave-blue { background: #1400f5; }
.history-plus { color: #e11b25; font-size: 25px; margin-top: -17px; }
.pc28-history-digits { font-size: 22px; color: #071c5d; }.history-shape { margin-left: auto; font-size: 17px; font-weight: 700; color: #e11b25; }
.page-back-top { position: fixed; bottom: calc(97px + env(safe-area-inset-bottom)); right: 18px; width: 47px; height: 47px; border-radius: 50%; z-index: 20; background: #2154c6; color: #fff; border: 1px solid #7193dd; box-shadow: 0 5px 12px #17345b40; }
body[data-market="pc28"] { background: #0c2939 url('/assets/pc28-background.jpg') center top / cover fixed; }
body[data-market="pc28"] .topbar { background: #0a2338e8; }
body[data-market="pc28"] .market-bar { background: transparent; }
body[data-market="pc28"] .market-switch { background: #071b2cd9; border-color: #cfb77a70; box-shadow: 0 6px 20px #03102080, inset 0 1px #f8e2af1a; }
body[data-market="pc28"] .market-refresh { background: #071b2cd9; }
body[data-market="pc28"] .source-state { color: #d8e1eb; }
body[data-market="pc28"] .page-content { background: #f4f6fa; padding: 14px; border-radius: 13px; }
@media (max-width: 559px) {
  .topbar { height: 84px; padding: 12px 14px; gap: 9px; }
  .brand img { width: 49px; height: 49px; }
  .brand { gap: 10px; }
  .brand strong { font-size: 20px; }
  .brand span { font-size: 11px; }
  .preview-badge { position: absolute; right: 15px; top: 5px; border: 0; font-size: 9px; padding: 0; }
  .topbar .icon-button { width: 35px; height: 35px; flex-basis: 35px; }
  .market-bar { padding: 12px 12px 16px; }
  .market-bar { gap: 10px; }
  .market-bar .source-state { position: absolute; width: 1px; height: 1px; padding: 0; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
  .market-switch { flex: 1; }
  .market-switch button { font-size: 15px; padding: 8px 10px; gap: 7px; }
  .market-switch button[aria-pressed="true"], body[data-market="pc28"] .market-switch button[aria-pressed="true"] { padding: 8px 10px; }
  .market-flag { font-size: 19px; }
  main { padding: 0 0 calc(83px + env(safe-area-inset-bottom)); }
  .page-content { width: calc(100% - 20px); margin-top: 12px; }
  .bottom-nav { height: calc(73px + env(safe-area-inset-bottom)); padding: 0 0 env(safe-area-inset-bottom); }
  .bottom-nav button { gap: 4px; font-size: 12px; padding: 8px 0 4px; }
  .bottom-nav button > svg { width: 27px; height: 27px; flex-basis: 27px; }
  .bottom-nav button[data-view="home"] > svg { width: 32px; height: 32px; flex-basis: 32px; }
  .nav-home-horse { width: 32px; height: 32px; font-size: 38px; line-height: 32px; }
  .nav-history-ball { width: 31px; height: 31px; }
  .original-history-row { padding: 14px 10px; }
  .original-history-row > header { flex-wrap: wrap; gap: 4px; font-size: 14px; }
  .original-history-row time { font-size: 11px; }
  .original-history-numbers { gap: 5px; }
  .square-ball { width: 36px; height: 39px; font-size: 21px; }
  .original-history-numbers small { font-size: 11px; }
  .history-plus { font-size: 21px; }
  .page-back-top { width: 42px; height: 42px; right: 13px; bottom: calc(85px + env(safe-area-inset-bottom)); }
}
@media (max-width: 369px) {
  .brand strong { font-size: 17px; }
  .brand img { width: 44px; height: 44px; }
  .square-ball { width: 29px; height: 34px; font-size: 18px; }
}
/* Newao owns its complete textured header; history has its own heading. */
body[data-view="history"] .app-scroll-content > .market-bar,
body[data-market="newao"][data-view="home"][data-integrated-header="true"] .app-scroll-content > .market-bar { display: none; }
.market-bar { position: relative; isolation: isolate; align-items: center; overflow: clip; }
.market-bar > :not(.fusion-night-sky) { position: relative; z-index: 1; }
.market-bar .market-switch { min-width: 0; max-width: 100%; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.market-switch button { min-width: 0; }
.market-contact { width: 44px; height: 44px; flex: 0 0 44px; margin-right: 4px; border: 0; border-radius: 0; background: transparent; color: #438eff; padding: 5px; box-shadow: none; }
.market-contact img { display: block; width: 34px; height: 34px; border-radius: 0; animation: fusion-plane-float 5s ease-in-out infinite; }
html, body, #main, .legacy-host { max-width: 100%; min-width: 0; }
html { overflow-x: clip; }
.original-home { max-width: 100%; min-width: 0; }
html[data-telegram-mobile="true"], html[data-telegram-mobile="true"] body { height: 100%; overflow: hidden; overscroll-behavior-y: none; }
html[data-telegram-mobile="true"] body { position: fixed; inset: 0; }
html[data-telegram-mobile="true"] #appScroll { position: absolute; inset: 0; height: var(--app-visible-height, 100dvh); overflow-x: hidden; overflow-y: auto; overscroll-behavior-y: contain; -webkit-overflow-scrolling: touch; }
html[data-telegram-mobile="true"] .app-scroll-content { min-height: calc(var(--app-visible-height, 100dvh) + 1px); }
.account-profile { display: flex; align-items: center; gap: 14px; padding: 24px 0; border-bottom: 1px solid var(--line); }
.account-profile > img { width: 68px; height: 68px; border-radius: 50%; }
.account-profile > div { min-width: 0; flex: 1; }
.account-profile h1 { font-size: 22px; overflow-wrap: anywhere; margin: 4px 0; }
.account-profile small, .account-profile span { font-size: 12px; color: var(--muted); }
.account-profile .action-button { padding: 8px; }
.account-stats { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 20px 0; border-bottom: 1px solid var(--line); }
.account-stats > div { display: flex; flex-direction: column; align-items: center; gap: 5px; }
.account-stats > div + div { border-left: 1px solid var(--line); }
.account-stats b { font-size: 25px; color: #2359a2; }
.account-stats span { font-size: 12px; color: var(--muted); }
.invite-band { display: flex; align-items: center; gap: 12px; padding: 20px 0; border-bottom: 1px solid var(--line); }
.invite-band > svg { color: #b68928; width: 30px; height: 30px; flex-shrink: 0; }
.invite-band > div { flex: 1; min-width: 0; }
.invite-band h2 { font-size: 17px; }
.invite-band p { font-size: 12px; color: var(--muted); margin-top: 4px; }
.account-function-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); padding: 20px 0; gap: 1px; border-bottom: 1px solid var(--line); }
.account-function-grid button { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 10px; min-height: 92px; background: transparent; font-size: 13px; color: #243744; }
.account-function-grid svg { width: 25px; height: 25px; color: #2459b2; }
.account-function-grid button:nth-child(2n) svg { color: #16816f; }
.account-function-grid button:nth-child(3n) svg { color: #b07c1e; }
.motion-setting { display: flex; justify-content: space-between; align-items: center; padding: 20px 0; border-bottom: 1px solid var(--line); }
.motion-setting input, .gallery-source-actions input { accent-color: #2868db; width: 18px; height: 18px; }
.gallery-source-actions { display: flex; gap: 12px; align-items: center; flex-wrap: wrap; margin: 16px 0; }
.gallery-source-actions label { display: flex; gap: 6px; align-items: center; font-size: 13px; }
.welcome-dialog { width: min(440px, calc(100% - 32px)); border-radius: 8px; padding: 24px; }
.welcome-dialog small { color: #9a772d; font-size: 13px; }
.welcome-dialog h2 { font-size: 22px; color: #87671f; margin: 12px 0 16px; }
.welcome-dialog p { font-size: 16px; line-height: 1.85; }
.welcome-dialog footer { display: flex; gap: 12px; margin-top: 28px; }
.welcome-dialog footer button { flex: 1; }
.welcome-dialog footer button:last-child { background: #8d6b20; }
.welcome-dialog .secondary { background: #fff; border: 1px solid #c8cfd2; color: #273746; }
.welcome-dialog { padding: 22px; background: #fbfcfd; color: #263c43; border: 1px solid #b9cbc9; border-top: 4px solid #c49b43; box-shadow: 0 20px 70px #0004; }
.welcome-brand { position: relative; display: flex; align-items: center; gap: 10px; padding-bottom: 14px; border-bottom: 1px solid #dae4e5; }
.welcome-brand > * { position: relative; z-index: 1; }
.welcome-brand img { width: 38px; height: 38px; border-radius: 6px; }
.welcome-brand span { color: #255b5d; font-size: 13px; font-weight: 600; }
.welcome-brand small { margin-left: auto; color: #deb76d; }
.welcome-dialog h2 { margin: 18px 0 6px; font-size: 20px; color: #176562; }
.welcome-dialog p { font-size: 13px; line-height: 1.85; }
.welcome-dialog .welcome-subtitle { font-size: 12px; color: #176562; margin-bottom: 14px; }
.welcome-dialog footer { margin-top: 16px; }
.welcome-dialog footer button:last-child { background: linear-gradient(110deg, #d6b65c, #b48b32); color: #382b13; border: 1px solid #bd963d; }
.welcome-dialog .secondary { color: #386565; border-color: #bacfce; background: #f1f6f6; }
.welcome-dots { display: flex; justify-content: center; gap: 8px; margin-top: 22px; }
.welcome-dots button { border: 0; width: 8px; height: 8px; border-radius: 50%; padding: 0; background: #c7d4d4; }
.welcome-dots button[aria-pressed="true"] { background: #b68d36; }
.announcement-form { display: grid; gap: 12px; }
.announcement-form label { display: grid; gap: 8px; font-size: 13px; }
.announcement-form textarea { width: 100%; min-height: 110px; resize: vertical; border: 1px solid #b9cbc9; border-radius: 6px; padding: 10px; font: inherit; }
.announcement-form small { color: var(--muted); }
.access-actions { display: flex; align-items: center; flex-direction: column; gap: 14px; margin-top: 22px; }
.access-actions .action-button { max-width: 100%; }
.gallery-search { display: flex; align-items: center; gap: 9px; margin-top: 20px; padding: 5px 5px 5px 12px; background: white; border: 1px solid #b5c8d7; border-radius: 6px; }
.gallery-search input { flex: 1; width: 0; min-width: 0; border: 0; background: transparent; font: inherit; padding: 8px 0; outline: none; }
.gallery-search input:focus { outline: none; }
.gallery-search:focus-within { outline: 2px solid #347af0; }
.gallery-search .action-button { padding: 8px 14px; }
.gallery-update { display: flex; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.gallery-update b { background: #1d526d; color: #f5dc9e; font-size: 12px; padding: 5px 8px; border-radius: 4px; white-space: nowrap; }
.gallery-update span { flex: 1; font-size: 12px; color: var(--muted); }
.gallery-update .icon-button { background: transparent; border: 0; }
.gallery-tabs { display: flex; gap: 3px; padding: 3px; border-radius: 6px; background: #e1e9ef; }
.gallery-tabs button { padding: 7px 12px; color: #415b71; background: transparent; font-size: 13px; white-space: nowrap; }
.gallery-tabs button[aria-selected="true"] { background: #245da6; color: white; }
.gallery-source-actions { justify-content: space-between; }
.gallery-source-actions > .action-button { font-size: 12px; padding: 7px 9px; }
.gallery-scope { display: flex; align-items: center; gap: 8px; font-size: 12px; color: var(--muted); margin-bottom: 12px; }
.gallery-scope select { padding: 4px; border: 1px solid var(--line); background: white; }
.gallery-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.gallery-list .material-item { display: flex; padding: 12px; gap: 12px; min-width: 0; border-radius: 7px; background: white; }
.gallery-list .image-preview { position: relative; width: 72px; height: 90px; aspect-ratio: auto; flex: 0 0 72px; border-radius: 4px; padding: 0; }
.gallery-list .image-preview img { width: 100%; height: 100%; object-fit: contain; background: #e5ecef; }
.gallery-list .image-preview > span { position: absolute; bottom: 0; left: 0; background: #163248e8; color: white; font-size: 10px; padding: 1px 5px; }
.gallery-list .material-meta { flex: 1; min-width: 0; padding: 0; }
.gallery-list h2 { font-size: 14px; line-height: 1.5; overflow-wrap: anywhere; }
.gallery-list h2 button { font: inherit; padding: 0; background: transparent; text-align: left; }
.gallery-list .material-meta > small { display: block; margin-top: 5px; font-size: 11px; }
.gallery-list .material-meta > div { margin-top: 4px; font-size: 11px; }
.gallery-list .material-meta > div > span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gallery-list .icon-button { width: 28px; height: 28px; flex-basis: 28px; border: 0; }
.image-paging { display: flex; justify-content: center; align-items: center; gap: 15px; margin-bottom: 12px; }
.composer-controls { display: flex; flex-wrap: wrap; gap: 12px; }
.composer-controls label { flex: 1; min-width: 90px; }
.composer-controls select, #forumVisibility { padding: 10px; border: 1px solid #bacadc; background: white; width: 100%; }
.composer-picks { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; }
.composer-picks button { min-height: 32px; padding: 4px; background: #edf2f8; color: #214574; border: 1px solid #c5d4e9; }
.composer-picks button[aria-pressed="true"] { background: #2872df; border-color: #2872df; color: white; }
.picture-picker { display: flex !important; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 13px; }
.picture-picker input { width: 100%; font: inherit; }
.composer-pictures { display: flex; gap: 10px; }
.composer-pictures > div { position: relative; width: 90px; height: 90px; }
.composer-pictures img { width: 100%; height: 100%; object-fit: contain; background: #e3edf4; }
.composer-pictures button { position: absolute; top: 0; right: 0; width: 25px; height: 25px; }
.personal-tips-band, .points-exchange { display: flex; align-items: center; gap: 10px; padding: 18px 0; border-bottom: 1px solid var(--line); }
.personal-tips-band > div, .points-exchange > div { flex: 1; min-width: 0; }
.personal-tips-band > svg { color: #ba8526; }
.points-exchange > svg { color: #dc861d; }
.personal-tips-band h2, .points-exchange h2 { font-size: 15px; }
.personal-tips-band p, .points-exchange p { color: var(--muted); font-size: 12px; margin-top: 5px; }
.personal-tips-band .action-button, .points-exchange .action-button { font-size: 12px; padding: 8px; white-space: nowrap; }
.personal-tips-band .action-button { min-height: 30px; height: 30px; padding: 5px 9px; font-size: 12px; gap: 5px; flex-shrink: 0; }
.personal-tips-band .action-button svg { width: 14px; height: 14px; flex-basis: 14px; }
.post-prediction { display: flex; flex-direction: column; gap: 8px; margin-top: 12px; padding: 10px 0; border-block: 1px solid #d1ddea; }
.post-prediction span, .post-prediction small { color: #5c7088; font-size: 12px; }
.post-prediction b { color: #235ec0; overflow-wrap: anywhere; }
.account-profile { padding: 24px 16px; background: #143449; color: #f5db9d; border-bottom: 2px solid #d5b570; }
.account-profile small, .account-profile span { color: #c4d9e5; }
.account-profile .icon-button { color: #f4da9b; background: transparent; border-color: #648195; }
.account-stats { background: #edf3f8; }
.account-stats > div:nth-child(2) b { color: #16836b; }
.account-stats > div:nth-child(3) b { color: #c35569; }
.account-function-grid { gap: 10px; }
.account-function-grid button { background: #e5eefc; border-radius: 6px; }
.account-function-grid button:nth-child(2) { background: #e0f4eb; }
.account-function-grid button:nth-child(3) { background: #fff0d9; }
.account-function-grid button:nth-child(4) { background: #ffe8ec; }
.account-function-grid button:nth-child(4) svg { color: #ba4164; }
.account-function-grid button:nth-child(5) { background: #e4eff1; }
.account-function-grid button:nth-child(6) { background: #e4eeff; }
.gallery-year { display: flex; align-items: center; gap: 8px; margin: 10px 0; font-size: 12px; color: var(--muted); }
.gallery-year select, .image-history select { font: inherit; padding: 6px 8px; border: 1px solid var(--line); border-radius: 6px; background: white; color: var(--ink); }
.image-history { display: flex; align-items: center; gap: 8px; margin: 10px 0; min-width: 0; }
.image-issues { display: flex; gap: 6px; flex: 1; min-width: 0; overflow-x: auto; overscroll-behavior-x: contain; }
.image-issues button { flex: 0 0 auto; padding: 7px 10px; border: 1px solid var(--line); border-radius: 6px; background: white; font-size: 12px; line-height: 1.3; color: var(--ink); }
.image-issues button[aria-selected="true"] { color: white; background: #245aa6; border-color: #245aa6; }
.author-tools { display: flex; align-items: center; justify-content: space-between; padding: 12px 0; border-bottom: 1px solid var(--line); }
.author-tools h2 { margin: 0; font-size: 14px; }
.author-tools .action-button { min-height: 32px; font-size: 12px; padding: 7px 10px; }
@media (max-width: 619px) {
  .gallery-list { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
  .gallery-list .material-item { display: grid; grid-template-columns: 46px minmax(0, 1fr); gap: 7px; padding: 8px; }
  .gallery-list .image-preview { width: 46px; height: 66px; }
  .gallery-list h2 { font-size: 12px; line-height: 1.45; }
  .gallery-list .material-meta > small { font-size: 10px; }
  .gallery-list .material-meta > div { font-size: 10px; }
  .gallery-list .material-meta > div > span { display: none; }
  .gallery-list .material-meta > div { justify-content: flex-end; }
  .gallery-list .icon-button { width: 24px; height: 24px; }
}
@media (max-width: 369px) { .welcome-dialog { padding: 18px; } .welcome-dialog h2 { font-size: 20px; } .gallery-tabs button { padding: 7px 9px; } .account-profile > img { width: 52px; height: 52px; } }
.points-ledger p { display: grid; grid-template-columns: 1fr auto; gap: 6px; padding: 12px 0; border-bottom: 1px solid var(--line); }
.points-ledger small { grid-column: 1 / -1; color: var(--muted); }
.forum-posts article { padding: 20px 0; border-bottom: 1px solid var(--line); }
.forum-posts header { display: flex; justify-content: space-between; gap: 10px; }
.forum-posts h2 { font-size: 18px; }
.forum-posts p { white-space: pre-wrap; overflow-wrap: anywhere; margin: 12px 0; }
.forum-posts footer { display: flex; gap: 10px; }
@media (max-width: 559px) {
  .market-bar { gap: 4px; }
  .market-bar .source-state { position: absolute; }
}
@media (max-width: 369px) {
  .market-switch button, .market-switch button[aria-pressed="true"], body[data-market="pc28"] .market-switch button[aria-pressed="true"] { font-size: 13px; padding: 8px 4px; gap: 4px; }
}
.access-form { display: grid; gap: 12px; }
.access-form label { display: grid; gap: 5px; font-weight: 650; }
.access-form input,.access-form select { box-sizing: border-box; width: 100%; min-width: 0; min-height: 42px; border: 1px solid #bcc9dc; border-radius: 8px; padding: 8px; color: #172b45; background: #fff; font: inherit; }
.access-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.access-member { display: grid; gap: 5px; text-align: left; padding: 12px; border: 1px solid #c7d4e7; border-radius: 8px; color: #172b45; background: #f5f8fd; font: inherit; cursor: pointer; }
.access-member span,.access-member small { overflow-wrap: anywhere; }

.academy-account{padding:12px;margin:10px 0;border:1px solid #dbeafe;border-radius:12px;font-size:13px}.academy-account p{margin:6px 0;font-size:12px}.academy-account small{display:block;color:#64748b;font-size:11px}

.academy-post-author{display:flex;gap:6px;align-items:center;font-size:12px;color:#475569}.academy-post-author small{font-size:10px;background:#eff6ff;border-radius:10px;padding:2px 6px}

/* Compact account controls without shrinking touch targets. */
body[data-view="account"] .action-button{font-size:12px;min-height:34px;padding:6px 9px;gap:5px;line-height:1.3}
body[data-view="account"] .action-button svg{width:16px;height:16px;flex-basis:16px}
body[data-view="account"] .author-tools{gap:7px;padding:10px 0;flex-wrap:wrap}
body[data-view="account"] .author-tools h2{font-size:14px}
body[data-view="account"] .account-profile{padding:14px 12px;gap:10px}
body[data-view="account"] .account-profile>img{width:52px;height:52px;flex:0 0 52px;object-fit:cover;background:#edf2f7}
body[data-view="account"] .account-profile h1{font-size:20px}
body[data-view="account"] .account-profile small,body[data-view="account"] .account-profile span{font-size:11px}
body[data-view="account"] .account-profile .icon-button{width:34px;height:34px;min-width:34px}
body[data-view="account"] .account-stats{padding:14px 0}
body[data-view="account"] .invite-band,body[data-view="account"] .points-exchange{padding:13px 0;gap:8px}
body[data-view="account"] .invite-band h2,body[data-view="account"] .points-exchange h2{font-size:15px}
body[data-view="account"] .account-function-grid{padding:12px 0}
body[data-view="account"] .account-function-grid button{min-height:70px;gap:6px;font-size:12px}
body[data-view="account"] .account-function-grid svg{width:21px;height:21px}

.forum-post-pictures{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:6px;margin:8px 0}.forum-post-pictures button{padding:0;border-radius:8px;overflow:hidden;background:#edf2f7}.forum-post-pictures img{display:block;width:100%;height:86px;object-fit:cover}.forum-image-dialog{width:min(700px,calc(100% - 20px));padding:10px;border-radius:12px}.forum-image-dialog img{display:block;width:100%;height:auto}.forum-image-dialog header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.forum-image-dialog h2{font-size:16px}.forum-author-profile{display:flex;flex-wrap:wrap;align-items:center;gap:8px;padding:12px;background:#eff6ff;border-radius:12px;margin:8px 0}.forum-author-profile>div{flex:1;min-width:0}.forum-author-profile h2{font-size:17px}.forum-author-profile small{font-size:11px;color:#64748b}.forum-author-profile p{width:100%;margin:0;font-size:12px}.forum-author-profile .action-button{font-size:12px;padding:7px 9px;min-height:34px}.academy-post-author button{border:0;padding:4px 0;background:transparent;color:#1d4ed8;font-size:12px}.following-author{display:flex;flex-wrap:wrap;gap:5px 8px;align-items:center;width:100%;text-align:left;padding:12px 0;border-bottom:1px solid #dbeafe;background:transparent}.following-author span{margin-left:auto;font-size:12px;color:#1d4ed8}.following-author small{font-size:11px;color:#64748b}.forum-pagination{justify-content:center;gap:10px}.forum-pagination .action-button{font-size:12px;padding:6px 9px;min-height:34px}

.market-bar .market-contact{width:65px;flex-basis:65px;display:flex;flex-direction:column;font-size:10px;color:#a5d3ff;gap:2px;white-space:nowrap}.market-bar .market-contact svg{width:18px;height:18px}

.forum-formatted{max-width:100%;overflow-wrap:anywhere}.forum-formatted p{white-space:pre-wrap;margin:3px 0;line-height:1.55}.ff-font-song{font-family:Songti SC,SimSun,serif}.ff-font-kai{font-family:Kaiti SC,STKaiti,KaiTi,serif}.ff-font-hei{font-family:Heiti SC,SimHei,sans-serif}.ff-color-red{color:#c52626}.ff-color-blue{color:#204dbb}.ff-color-green{color:#077d45}.ff-color-pink{color:#b92173}.ff-bold{font-weight:800}.ff-align-center{text-align:center}.ff-align-right{text-align:right}.forum-format-tools{padding:10px;border:1px solid #d2dce5;border-radius:8px}.forum-format-controls{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:5px}.forum-format-controls label{min-width:0;font-size:11px}.forum-format-controls select{width:100%;font-size:12px}.forum-format-tools p{font-size:11px;color:#5d6e72}.forum-emojis{display:flex;gap:6px;margin:7px 0}.forum-emojis button{font-size:19px;background:#f1f5f9;padding:5px 10px}#forumFormatPreview{padding:9px;border-radius:6px;background:#fff;border:1px solid #dde4ea;margin-top:7px}#forumFormatBold[aria-pressed=true]{background:#d5e8ff}

.forum-formatted p.ff-color-red{color:#c52626}.forum-formatted p.ff-color-blue{color:#204dbb}.forum-formatted p.ff-color-green{color:#077d45}.forum-formatted p.ff-color-pink{color:#b92173}.forum-formatted p.ff-color-default{color:var(--ink)}

.market-bar .market-contact{width:44px;flex-basis:44px;height:48px;padding:0;gap:0}.market-bar .market-contact img{width:30px;height:30px;animation:fusion-plane-float 3s ease-in-out infinite}.market-bar .market-contact span{font-size:10px}

.fee-dialog .fee-cta-actions{display:flex;flex-direction:column;align-items:center;gap:12px;margin-top:16px}.fee-dialog .fee-cta-actions .action-button{width:auto;max-width:100%;min-width:190px;min-height:36px;padding:8px 16px;font-size:13px}.fee-dialog .fee-cta-actions .action-button[data-action="contact"]{background:#17675f}.market-bar .market-contact{width:50px;flex-basis:50px}

.market-bar{gap:14px!important}.market-bar .market-contact{width:56px!important;flex:0 0 56px!important;height:50px!important;display:flex!important;flex-direction:column!important;align-items:center!important;justify-content:center!important;margin:0!important;padding:0!important;text-align:center!important}.market-bar .market-contact img{display:block;margin:0 auto!important}.market-bar .market-contact span{display:block;width:100%;text-align:center!important;white-space:nowrap}

.market-bar .market-contact img{animation:fusion-share-lift 3s ease-in-out infinite!important}
@keyframes fusion-share-lift{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}

.forum-rejected{margin:12px 0;border:1px solid #d8e0eb;border-radius:8px;padding:10px}.forum-rejected>summary{font-size:12px;color:#65748a;cursor:pointer}.forum-rejected article{padding:12px 0}

.admission-dialog{box-sizing:border-box;width:min(350px,calc(100vw - 32px));max-height:90dvh;overflow:auto;border:1px solid #b85c42;border-radius:12px;padding:24px 22px 18px;background:linear-gradient(145deg,#fff8e5,#f4ead0);color:#5b3023;box-shadow:0 15px 50px #0005}.admission-dialog::backdrop{background:#081c30aa}.admission-close{position:absolute;top:7px;right:9px;background:transparent;color:#925b45;font-size:24px;padding:2px 7px}.admission-school{text-align:center;font-weight:700;font-size:17px;color:#9c3428}.admission-mail{display:block;text-align:center;letter-spacing:2px;margin-top:5px;font-size:9px;color:#9a7761}.admission-dialog h2{font-family:"Songti SC",serif;text-align:center;font-size:32px;letter-spacing:5px;color:#99342b;margin:20px 0 18px;border-bottom:1px solid #b18460;padding-bottom:14px}.admission-dialog p{font-size:13px;line-height:1.9}.admission-to{font-weight:bold}.admission-course{display:flex;gap:5px;justify-content:center}.admission-course span{padding:5px 8px;border:1px solid #ccaa78;border-radius:5px;font-size:11px}.admission-motto{text-align:center;font-family:"Songti SC",serif}.admission-sign{display:flex;align-items:center;justify-content:space-between;margin:18px 0;font-size:11px;line-height:1.7}.admission-sign b{padding:10px;border:2px solid #b6382b;border-radius:50%;color:#b6382b;transform:rotate(-12deg);font-size:14px}.admission-actions{display:flex;justify-content:center;gap:10px}.admission-actions .action-button{padding:8px 10px;font-size:12px;background:#973d2d}.admission-actions .action-button:last-child{background:#8f7748}

.admission-dialog h2{font-family:"Kaiti SC","STKaiti","KaiTi",cursive;font-weight:700;font-size:36px;letter-spacing:3px;transform:rotate(-2deg)}.admission-mail{font-size:14px;letter-spacing:1px;color:#9b3425;font-family:"Kaiti SC","STKaiti","KaiTi",serif}.admission-sign .admission-seal{box-sizing:border-box;display:flex;flex-direction:column;justify-content:center;width:105px;height:105px;border:4px double #b5342b;border-radius:50%;position:relative;background:transparent;color:#b5342b;transform:rotate(-14deg);padding:10px;box-shadow:inset 0 0 0 3px #b5342b22}.admission-seal:after{content:"";position:absolute;inset:5px;border:1px dashed currentColor;border-radius:50%}.admission-seal small{font-size:10px;line-height:1.4;text-align:center}.admission-seal strong{font-size:18px;font-family:"Kaiti SC","KaiTi",serif}.admission-motto{font-size:12px!important;color:#a1452b}.admission-course{flex-wrap:wrap}.admission-course span{font-size:10px;padding:4px 6px}

.admission-dialog h2.admission-art-title{transform:none;margin:16px 0 18px;padding:0 0 12px;line-height:0;border-bottom:1px solid #b18460}.admission-art-title img{display:block;width:86%;height:auto;max-height:93px;object-fit:contain;margin:0 auto}.admission-welcome{position:relative;width:152px;height:112px;display:flex;align-items:flex-end;justify-content:center;padding-bottom:6px}.admission-welcome>strong{font-family:"Kaiti SC","KaiTi",serif;font-size:25px;color:#953326;letter-spacing:2px;transform:rotate(-4deg)}.admission-sign .admission-welcome .admission-seal{position:absolute;top:0;right:8px;width:80px;height:80px;padding:12px 2px;background:transparent;border:3px double #ba372b;transform:rotate(-14deg);z-index:1;line-height:1.6;font-size:12px;color:#ba372b}.admission-seal>span{display:block;text-align:center;white-space:nowrap;letter-spacing:1px}.admission-sign{margin:12px 0 16px}.admission-mail{font-size:12px;letter-spacing:0}

.admission-welcome{box-sizing:border-box;padding:0}.admission-welcome>strong{position:absolute;left:0;bottom:0;width:100%;text-align:center;line-height:34px}.admission-sign .admission-welcome .admission-seal{top:14px;right:8px}

.admission-sign .admission-welcome .admission-seal{top:26px;right:6px;width:88px;height:88px;padding:10px 2px}
.admission-seal>span:first-child{font-size:14px;letter-spacing:0;font-weight:800;line-height:1.6}.admission-seal>span:last-child{font-size:10px;letter-spacing:1px;font-weight:600;line-height:1.8}

/* Admission seal: solid red ribbon and a lighter overlap at the upper right. */
.admission-sign .admission-welcome .admission-seal{top:17px;right:-2px;padding:0}
.admission-seal>span:first-child{position:absolute;z-index:2;left:-5px;right:-5px;top:25px;height:26px;display:flex;align-items:center;justify-content:center;background:#b51e2d;border:1px solid #8f1421;border-radius:3px;color:#fff;font-size:13px;font-weight:800;letter-spacing:0;line-height:1;box-shadow:0 2px 4px #78212c33}
.admission-seal>span:last-child{position:absolute;left:0;right:0;bottom:15px;color:#b5342b;font-size:10px;line-height:1.4}

.admission-seal>span:first-child img{display:block;width:86px;height:23px;object-fit:contain}

/* Keep dismiss controls accessible throughout long dialogs. */
dialog:not(.admission-dialog)>header{position:sticky;top:-22px;z-index:5;background:#fff;padding-top:12px;box-shadow:0 2px 0 #dbe4ef;}
.forum-dialog footer{position:sticky;bottom:-22px;z-index:5;background:#fff;padding:12px 0;box-shadow:0 -2px 0 #dbe4ef;}
.page-collapse{position:fixed;left:12px;bottom:calc(90px + env(safe-area-inset-bottom));z-index:21;padding:11px 16px;border:1px solid #7193dd;border-radius:24px;background:#2154c6;color:white;box-shadow:0 5px 12px #17345b40;font-size:14px;}
.page-collapse[hidden]{display:none;}

.post-result{margin-top:10px;padding:10px 12px;border-radius:10px;background:#eaf0f7;color:#52647d}.post-result strong{display:block}.post-result small{display:block;margin-top:4px}.post-result-hit{background:#e7f8ed;color:#087a3f}.post-result-miss{background:#fff0f1;color:#c7283e}.composer-help{display:block;margin-top:8px;color:#61738d;font-size:13px;line-height:1.6}

.forum-manage-actions{display:flex;flex-wrap:wrap;align-items:center;gap:5px}.forum-manage-actions .action-button{flex:0 0 auto;width:auto;min-width:0;min-height:28px;height:28px;padding:4px 7px;font-size:11px;line-height:18px;white-space:nowrap;border-radius:5px}
@media(max-width:360px){.forum-manage-actions{gap:4px}.forum-manage-actions .action-button{font-size:10px;padding:4px 5px}}

.web-login-dialog{width:min(390px,calc(100vw - 28px));padding:20px;border:1px solid #ccd6e4;border-radius:14px;color:#182434;max-height:85dvh;overflow:auto}
.web-login-dialog::backdrop{background:#07162299}
.web-login-dialog header{display:flex;align-items:center;justify-content:space-between;position:sticky;top:-20px;background:white;padding:8px 0;z-index:1}
.web-login-dialog h2{font-size:20px;margin:0}.web-login-dialog p{font-size:13px;line-height:1.6;color:#52657b}
.web-login-dialog label{display:grid;gap:7px;margin:14px 0;font-size:14px}.web-login-dialog input{width:100%;box-sizing:border-box;padding:10px;border:1px solid #b9c9df;border-radius:6px;font-size:14px}
.web-login-dialog button{font:inherit;font-size:13px;padding:8px 12px;border-radius:6px;border:1px solid #c5d2e4;background:white;color:#2048b9;cursor:pointer}
.web-login-dialog [type=submit]{background:#2346b8;color:white;width:100%;border:0;padding:10px}
.web-login-dialog nav{display:flex;flex-wrap:wrap;gap:6px;margin-top:14px}.web-login-dialog .web-close{font-size:25px;padding:0 8px}.web-login-dialog .web-auth-message{color:#ad2727;min-height:20px}

/* Compact permissions and contact controls, including expiry dialogs. */
.contact-link{text-decoration:none;width:auto!important;min-width:0!important;min-height:32px!important;padding:6px 11px!important;font-size:12px!important;line-height:20px;white-space:nowrap;align-self:start;justify-self:start}
.access-form>.action-button,.access-actions>.action-button{width:auto;min-width:0;min-height:32px;padding:6px 11px;font-size:12px;justify-self:start}
.input-help{display:block;color:#61718a;font-size:11px;line-height:1.6;margin:4px 0}
.telegram-web-entry{border-top:1px solid #d4deec;margin-top:16px;padding-top:12px}.telegram-web-login{width:100%;background:#eaf5ff!important;color:#087bc1!important}.telegram-confirm-link{display:inline-block;padding:7px 10px;background:#168ac8;color:white;border-radius:6px;font-size:12px;text-decoration:none}.telegram-web-status small{display:block;font-size:11px;margin-top:5px}

/* Login gate controls remain a compact centered group. */
.access-block .access-actions{align-items:center;justify-content:center}
.access-block .access-actions .contact-link{align-self:center!important;justify-self:center!important;background:transparent;color:#48627d;border:1px solid #b9c9da;border-radius:6px}
.access-block .access-actions [data-action="telegram-login"]{background:#168dcc;color:white}
.access-block .access-actions .login-help{max-width:280px;font-size:11px;color:#6a7a8f;line-height:1.6}