/* 02 樱花商会 — preview-only pixel theme, the production app stays unchanged. */
@font-face {
  font-family: 'Ark Pixel';
  src: url('/assets/pixel-sakura/ark-pixel.b67eb7aa5926.woff2') format('woff2');
  font-display: swap;
}

body.sakura-pixel {
  --ink: #26304d;
  --wood: #763b30;
  --wood-dark: #422b32;
  --red: #a52e3a;
  --pink: #eb7497;
  --gold: #e7b25a;
  --paper: #fff9ed;
  --serif: 'Ark Pixel', 'Microsoft YaHei', sans-serif;
  color-scheme: light;
  color: var(--ink);
  font-family: 'Ark Pixel', 'Microsoft YaHei', sans-serif;
  background-color: #eecbbf;
  background-image: linear-gradient(#fff4e809, #f5d8c71a), url('/assets/pixel-sakura/sakura-town-1080p.a8a8284ae451.webp');
  background-position: center, center center;
  background-size: cover, cover;
  background-repeat: no-repeat;
  image-rendering: pixelated;
  -webkit-font-smoothing: auto;
}

.sakura-pixel button,
.sakura-pixel a,
.sakura-pixel input { font-family: inherit; }
.sakura-pixel button:focus-visible,
.sakura-pixel a:focus-visible,
.sakura-pixel input:focus-visible { outline: 3px solid #307dba; outline-offset: 4px; }

.sakura-pixel .masthead {
  width: calc(100% - 48px);
  max-width: 1320px;
  min-height: 64px;
  height: 64px;
  padding: 0 8px;
  gap: 20px;
}
.sakura-pixel .brand {
  gap: 9px;
  padding: 7px 14px 7px 8px;
  color: #fff8ee;
  background: #36384e;
  border: 3px solid #633c38;
  border-radius: 0;
  box-shadow: inset 0 0 0 2px #cfa16b, 3px 3px 0 #573a37;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 1px;
}
.sakura-pixel .brand-icon {
  width: 31px;
  height: 32px;
  color: #ffd9e9;
  border: 0;
  background: #b64f6a;
  clip-path: polygon(6px 0, 25px 0, 25px 6px, 31px 6px, 31px 26px, 25px 26px, 25px 32px, 6px 32px, 6px 26px, 0 26px, 0 6px, 6px 6px);
  font-size: 21px;
  text-shadow: 2px 2px #683240;
}
.sakura-pixel .brand small { margin-top: 4px; font-size: 7px; letter-spacing: 2px; color: #ecd0c4; }
.sakura-pixel .edition { color: #6b3542; font-size: 9px; letter-spacing: 2px; }
.sakura-pixel .edition-label { display: none; }
.sakura-pixel #live-clock {
  margin: 0;
  padding: 9px 19px;
  color: #fff8ee;
  background: #313c5d;
  border: 3px solid #684337;
  border-radius: 0;
  box-shadow: inset 0 0 0 2px #d6aa6d, 3px 3px #634232;
  font-family: 'Ark Pixel', monospace;
  font-size: 20px;
  letter-spacing: 2px;
  font-weight: 700;
  text-shadow: none;
}
.sakura-pixel .actions { gap: 10px; }
.sakura-pixel .actions button {
  min-height: 39px;
  padding: 8px 15px;
  color: #fff9ef;
  border: 3px solid #6e3746;
  border-radius: 0;
  background: #d96189;
  box-shadow: inset 2px 2px #ffadc1, inset -2px -2px #af3f68, 3px 3px #6c3944;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 1px;
  transition: transform .12s;
}
.sakura-pixel .actions button:hover { color: #fff; background: #e8789b; border-color: #6e3746; transform: translateY(-1px); }
.sakura-pixel .actions button:active { transform: translate(2px, 2px); box-shadow: inset 2px 2px #c8567b, 1px 1px #6c3944; }
.sakura-pixel .actions .admin {
  background: #3c4a72;
  border-color: #343447;
  box-shadow: inset 2px 2px #8194bc, inset -2px -2px #253657, 3px 3px #634232;
  color: #fff9ee;
}
.sakura-pixel .actions .admin:hover { background: #4c5d8a; border-color: #343447; }
.sakura-pixel .actions svg { width: 15px; height: 15px; }

.sakura-pixel main {
  width: calc(100% - 64px);
  max-width: 1100px;
  padding: 0 0 10px;
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: 220px minmax(0, 1fr);
  gap: 12px;
}
.sakura-pixel .hero {
  grid-area: 1 / 1 / 2 / 2;
  display: block;
  background: linear-gradient(90deg, #fff1df, #d2e9f9 42%, #f9e2d7);
  border: 3px solid #864236;
  border-radius: 0;
  box-shadow: inset 0 0 0 2px #ffdc99, inset 0 0 0 5px #b56546, 4px 4px #613e3e;
  overflow: hidden;
}
.sakura-pixel .hero::before {
  inset: 7px;
  border: 1px solid #e5bd7c;
  box-shadow: none;
  z-index: 1;
}
.sakura-pixel .hero::after {
  content: '✿';
  inset: auto 20px 13px auto;
  color: #b64b6980;
  border: 0;
  font: 30px 'Microsoft YaHei', sans-serif;
  z-index: 1;
}
.sakura-pixel .fuji-scene {
  position: absolute;
  inset: 9px 34% 9px 29%;
  background: url('/assets/pixel-sakura/sakura-town-1080p.a8a8284ae451.webp') center 33% / 180% auto no-repeat;
  mask-image: linear-gradient(90deg, transparent, #000 8%, #000 92%, transparent);
  pointer-events: none;
}
.sakura-pixel .hero-ray::after,
.sakura-pixel .side-word,
.sakura-pixel .ticker,
.sakura-pixel .ceremony-caption { display: none; }
.sakura-pixel .hero-copy {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  width: 32%;
  height: 100%;
  padding: 18px 0 20px 32px;
  text-align: left;
}
.sakura-pixel .title-top,
.sakura-pixel .hero h1 {
  color: #ffe28a;
  -webkit-text-fill-color: #ffe28a;
  -webkit-text-stroke: 0;
  background: none;
  filter: none;
  text-shadow: -2px -2px #794235, 2px -2px #794235, -2px 2px #794235, 2px 2px #794235, 0 4px #9c542e, 3px 6px #5b2c29;
  font-family: 'Ark Pixel', 'Microsoft YaHei', sans-serif;
  font-weight: 900;
  animation: none;
}
.sakura-pixel .title-top { margin-top: 0; font-size: 48px; line-height: 1.05; letter-spacing: 8px; text-indent: 0; }
.sakura-pixel .hero h1 { margin: 6px 0 0; font-size: 46px; line-height: 1.1; letter-spacing: 1px; }
.sakura-pixel .hero-sub {
  display: inline-block;
  margin: 15px 0 0;
  padding: 5px 12px;
  color: #84332e;
  background: #fffaf0df;
  border-top: 2px solid #c37f4a;
  border-bottom: 2px solid #c37f4a;
  font-size: 13px;
  letter-spacing: 2px;
  line-height: 1.3;
  text-shadow: none;
}

.sakura-pixel .podium-scene {
  position: absolute;
  right: 25px;
  bottom: 13px;
  width: 33%;
  height: 180px;
  margin: 0;
  flex: none;
  gap: 5px;
  grid-template-columns: 1fr 1.12fr 1fr;
}
.sakura-pixel .podium-scene::before { display: none; }
.sakura-pixel .podium-cell { --metal-light: #f2f5ff; --metal: #9aaec1; --metal-dark: #576579; --metal-glow: transparent; }
.sakura-pixel .podium-cell.champion { --metal-light: #ffe8a4; --metal: #edb955; --metal-dark: #8f551e; }
.sakura-pixel .podium-cell.bronze { --metal-light: #ffd6bc; --metal: #cd9068; --metal-dark: #8c4e37; }
.sakura-pixel .medal-shell,
.sakura-pixel .champion .medal-shell {
  width: 60px;
  height: 60px;
  padding: 4px;
  border: 3px solid var(--metal-dark);
  border-radius: 4px;
  background: var(--metal);
  box-shadow: inset 2px 2px var(--metal-light), 3px 3px #573c39;
}
.sakura-pixel .champion .medal-shell { width: 72px; height: 72px; }
.sakura-pixel .medal-shell::before,
.sakura-pixel .medal-shell::after { display: none; }
.sakura-pixel .medal-photo { border: 1px solid var(--metal-dark); border-radius: 0; box-shadow: none; image-rendering: pixelated; }
.sakura-pixel .medal-index {
  width: 20px;
  height: 20px;
  bottom: -8px;
  border: 2px solid var(--metal-dark);
  border-radius: 0;
  background: var(--metal-light);
  color: var(--metal-dark);
  box-shadow: 2px 2px #573c39;
  font: 700 12px 'Ark Pixel', monospace;
}
.sakura-pixel .medal-crown { width: 36px; height: 26px; top: -24px; filter: none; image-rendering: pixelated; }
.sakura-pixel .podium-person { margin-top: 12px; }
.sakura-pixel .podium-person h3,
.sakura-pixel .champion .podium-person h3 { color: #302c43; font-size: 17px; line-height: 1.2; font-weight: 700; text-shadow: 1px 1px #fff4d9; }
.sakura-pixel .champion .podium-person h3 { color: #8b392a; font-size: 20px; }
.sakura-pixel .podium-person p { margin: 4px 0 6px; color: #714832; font: 10px 'Ark Pixel', 'Microsoft YaHei', sans-serif; letter-spacing: 0; }
.sakura-pixel .podium-plinth,
.sakura-pixel .champion .podium-plinth,
.sakura-pixel .bronze .podium-plinth {
  height: 31px;
  border: 3px solid #673c2f;
  border-top-color: #e8b16b;
  border-radius: 0;
  background: linear-gradient(90deg, #a3623d 0 7px, #bd7b4c 7px calc(100% - 7px), #9b5737 calc(100% - 7px));
  box-shadow: inset 0 3px #e6ae71, 0 3px #553c37;
}
.sakura-pixel .champion .podium-plinth { height: 47px; background: #d8994d; border-top-color: #ffdb85; }
.sakura-pixel .bronze .podium-plinth { height: 24px; background: #b86c48; }
.sakura-pixel .podium-plinth::before,
.sakura-pixel .podium-plinth::after,
.sakura-pixel .podium-plinth span { display: none; }
.sakura-pixel .podium-plinth b,
.sakura-pixel .champion .podium-plinth b {
  color: var(--metal-light);
  -webkit-text-fill-color: var(--metal-light);
  background: none;
  filter: none;
  text-shadow: 2px 2px #75462f;
  font: 700 23px / 1 'Ark Pixel', monospace;
}
.sakura-pixel .champion .podium-plinth b { font-size: 31px; }

.sakura-pixel .ranking {
  grid-area: 2 / 1 / 3 / 2;
  border: 4px solid #8c3f36;
  border-radius: 0;
  background: #fff9edf5;
  box-shadow: inset 0 0 0 2px #ffd88d, 4px 4px #633d3a;
  position: relative;
}
.sakura-pixel .ranking-heading {
  height: 44px;
  padding: 9px 20px;
  color: #fff1cc;
  background: linear-gradient(#c14b4e 0 4px, #a92f3e 4px calc(100% - 4px), #8c2535 calc(100% - 4px));
  border-bottom: 3px solid #d5a05c;
}
.sakura-pixel .ranking-heading h2 { color: #ffe5a0; font-size: 22px; letter-spacing: 3px; text-shadow: 2px 2px #6b2d30; }
.sakura-pixel .ranking-heading small { color: #f4c9aa; font-size: 8px; letter-spacing: 1px; text-shadow: none; }
.sakura-pixel .status { color: #fff1d0; font-size: 9px; }
.sakura-pixel .status i { width: 5px; height: 5px; border-radius: 0; background: #ffe499; box-shadow: 2px 2px #713c32; }
.sakura-pixel .table-head,
.sakura-pixel .rank-row { grid-template-columns: 70px minmax(0, 1fr) minmax(180px, 1fr) 160px; column-gap: 12px; padding: 0 26px; }
.sakura-pixel .table-head { height: 34px; background: #f0dfc8; border-color: #d1af8e; color: #624132; font-size: 13px; font-weight: 700; letter-spacing: 1px; }
.sakura-pixel .rank-row { border-color: #ddc3b3; }
.sakura-pixel .rank-row:nth-child(even) { background: #efdfcb3b; }
.sakura-pixel .rank-top { background: #fff0c03d; }
.sakura-pixel .rank-number { color: #81606d; gap: 5px; font-size: 12px; }
.sakura-pixel .rank-number b { font: 700 20px 'Ark Pixel', monospace; }
.sakura-pixel .rank-top .rank-number { color: #a43536; }
.sakura-pixel .rank-number > span { font-size: 12px; color: #c58a39; }
.sakura-pixel .rank-person { gap: 12px; }
.sakura-pixel .rank-person .xr-avatar {
  width: 35px;
  height: 35px;
  padding: 1px;
  border: 2px solid #9d6648;
  border-radius: 3px;
  background: #fff7e4;
  box-shadow: 2px 2px #d1b397;
  image-rendering: pixelated;
}
.sakura-pixel .rank-top .xr-avatar { border-color: #b86e36; box-shadow: 2px 2px #d5ae6b; }
.sakura-pixel .rank-person h3 { color: #28304b; font-size: 18px; font-weight: 700; line-height: 1.3; }
.sakura-pixel .rank-reason { color: #4a5d83; font-size: 16px; line-height: 1.3; letter-spacing: 0; -webkit-line-clamp: 2; }
.sakura-pixel .rank-top .rank-reason { color: #385279; }
.sakura-pixel .rank-tag,
.sakura-pixel .rank-person .rank-mobile-tag {
  color: #a3402d;
  -webkit-text-fill-color: currentColor;
  background: none;
  text-shadow: 1px 1px #ffe8bd;
  animation: none;
  font-family: 'Ark Pixel', 'Microsoft YaHei', sans-serif;
  font-weight: 700;
}
.sakura-pixel .rank-tag { font-size: 17px; border: 0; border-radius: 0; padding: 3px 7px; letter-spacing: 0; }
.sakura-pixel .rank-row:nth-child(3n + 2) .rank-tag,
.sakura-pixel .rank-row:nth-child(3n + 2) .rank-mobile-tag { color: #936326; }
.sakura-pixel .rank-row:nth-child(3n + 3) .rank-tag,
.sakura-pixel .rank-row:nth-child(3n + 3) .rank-mobile-tag { color: #3d6389; }
.sakura-pixel .table-foot { height: 24px; padding: 5px 18px; color: #85664d; background: #edddc5; border-color: #d0aa80; font-size: 8px; }
.sakura-pixel footer { width: calc(100% - 64px); max-width: 1100px; height: 22px; min-height: 22px; padding: 5px 9px; border-top: 0; color: #603d37; font-size: 8px; background: #fff0dfc7; }

/* Every dialog still uses the original interaction handlers. */
.sakura-pixel .xr-dialog {
  font-family: 'Ark Pixel', 'Microsoft YaHei', sans-serif;
  color: #29324c;
  background: #fff7e8;
  border: 4px solid #884636;
  border-radius: 0;
  box-shadow: inset 0 0 0 2px #eac47f, 5px 5px #5f3a39;
}
.sakura-pixel .xr-dialog::backdrop { background: #25314e8a; backdrop-filter: none; }
.sakura-pixel .xr-dialog h2 { color: #9d3540; }
.sakura-pixel .xr-dialog-head small { color: #9a6648; }
.sakura-pixel .xr-close { color: #795143; }
.sakura-pixel .xr-note { color: #7b6153; background: #ead7bd66; border-radius: 0; }
.sakura-pixel .xr-dialog input,
.sakura-pixel .xr-dialog select,
.sakura-pixel .xr-dialog textarea { color: #26334f; background: #fffdf6; border: 2px solid #b88b65; border-radius: 0; }
.sakura-pixel .xr-login-label,
.sakura-pixel .xr-link-label,
.sakura-pixel .xr-edit-fields label { color: #79503d; }
.sakura-pixel .xr-dialog-actions { background: #fff7e8; }
.sakura-pixel .xr-dialog-actions button { color: #79503d; border: 2px solid #b5875f; border-radius: 0; }
.sakura-pixel .xr-dialog-actions .xr-save,
.sakura-pixel #share-dialog .xr-share-primary { color: #fff9ee; border: 2px solid #823345; border-radius: 0; background: #ce5b7e; box-shadow: inset 2px 2px #efa6bb, 2px 2px #743d43; }
.sakura-pixel .xr-form-message { color: #a53e42; }
.sakura-pixel .xr-edit-row { border-color: #d2b396; }
.sakura-pixel .xr-order button { color: #faf0dc; border: 2px solid #74674d; background: #5b6983; border-radius: 0; }
.sakura-pixel .xr-upload { color: #966137; }
.sakura-pixel .xr-fields-head { color: #8b694c; }
.sakura-pixel #share-dialog { background-image: none; }
.sakura-pixel .xr-share-intro { color: #876b57; }
.sakura-pixel .xr-share-guide { border: 2px solid #d4ae85; border-radius: 0; background: #eedbc0; }
.sakura-pixel .xr-share-guide strong { color: #973d48; }
.sakura-pixel .xr-share-guide p { color: #735443; }
.sakura-pixel #share-dialog .xr-link-label { color: #79503d; }
.sakura-pixel #share-dialog .xr-ghost { color: #863546; border: 2px solid #ae795d; border-radius: 0; background: #fae8cc; }
.sakura-pixel .xr-share-link-wrap > small,
.sakura-pixel .xr-share-qr-caption { color: #83634e; }
.sakura-pixel .xr-toast { color: #fff9eb; border: 2px solid #f2cf97; border-radius: 0; background: #793d48f5; }

/* Desktop uses one continuous landscape behind the header and the podium. */
@media (min-width: 751px) {
  body.sakura-pixel {
    --fuji-peak-top: 84px;
    --landscape-width: max(100vw, calc((100svh - var(--fuji-peak-top)) * 2.292537));
    background-size: 100% 100%, var(--landscape-width) auto;
    background-position: center, center calc(var(--fuji-peak-top) - var(--landscape-width) * .126302);
  }
  .sakura-pixel .hero { background: transparent; }
  .sakura-pixel .fuji-scene { display: none; }
}

@media (min-width: 751px) and (max-height: 800px) {
  body.sakura-pixel { --fuji-peak-top: 78px; }
  .sakura-pixel .masthead { height: 58px; min-height: 58px; }
  .sakura-pixel .brand { padding-top: 5px; padding-bottom: 5px; font-size: 16px; }
  .sakura-pixel .brand-icon { width: 26px; height: 28px; font-size: 18px; clip-path: none; }
  .sakura-pixel #live-clock { padding: 7px 15px; font-size: 18px; }
  .sakura-pixel main { grid-template-rows: 166px minmax(0, 1fr); gap: 10px; }
  .sakura-pixel .hero-copy { padding-left: 27px; padding-top: 12px; padding-bottom: 12px; }
  .sakura-pixel .title-top { font-size: 40px; }
  .sakura-pixel .hero h1 { font-size: 41px; margin-top: 5px; }
  .sakura-pixel .hero-sub { font-size: 11px; margin-top: 10px; }
  .sakura-pixel .podium-scene { height: 136px; bottom: 10px; right: 22px; }
  .sakura-pixel .medal-shell { width: 42px; height: 42px; padding: 2px; }
  .sakura-pixel .champion .medal-shell { width: 53px; height: 53px; padding: 2px; }
  .sakura-pixel .medal-crown { width: 29px; height: 21px; top: -19px; }
  .sakura-pixel .medal-index { width: 16px; height: 16px; font-size: 10px; bottom: -6px; }
  .sakura-pixel .podium-person { margin-top: 9px; }
  .sakura-pixel .podium-person h3 { font-size: 15px; }
  .sakura-pixel .champion .podium-person h3 { font-size: 17px; }
  .sakura-pixel .podium-person p { font-size: 9px; margin: 3px 0 5px; }
  .sakura-pixel .podium-plinth { height: 23px; }
  .sakura-pixel .champion .podium-plinth { height: 34px; }
  .sakura-pixel .bronze .podium-plinth { height: 18px; }
  .sakura-pixel .podium-plinth b { font-size: 18px; }
  .sakura-pixel .champion .podium-plinth b { font-size: 24px; }
  .sakura-pixel .ranking-heading { height: 39px; }
  .sakura-pixel .ranking-heading h2 { font-size: 20px; }
  .sakura-pixel .table-head { height: 31px; }
  .sakura-pixel .rank-person .xr-avatar { width: 29px; height: 29px; }
  .sakura-pixel .rank-person h3 { font-size: 16px; }
  .sakura-pixel .rank-reason { font-size: 15px; line-height: 1.25; }
  .sakura-pixel .rank-tag { font-size: 16px; }
  .sakura-pixel .table-foot { height: 20px; }
}

@media (min-width: 751px) and (max-width: 1100px) {
  .sakura-pixel main { width: calc(100% - 50px); }
  .sakura-pixel .hero h1 { font-size: clamp(28px, 3.8vw, 40px); }
  .sakura-pixel .hero-copy { width: 32%; padding-left: 18px; }
  .sakura-pixel .table-head,
  .sakura-pixel .rank-row { grid-template-columns: 43px minmax(0, 1fr) minmax(145px, 1fr) 120px; gap: 10px; padding: 0 16px; }
  .sakura-pixel .table-head > span:last-child,
  .sakura-pixel .rank-tag { display: block; }
  .sakura-pixel .rank-person .rank-mobile-tag { display: none; }
  .sakura-pixel .rank-person h3 { font-size: 15px; }
  .sakura-pixel .rank-tag { font-size: 14px; }
}

@media (max-width: 750px) {
  body.sakura-pixel { background-position: center, 48% center; }
  .sakura-pixel .masthead { width: calc(100% - 16px); height: 55px; min-height: 55px; padding: 0 2px; gap: 6px; }
  .sakura-pixel .brand { min-width: 0; gap: 5px; padding: 5px 6px 5px 4px; border-width: 2px; font-size: 11px; letter-spacing: 0; box-shadow: inset 0 0 0 1px #cfa16b, 2px 2px #573a37; }
  .sakura-pixel .brand-icon { width: 20px; height: 23px; font-size: 15px; clip-path: none; }
  .sakura-pixel .brand small { font-size: 4px; letter-spacing: 1px; margin-top: 3px; }
  .sakura-pixel .edition { display: block; font-size: 0; }
  .sakura-pixel #live-clock { padding: 7px 7px; border-width: 2px; box-shadow: inset 0 0 0 1px #d6aa6d, 2px 2px #634232; font-size: 12px; letter-spacing: .5px; }
  .sakura-pixel .actions { gap: 5px; }
  .sakura-pixel .actions button { min-height: 31px; padding: 6px 6px; border-width: 2px; font-size: 9px; letter-spacing: 0; box-shadow: inset 1px 1px #ffadc1, inset -1px -1px #af3f68, 2px 2px #6c3944; }
  .sakura-pixel .actions .admin { gap: 3px; padding: 6px 6px; box-shadow: inset 1px 1px #8194bc, inset -1px -1px #253657, 2px 2px #634232; }
  .sakura-pixel .actions svg { width: 10px; height: 10px; }
  .sakura-pixel main { width: calc(100% - 18px); grid-template-columns: minmax(0, 1fr); grid-template-rows: 200px minmax(0, 1fr); padding: 0 0 8px; gap: 10px; }
  .sakura-pixel .hero { border-width: 2px; box-shadow: inset 0 0 0 1px #ffdc99, inset 0 0 0 3px #b56546, 2px 2px #613e3e; }
  .sakura-pixel .hero::before { inset: 5px; }
  .sakura-pixel .hero::after { display: none; }
  .sakura-pixel .fuji-scene { inset: 6px 6px auto; height: 100px; background-size: 145% auto; background-position: center 30%; mask-image: linear-gradient(#000 95%, transparent); }
  .sakura-pixel .hero-copy { position: absolute; left: 0; bottom: 7px; width: 53%; height: 89px; padding: 0 0 0 12px; justify-content: center; }
  .sakura-pixel .title-top { font-size: 32px; letter-spacing: 4px; margin-top: 0; }
  .sakura-pixel .hero h1 { font-size: 27px; line-height: 1.2; letter-spacing: 0; margin-top: 5px; }
  .sakura-pixel .title-top,
  .sakura-pixel .hero h1 { text-shadow: -1px -1px #794235, 1px -1px #794235, -1px 1px #794235, 1px 1px #794235, 0 2px #9c542e, 2px 3px #5b2c29; }
  .sakura-pixel .hero-sub { display: block; font-size: 8px; line-height: 1.3; letter-spacing: 0; padding: 4px 5px; margin-top: 8px; border-width: 1px; white-space: nowrap; }
  .sakura-pixel .podium-scene { width: 43%; height: 86px; right: 10px; bottom: 12px; gap: 2px; }
  .sakura-pixel .medal-shell { width: 28px; height: 28px; border-width: 2px; padding: 1px; border-radius: 0; box-shadow: inset 1px 1px var(--metal-light), 2px 2px #573c39; }
  .sakura-pixel .champion .medal-shell { width: 35px; height: 35px; border-width: 2px; padding: 1px; border-radius: 0; }
  .sakura-pixel .medal-crown { width: 24px; height: 18px; top: -17px; }
  .sakura-pixel .medal-index { width: 12px; height: 12px; bottom: -5px; border-width: 1px; font-size: 8px; box-shadow: 1px 1px #573c39; }
  .sakura-pixel .podium-person { margin-top: 8px; padding: 0; }
  .sakura-pixel .podium-person h3,
  .sakura-pixel .champion .podium-person h3 { font-size: 11px; line-height: 1.3; text-shadow: none; }
  .sakura-pixel .podium-person p { display: none; }
  .sakura-pixel .podium-plinth { height: 24px; margin-top: 7px; border-width: 2px; box-shadow: inset 0 2px #e6ae71, 0 2px #553c37; }
  .sakura-pixel .champion .podium-plinth { height: 35px; }
  .sakura-pixel .bronze .podium-plinth { height: 19px; }
  .sakura-pixel .podium-plinth b,
  .sakura-pixel .champion .podium-plinth b { font-size: 16px; }
  .sakura-pixel .ranking { border-width: 3px; box-shadow: inset 0 0 0 1px #ffd88d, 2px 2px #633d3a; }
  .sakura-pixel .ranking-heading { height: 39px; padding: 8px 10px; border-bottom-width: 2px; }
  .sakura-pixel .ranking-heading h2 { font-size: 15px; letter-spacing: 1px; gap: 4px; }
  .sakura-pixel .ranking-heading small { font-size: 6px; margin-left: 2px; }
  .sakura-pixel .status { font-size: 6px; gap: 3px; }
  .sakura-pixel .status i { width: 4px; height: 4px; }
  .sakura-pixel .table-head,
  .sakura-pixel .rank-row { grid-template-columns: 27px minmax(0, 1fr) 119px; column-gap: 5px; padding: 0 9px; }
  .sakura-pixel .table-head { height: 31px; font-size: 10.5px; letter-spacing: 0; }
  .sakura-pixel .table-head > span:last-child,
  .sakura-pixel .rank-tag { display: none; }
  .sakura-pixel .rank-number { gap: 1px; font-size: 8px; }
  .sakura-pixel .rank-number b { font-size: 16px; }
  .sakura-pixel .rank-number > span { font-size: 8px; }
  .sakura-pixel .rank-person { gap: 7px; }
  .sakura-pixel .rank-person .xr-avatar { width: 29px; height: 29px; border-width: 1px; border-radius: 0; box-shadow: 1px 1px #d1b397; }
  .sakura-pixel .rank-person h3 { font-size: 13px; line-height: 1.25; }
  .sakura-pixel .rank-person .rank-mobile-tag { display: block; margin-top: 3px; font-size: 10.5px; line-height: 1.2; letter-spacing: 0; }
  .sakura-pixel .rank-reason { font-size: 12.5px; line-height: 1.25; letter-spacing: 0; -webkit-line-clamp: 2; }
  .sakura-pixel .table-foot { height: 20px; padding: 4px 8px; font-size: 6px; }
  .sakura-pixel footer { width: calc(100% - 18px); height: 18px; min-height: 18px; padding: 4px 6px; font-size: 6px; line-height: 1.3; }
  .sakura-pixel footer > span:last-child { font-size: 5px; }
}

@media (max-width: 750px) and (max-height: 740px) {
  .sakura-pixel .masthead { height: 49px; min-height: 49px; }
  .sakura-pixel .brand { padding-top: 3px; padding-bottom: 3px; }
  .sakura-pixel #live-clock { padding-top: 5px; padding-bottom: 5px; }
  .sakura-pixel main { grid-template-rows: 185px minmax(0, 1fr); gap: 8px; }
  .sakura-pixel .fuji-scene { height: 94px; }
  .sakura-pixel .hero-copy { height: 81px; }
  .sakura-pixel .title-top { font-size: 30px; }
  .sakura-pixel .hero h1 { font-size: 25px; line-height: 1.1; margin-top: 4px; }
  .sakura-pixel .hero-sub { font-size: 7.5px; padding: 3px 5px; margin-top: 6px; }
  .sakura-pixel .podium-scene { height: 86px; bottom: 9px; }
  .sakura-pixel .medal-shell { width: 25px; height: 25px; }
  .sakura-pixel .champion .medal-shell { width: 31px; height: 31px; }
  .sakura-pixel .medal-crown { width: 21px; height: 15px; top: -14px; }
  .sakura-pixel .podium-person { margin-top: 7px; }
  .sakura-pixel .podium-person h3,
  .sakura-pixel .champion .podium-person h3 { font-size: 10px; }
  .sakura-pixel .podium-plinth { height: 18px; margin-top: 5px; }
  .sakura-pixel .champion .podium-plinth { height: 25px; }
  .sakura-pixel .bronze .podium-plinth { height: 14px; }
  .sakura-pixel .podium-plinth b,
  .sakura-pixel .champion .podium-plinth b { font-size: 13px; }
  .sakura-pixel .ranking-heading { height: 34px; }
  .sakura-pixel .table-head { height: 29px; }
  .sakura-pixel .rank-person .xr-avatar { width: 25px; height: 25px; }
  .sakura-pixel .rank-person h3 { font-size: 12px; }
  .sakura-pixel .rank-person .rank-mobile-tag { font-size: 10px; margin-top: 3px; }
  .sakura-pixel .rank-reason { font-size: 12px; }
  .sakura-pixel .table-foot { height: 18px; }
}

@media (max-width: 350px) {
  .sakura-pixel .masthead { gap: 4px; }
  .sakura-pixel .brand { font-size: 10px; padding-right: 4px; gap: 4px; }
  .sakura-pixel .brand-icon { width: 18px; height: 22px; }
  .sakura-pixel #live-clock { padding-left: 5px; padding-right: 5px; font-size: 11px; }
  .sakura-pixel .actions { gap: 4px; }
  .sakura-pixel .actions button,
  .sakura-pixel .actions .admin { padding-left: 4px; padding-right: 4px; font-size: 8px; }
  .sakura-pixel .hero h1 { font-size: 23px; }
  .sakura-pixel .hero-copy { padding-left: 10px; }
  .sakura-pixel .table-head,
  .sakura-pixel .rank-row { grid-template-columns: 23px minmax(0, 1fr) 105px; padding-left: 7px; padding-right: 7px; gap: 4px; }
  .sakura-pixel .rank-person { gap: 5px; }
}

@media (prefers-reduced-motion: reduce) {
  .sakura-pixel *, .sakura-pixel *::before, .sakura-pixel *::after { animation: none !important; transition: none !important; }
}