.mobile-shell .mp-shell:is(.game-single_pana,.game-double_pana) {
  --sp-brand: var(--theme-primary,#007c76); --sp-deep: var(--theme-primary-deep,#00615d);
  --sp-ink: #173447; --sp-muted: #607581; --sp-surface: #fff;
  --sp-soft: color-mix(in srgb,var(--sp-brand) 7%,white);
  --sp-line: color-mix(in srgb,var(--sp-brand) 22%,white);
  --sp-shadow: color-mix(in srgb,var(--sp-deep) 12%,transparent);
  background: linear-gradient(var(--sp-soft),#f6f9fb); color: var(--sp-ink);
}
html[data-app-theme=neon] .mobile-shell .mp-shell:is(.game-single_pana,.game-double_pana) {
  --sp-ink: #e6f3fc; --sp-muted: #b4c7d6; --sp-surface: #142332;
  --sp-soft: #1a2d40; --sp-line: color-mix(in srgb,var(--sp-brand) 45%,#203043); background: #0e1824;
}
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-header { min-height: 56px; padding: 7px 10px !important; gap: 7px; border-radius: 0 0 17px 17px; background: radial-gradient(ellipse at 12% 0,#ffffff26,transparent 65%),linear-gradient(120deg,var(--sp-brand),var(--sp-deep)) !important; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-header h1 { font: 900 clamp(14px,4vw,18px)/1.15 Arial,sans-serif; white-space: normal; overflow-wrap: anywhere; color: white !important; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-back { width: 30px; height: 32px; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-wallet-pill { min-height: 32px !important; padding: 0 8px; font-size: 11px; background: color-mix(in srgb,var(--sp-deep) 78%,black); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-content { padding: 10px 10px 112px !important; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tabs { gap: 8px; padding: 0 0 10px; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tab { min-height: 43px; padding: 5px 8px; gap: 6px; border: 1px solid var(--sp-line); border-radius: 12px; color: var(--sp-ink); background: var(--sp-surface); box-shadow: 0 3px 8px var(--sp-shadow); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tab.active { color: white; border-color: transparent; background: linear-gradient(120deg,var(--sp-brand),var(--sp-deep)) !important; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tab.active strong,
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tab.active small { color: white !important; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tab strong { font-size: 11px; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-mode-tab small { margin-top: 2px; font-size: 9px; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-content > .mp-field-label { margin: 0 0 5px; font: 800 11px Arial,sans-serif; color: var(--sp-ink); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-select-box { min-height: 43px; margin-bottom: 10px; padding: 8px 10px; border: 1px solid var(--sp-line); border-radius: 11px; font-size: 13px; background: var(--sp-surface); color: var(--sp-ink); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-form { margin: 0 0 12px; padding: 10px; border: 1px solid var(--sp-line); border-radius: 15px; background: var(--sp-surface); box-shadow: 0 4px 12px var(--sp-shadow); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-fields { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 9px; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-field { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-field label { color: var(--sp-ink); font: 800 12px Arial,sans-serif; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-field input { width: 100%; min-width: 0; height: 44px; padding: 0 10px; border: 1px solid var(--sp-line); border-radius: 11px; color: var(--sp-ink); background: var(--sp-soft); font: 800 17px Arial,sans-serif; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-field input::placeholder { color: var(--sp-muted); opacity: 1; font-size: 12px; font-weight: 500; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-field input[aria-invalid=true] { border-color: #bb2f49 !important; color: #9b1631 !important; background: #fff0f3 !important; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-easy-field input:focus-visible { outline: 2px solid var(--sp-brand); outline-offset: 1px; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-feedback { margin: 7px 0 0; color: var(--sp-muted); font: 500 10px/1.45 Arial,sans-serif; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-feedback.error { padding: 6px 8px; border: 1px solid #efc4cd; border-radius: 8px; background: #fff0f3; color: #9b1631 !important; font-weight: 700; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-feedback.valid { color: var(--sp-brand); font-weight: 700; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-closed-note { padding: 7px 8px; margin: 8px 0 0; border-radius: 8px; color: #95421a; background: #fff3e7; font: 600 10px/1.45 Arial,sans-serif; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-add { width: 100%; min-height: 42px; margin: 10px 0 0; border: 0; border-radius: 11px; background: linear-gradient(120deg,var(--sp-brand),var(--sp-deep)) !important; color: white; font: 800 14px Arial,sans-serif; box-shadow: 0 3px 9px var(--sp-shadow); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .sp-add:disabled { opacity: .5; box-shadow: none; cursor: default; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-bottom-bar { min-height: 62px; padding: 8px 10px; gap: 12px; background: var(--sp-surface); color: var(--sp-muted); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-bottom-bar .mp-stat strong { color: var(--sp-ink); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .mp-submit-btn { min-height: 44px; border-radius: 12px; background: linear-gradient(120deg,var(--sp-brand),var(--sp-deep)) !important; }
html[data-app-theme=neon] .mobile-shell :is(.game-single_pana,.game-double_pana) .sp-feedback.valid { color: #a1f2d8; }
.mobile-shell :is(.game-single_pana,.game-double_pana) .pana-digit-filters {
  display: grid; grid-template-columns: 1.4fr repeat(10,minmax(0,1fr)); gap: 3px;
  padding: 5px; margin: 0 0 10px; border: 1px solid var(--sp-line); border-radius: 12px;
  background: var(--sp-surface);
}
.mobile-shell :is(.game-single_pana,.game-double_pana) .pana-digit-filter {
  min-width: 0; min-height: 32px; padding: 0; border: 1px solid transparent; border-radius: 8px;
  color: var(--sp-ink); background: var(--sp-soft); font: 800 11px Arial,sans-serif;
  cursor: pointer; transition: background-color .12s ease,transform .1s ease;
}
.mobile-shell :is(.game-single_pana,.game-double_pana) .pana-digit-filter.active {
  color: white; background: linear-gradient(120deg,var(--sp-brand),var(--sp-deep));
  box-shadow: 0 2px 5px var(--sp-shadow);
}
.mobile-shell :is(.game-single_pana,.game-double_pana) .pana-digit-filter:active { transform: scale(.95); }
.mobile-shell :is(.game-single_pana,.game-double_pana) .pana-digit-filter:focus-visible { outline: 2px solid var(--sp-brand); outline-offset: 1px; }
@media (prefers-reduced-motion: reduce) {
  .mobile-shell :is(.game-single_pana,.game-double_pana) .pana-digit-filter { transition: none; }
}
