/* prod1b (2026-10-08): 远程控制 B (visual gate) + D (WARN) + reward column. Loaded last. */
/* B1 phone Hero (UI CSS verbatim, <768px only) */
@media (max-width:767px){
.sq-hero-bg{bottom:auto;height:auto;aspect-ratio:4/5}
.sq-hero-inner{padding-top:62vw;padding-bottom:1.5rem}
.sq-hero-scrim{background:linear-gradient(180deg,rgba(16,17,20,0) 0,rgba(16,17,20,0) 46vw,rgba(16,17,20,.85) 64vw,var(--sq-bg,#101114) 78vw)!important}
.sq-hero-chip{display:none}
.sq-hero-cta-row{display:grid;grid-template-columns:1fr 1fr;gap:.5rem}
.sq-hero{--sq-bg:var(--sq-fade)} /* dark/black: = page bg (hsl(var(--background))); light: #101114 hero band (white hero text) */
}
/* D5: no 1px line under the Hero */
.sq-hero{border-bottom:0}
/* Rewards: reward next to the chip and may wrap; per-source claims as a muted line (table: under the source; card: under row 3) */
.code-claims{display:block;margin-top:.25rem;font-size:.75rem;line-height:1rem;white-space:normal}
@media (max-width:767px){
  section[aria-label="Code list"] tbody td:nth-child(2) > .code-reward{flex:1 1 0;min-width:0;overflow-wrap:anywhere}
  section[aria-label="Code list"] tbody td:nth-child(2) > .code-note{flex:0 0 100%}
  section[aria-label="Code list"] .code-card-claims{display:block;flex:0 0 100%;max-width:100%;margin-top:.25rem;font-size:.75rem;line-height:1rem;color:hsl(var(--muted-foreground));white-space:normal;overflow-wrap:anywhere}
}
@media (min-width:768px){ .code-card-claims{display:none} section[aria-label="Code list"] td:nth-child(3){white-space:normal} section[aria-label="Code list"] td:nth-child(1),section[aria-label="Code list"] td:nth-child(5){white-space:nowrap} }
/* D1: card row 3 wraps on narrow screens, no ellipsis */
@media (max-width:767px){
  section[aria-label="Code list"] .code-card-meta{white-space:normal;flex-wrap:wrap}
  section[aria-label="Code list"] .code-card-src{overflow:visible;text-overflow:clip;white-space:normal}
}
/* B3: light brand teal 173 60% 30% (#1f7a70); dark unchanged */
html:not(.dark){--brand-text:173 60% 30%}
html:not(.dark) .btn-primary{background-color:hsl(173 60% 30%)}
/* B4: light muted text ≈ #5b6b80 */
html:not(.dark){--muted-foreground:214 17% 43%}
/* C1 #4: dated Source cells wrap (no ellipsis); card shows Checked on its own line */
section[aria-label="Code list"] .code-card-meta{white-space:normal;flex-wrap:wrap}
section[aria-label="Code list"] .code-card-src{overflow:visible;text-overflow:clip;white-space:normal}
section[aria-label="Code list"] .code-card-checked{flex:0 0 100%;margin-top:.125rem}
section[aria-label="Code list"] .src-item{white-space:nowrap}
/* C1 #6: home card labels use --brand-text (as Loot) */
.core-path-action{color:hsl(var(--brand-text))}
/* C3 U4: claims line sits under the reward on desktop; phones show it as the card claims line instead */
@media (max-width:767px){section[aria-label="Code list"] td .code-claims{display:none}}
/* C3 U1: dark/black mode primary buttons: #101114 text on the teal (light unchanged) */
html.dark .btn-primary,html.dark .btn-primary:hover{color:#101114}
/* D1 #14: phone hero CTAs stack below 380px (same rule as Loot C3 U3) */
@media (max-width:379.98px){.sq-hero-cta-row{grid-template-columns:1fr}}
/* D1 #4: Expired Source cells keep each "Name · date" unbroken (same rule as the main code table) */
.codes-expired .src-item{white-space:nowrap}
/* E1 #2: Expired mobile cards show "Checked <date>" on its own line (span.code-card-checked, as the main code cards) instead of ", <date>"; desktop table unchanged */
.codes-expired .code-card-checked{display:none}
@media (max-width:767px){.codes-expired .code-card-checked{display:block;margin-top:.125rem}.codes-expired td:nth-child(4){display:none}}