#spotDifferenceGame {
  --abz-game-type-display: 64px;
  --abz-game-type-screen-title: 38px;
  --abz-game-type-card-title: 23px;
  --abz-game-type-body: 16px;
  --abz-game-type-control: 16px;
  --abz-game-type-caption: 12px;
}
#spotDifferenceGame [data-abz-type="display"] { font-size: var(--abz-game-type-display); }
#spotDifferenceGame [data-abz-type="screen-title"] { font-size: var(--abz-game-type-screen-title); }
#spotDifferenceGame [data-abz-type="card-title"] { font-size: var(--abz-game-type-card-title); }
#spotDifferenceGame [data-abz-type="body"] { font-size: var(--abz-game-type-body); }
#spotDifferenceGame [data-abz-type="control"] { font-size: var(--abz-game-type-control); }
#spotDifferenceGame [data-abz-type="caption"] { font-size: var(--abz-game-type-caption); }

#stdCustomSetsMount { margin: 2px 0 24px; }
#stdCustomSetsMount:empty { display: none; }
.std-custom-panel {
  padding: clamp(18px, 3vw, 24px);
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 24px;
  background: linear-gradient(145deg, oklch(.79 .12 150 / .12), rgba(255,255,255,.025));
  box-shadow: inset 0 1px 0 rgba(255,255,255,.08);
}
.std-custom-panel__head { display:flex; align-items:center; justify-content:space-between; gap:18px; }
.std-custom-eyebrow { margin:0 0 5px; color:oklch(.86 .13 150); font:600 11px/1.2 'IBM Plex Mono',monospace; letter-spacing:.16em; text-transform:uppercase; }
.std-custom-panel h3 { margin:0 0 5px; color:#f6efe4; font:700 22px/1.15 'Gabarito',sans-serif; }
.std-custom-panel p { margin:0; color:#a89b89; font-size:14px; line-height:1.5; }
.std-custom-primary,
.std-custom-secondary,
.std-custom-card button {
  min-height:48px;
  border-radius:14px;
  padding:10px 16px;
  border:1px solid rgba(255,255,255,.15);
  color:#f6efe4;
  background:rgba(255,255,255,.055);
  font:700 15px/1.2 'Work Sans',sans-serif;
  cursor:pointer;
}
.std-custom-primary { border:0; color:#12100e; background:oklch(.84 .15 95); }
.std-custom-primary:focus-visible,
.std-custom-secondary:focus-visible,
.std-custom-card button:focus-visible,
.std-custom-modal button:focus-visible,
.std-custom-modal input:focus-visible,
.std-custom-modal textarea:focus-visible { outline:3px solid #fff; outline-offset:3px; }
.std-custom-grid { display:grid; grid-template-columns:repeat(auto-fit,minmax(235px,1fr)); gap:12px; margin-top:17px; }
.std-custom-card { min-width:0; padding:16px; border:1px solid rgba(255,255,255,.11); border-radius:18px; background:rgba(18,16,14,.62); }
.std-custom-card h4 { margin:0 0 6px; color:#f6efe4; font:700 18px/1.2 'Gabarito',sans-serif; overflow-wrap:anywhere; }
.std-custom-card__meta { font-size:12.5px !important; }
.std-custom-card__actions { display:flex; flex-wrap:wrap; gap:8px; margin-top:13px; }
.std-custom-card__actions button { min-height:44px; padding:8px 12px; font-size:13px; }
.std-custom-card__actions .is-danger { color:#ffd7cf; border-color:rgba(255,135,110,.28); background:rgba(255,105,80,.08); }
.std-custom-state { margin-top:16px !important; padding:14px 15px; border:1px dashed rgba(255,255,255,.16); border-radius:15px; }
.std-custom-state[data-tone="error"] { color:#ffd0c6; border-color:rgba(255,120,96,.4); }

.std-custom-modal[hidden] { display:none !important; }
.std-custom-modal { position:fixed; inset:0; z-index:2147483600; display:grid; place-items:center; padding:clamp(8px,2.4vw,22px); background:rgba(10,8,7,.86); backdrop-filter:blur(10px); color:#f6efe4; font-family:'Work Sans',sans-serif; }
.std-custom-dialog { position:relative; display:grid; grid-template-rows:auto minmax(0,1fr) auto; width:min(900px,100%); max-height:min(94vh,980px); overflow:hidden; border:1px solid rgba(255,255,255,.16); border-radius:26px; background:#17130f; box-shadow:0 38px 110px rgba(0,0,0,.68); }
.std-custom-dialog__head,
.std-custom-dialog__foot { padding:18px clamp(17px,3vw,25px); background:#1b1713; }
.std-custom-dialog__head { display:flex; justify-content:space-between; align-items:flex-start; gap:18px; border-bottom:1px solid rgba(255,255,255,.1); }
.std-custom-dialog__head p { margin:0 0 5px; color:oklch(.86 .13 150); font:600 11px/1.2 'IBM Plex Mono',monospace; letter-spacing:.15em; text-transform:uppercase; }
.std-custom-dialog__head h2 { margin:0; font:700 clamp(25px,4vw,36px)/1 'Gabarito',sans-serif; }
.std-custom-dialog__close { width:48px; height:48px; flex:0 0 auto; border:1px solid rgba(255,255,255,.16); border-radius:15px; color:#f6efe4; background:rgba(255,255,255,.05); font-size:25px; cursor:pointer; }
.std-custom-dialog__body { overflow:auto; padding:22px clamp(17px,3vw,25px); scroll-behavior:smooth; }
.std-custom-dialog__foot { display:flex; justify-content:flex-end; gap:10px; border-top:1px solid rgba(255,255,255,.1); }
.std-custom-form label { display:grid; gap:7px; margin:0 0 16px; color:#e7ddd0; font-weight:700; }
.std-custom-form input[type="text"],
.std-custom-form textarea { width:100%; min-height:48px; box-sizing:border-box; padding:12px 13px; border:1px solid rgba(255,255,255,.17); border-radius:12px; color:#fff; background:rgba(255,255,255,.055); font:16px/1.4 'Work Sans',sans-serif; }
.std-custom-form textarea { min-height:78px; resize:vertical; }
.std-custom-question { margin:18px 0; padding:18px; border:1px solid rgba(255,255,255,.12); border-radius:18px; background:rgba(255,255,255,.03); }
.std-custom-question__head { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-bottom:15px; }
.std-custom-question__head strong { font:700 18px/1.2 'Gabarito',sans-serif; }
.std-custom-question__remove { min-height:44px; border:0; color:#ffbaad; background:transparent; font:700 14px/1.2 inherit; cursor:pointer; }
.std-custom-choice { display:grid !important; grid-template-columns:28px minmax(0,1fr); align-items:center; gap:10px !important; margin-bottom:10px !important; }
.std-custom-choice input[type="radio"] { width:22px; height:22px; accent-color:oklch(.84 .15 95); }
.std-custom-error { min-height:1.5em; margin:10px 0 0; color:#ffb9aa; font-weight:700; }
.std-custom-scroll-tools { position:absolute; right:8px; top:50%; z-index:2; display:none; gap:7px; translate:0 -50%; }
.std-custom-scroll-tools[data-visible="true"] { display:grid; }
.std-custom-scroll-tools button { width:48px; height:48px; border:1px solid rgba(255,255,255,.18); border-radius:50%; color:#f6efe4; background:#241e18; cursor:pointer; }
body.std-custom-modal-open { overflow:hidden; }

@media (max-width:700px) {
  #spotDifferenceGame { --abz-game-type-display:48px; --abz-game-type-screen-title:32px; --abz-game-type-card-title:21px; }
  .std-custom-panel__head { align-items:flex-start; flex-direction:column; }
  .std-custom-dialog { max-height:97vh; border-radius:20px; }
  .std-custom-dialog__foot { flex-direction:column-reverse; }
  .std-custom-dialog__foot button { width:100%; }
  .std-custom-scroll-tools { right:4px; }
}

@media (prefers-reduced-motion:reduce) {
  .std-custom-dialog__body { scroll-behavior:auto; }
}
