.spot-difference-game,.spot-difference-main{gap:1rem;min-width:0;display:grid}.spot-difference-game>*{margin-block:0}.spot-difference-game button{border:1px solid color-mix(in srgb, currentColor 28%, transparent);background:var(--surface,#fff);min-height:44px;color:inherit;cursor:pointer;border-radius:.75rem;padding:.65rem .85rem}.spot-difference-game button[aria-pressed=true]{border-color:#316b5f;box-shadow:inset 0 0 0 2px #76c8ad}.spot-difference-game button:disabled{cursor:not-allowed;opacity:.5}.spot-difference-game button:focus-visible,.spot-difference-game canvas:focus-visible{outline-offset:3px;outline:3px solid #236b5c}.spot-difference-stage{background:linear-gradient(145deg,#dff7f1,#e6ecff);border-radius:1rem;min-height:420px;position:relative;overflow:hidden}.spot-difference-stage canvas{width:100%;height:clamp(420px,58vw,680px);touch-action:none;background:#dcebf7;min-block-size:280px;display:block}.spot-difference-overlays{pointer-events:none;display:grid;position:absolute;inset:0}.spot-difference-stage[data-compare-layout=horizontal] .spot-difference-overlays{grid-template-columns:repeat(2,minmax(0,1fr))}.spot-difference-stage[data-compare-layout=vertical] .spot-difference-overlays{grid-template-rows:repeat(2,minmax(0,1fr))}.spot-difference-comparison-overlay{min-width:0;min-height:0;position:relative;overflow:hidden}.spot-difference-broad-region{background:#ffd34a3d;border:3px dashed #7a3e00;border-radius:1rem;width:50%;height:50%;position:absolute;box-shadow:inset 0 0 0 2px #ffffffe0,0 0 0 2px #7a3e00b8}.spot-difference-broad-region[data-broad-region=upper-left]{inset:0 auto auto 0}.spot-difference-broad-region[data-broad-region=upper-right]{inset:0 0 auto auto}.spot-difference-broad-region[data-broad-region=lower-left]{inset:auto auto 0 0}.spot-difference-broad-region[data-broad-region=lower-right]{inset:auto 0 0 auto}.spot-difference-broad-region[data-broad-region=center]{inset:25%}.spot-difference-wrong-ripple{border:.28rem solid #b00020;border-radius:50%;width:2.5rem;height:2.5rem;animation:.7s ease-out both spot-difference-wrong-ripple;position:absolute;translate:-50% -50%;box-shadow:0 0 0 .18rem #fff}.spot-difference-wrong-ripple:before,.spot-difference-wrong-ripple:after{content:"";background:#b00020;border-radius:999px;height:.2rem;position:absolute;inset:50% 17% auto;rotate:45deg}.spot-difference-wrong-ripple:after{rotate:-45deg}@keyframes spot-difference-wrong-ripple{0%{opacity:1;scale:.7}to{opacity:.35;scale:1.15}}.spot-difference-stage [role=status]{background:#ffffffe6;border-radius:999px;padding:.8rem 1rem;position:absolute;inset:50% auto auto 50%;translate:-50% -50%}.spot-difference-hud{gap:.75rem;min-width:0;display:grid}.spot-difference-status,.spot-difference-mode,.spot-difference-controls,.spot-difference-levels,.spot-difference-dialog-actions{flex-wrap:wrap;align-items:center;gap:.55rem;display:flex}.spot-difference-status{background:#76c8ad29;border-radius:.8rem;justify-content:space-between;padding:.8rem}.spot-difference-levels{max-width:100%}.spot-difference-levels button{flex:5.7rem}.spot-difference-feedback{min-height:1.5em;font-weight:650}.spot-difference-dialog-backdrop{z-index:50;background:#0e19209e;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}body:has(.spot-difference-dialog-backdrop) .ad-slot{visibility:hidden}.spot-difference-dialog{background:var(--surface,#fff);width:min(34rem,100%);max-height:min(80vh,42rem);color:var(--text,#18242b);border-radius:1rem;padding:1.25rem;overflow:auto;box-shadow:0 1.2rem 3rem #00000040}.spot-difference-dialog-actions a{border:1px solid;border-radius:.75rem;align-items:center;min-height:44px;padding:.65rem .85rem;display:inline-flex}@media (width<=767px){.spot-difference-stage{min-height:360px}.spot-difference-stage canvas{height:clamp(360px,145vw,720px);min-block-size:360px}.spot-difference-status>*{flex:45%}}@media (prefers-reduced-motion:reduce){.spot-difference-game *,.spot-difference-dialog-backdrop{scroll-behavior:auto!important;transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}}
