.scratch2000-modal.is-crt .scratch2000-star-stage {
    min-height: min(540px, calc(100dvh - 145px));
}

.scratch2000-modal.is-crt.has-result .scratch2000-star-stage {
    min-height: min(500px, calc(100dvh - 245px));
}

.scratch2000-modal.is-crt .scratch2000-prize-star {
    width: min(550px, 94vw);
    opacity: 0.3;
}

.scratch2000-crt-ticket {
    position: relative;
    width: min(512px, 92vw, calc(100dvh - 145px), 100%);
    aspect-ratio: 1;
    isolation: isolate;
    image-rendering: pixelated;
    -webkit-user-select: none;
    user-select: none;
}

.scratch2000-crt-art {
    position: relative;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    object-fit: contain;
    pointer-events: none;
}

.scratch2000-crt-screen {
    position: absolute;
    z-index: 2;
    left: 15.82%;
    top: 19.14%;
    width: 68.16%;
    height: 54.3%;
    display: grid;
    place-items: center;
    overflow: hidden;
    border-radius: 12% / 10%;
    pointer-events: none;
}

.scratch2000-crt-screen::before {
    content: "";
    position: absolute;
    inset: 0;
    background:
        repeating-linear-gradient(0deg, transparent 0 3px, rgba(10, 3, 40, 0.2) 3px 4px),
        radial-gradient(circle at 50% 42%, rgba(86, 234, 255, 0.08), rgba(32, 4, 69, 0.22));
    mix-blend-mode: screen;
    pointer-events: none;
}

.scratch2000-crt-game {
    position: relative;
    width: 71.63%;
    aspect-ratio: 1;
    pointer-events: auto;
}

.scratch2000-crt-grid {
    position: absolute;
    inset: 0;
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    grid-template-rows: repeat(3, 1fr);
    gap: 4%;
}

.scratch2000-crt-cell {
    --crt-match-color: var(--crt-symbol-color);
    position: relative;
    min-width: 0;
    min-height: 0;
    display: grid;
    place-items: center;
    background:
        linear-gradient(135deg, rgba(255, 84, 205, 0.17), rgba(74, 236, 242, 0.16)),
        rgba(20, 8, 58, 0.52);
    border: 1px dotted rgba(209, 162, 255, 0.62);
    box-shadow: inset 1px 1px 0 rgba(255, 255, 255, 0.12);
}

.scratch2000-crt-cell img {
    position: relative;
    z-index: 3;
    width: 58%;
    height: 58%;
    object-fit: contain;
    image-rendering: pixelated;
    filter: drop-shadow(2px 2px 0 var(--crt-symbol-color));
    transition: filter 160ms linear;
    pointer-events: none;
}

.scratch2000-crt-cell canvas {
    position: absolute;
    z-index: 4;
    inset: 0;
    width: 100%;
    height: 100%;
    cursor: crosshair;
    touch-action: none;
    -webkit-user-select: none;
    user-select: none;
    transition: opacity 150ms linear;
}

.scratch2000-crt-cell canvas:focus-visible {
    outline: 3px dashed #fff267;
    outline-offset: -5px;
}

.scratch2000-crt-cell.is-revealed canvas {
    opacity: 0;
}

.scratch2000-crt-cell.is-scratching {
    animation: scratch2000CrtScratchTap 140ms steps(2, end);
}

.scratch2000-crt-cell.is-matched img {
    filter: drop-shadow(3px 3px 0 var(--crt-match-color));
    animation: scratch2000CrtIconMatch 560ms cubic-bezier(0.2, 0.86, 0.32, 1.22) both;
}

.scratch2000-crt-cell.is-multi-match {
    animation: scratch2000CrtIntersectionBorder 1.4s steps(6, end) infinite;
}

.scratch2000-crt-cell.is-multi-match img {
    animation: scratch2000CrtIntersectionIcon 1.4s steps(6, end) infinite;
}

.scratch2000-crt-lines {
    position: absolute;
    z-index: 2;
    inset: 0;
    width: 100%;
    height: 100%;
    overflow: visible;
    pointer-events: none;
}

.scratch2000-crt-lines path {
    fill: none;
    stroke: var(--crt-line-color);
    stroke-width: 5;
    stroke-linecap: square;
    stroke-dasharray: 10 8;
    opacity: 0;
    filter: drop-shadow(2px 2px 0 rgba(17, 5, 51, 0.86));
    vector-effect: non-scaling-stroke;
}

.scratch2000-crt-lines path.is-active {
    opacity: 0.48;
}

.scratch2000-crt-lines path.is-celebrating {
    opacity: 1;
    stroke-dasharray: 24 180;
    animation: scratch2000CrtLineSweep 680ms steps(9, end) both;
}

.scratch2000-crt-jackpot {
    position: absolute;
    z-index: 7;
    left: 50%;
    top: 50%;
    width: 126%;
    padding: 5px 4px;
    box-sizing: border-box;
    color: #fff77d;
    background: #541278;
    border: 2px solid #35eef1;
    box-shadow: 3px 3px 0 #ff4fbf;
    font: 900 clamp(9px, 2.1vw, 16px)/1 'PixelOperatorMono', monospace;
    text-align: center;
    text-transform: uppercase;
    text-shadow: 2px 2px 0 #260d5a;
    transform: translate(-50%, -50%);
    pointer-events: none;
    animation: scratch2000CrtJackpot 1.4s steps(8, end) both;
}

.scratch2000-crt-jackpot[hidden] {
    display: none;
}

.scratch2000-crt-live {
    position: absolute;
    width: 1px;
    height: 1px;
    padding: 0;
    margin: -1px;
    overflow: hidden;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
    border: 0;
}

.scratch2000-crt-particle {
    position: absolute;
    z-index: 6;
    width: 3px;
    height: 3px;
    pointer-events: none;
    image-rendering: pixelated;
    animation: scratch2000CrtChip 360ms steps(5, end) forwards;
}

.scratch2000-crt-ticket.is-match-hit .scratch2000-crt-screen::after {
    content: "";
    position: absolute;
    z-index: 8;
    inset: 0;
    background:
        linear-gradient(90deg, transparent 0 30%, rgba(58, 244, 255, 0.25) 31% 34%, transparent 35%),
        repeating-linear-gradient(0deg, transparent 0 8px, rgba(255, 75, 200, 0.18) 8px 11px);
    mix-blend-mode: screen;
    pointer-events: none;
    animation: scratch2000CrtScreenHit 580ms steps(6, end) both;
}

.scratch2000-crt-ticket.is-jackpot-hit {
    animation: scratch2000CrtTicketJackpot 1.4s steps(8, end) both;
}

@keyframes scratch2000CrtScratchTap {
    0%, 100% {
        transform: translate(0);
    }
    50% {
        transform: translate(1px, 1px);
    }
}

@keyframes scratch2000CrtIconMatch {
    0%, 100% {
        transform: scale(1);
    }
    38% {
        transform: scale(1.23) rotate(-3deg);
    }
    66% {
        transform: scale(0.94) rotate(2deg);
    }
}

@keyframes scratch2000CrtLineSweep {
    from {
        stroke-dashoffset: 210;
    }
    to {
        stroke-dashoffset: 0;
    }
}

@keyframes scratch2000CrtIntersectionBorder {
    0%, 100% {
        border-color: #35e8f3;
        box-shadow: inset 0 0 0 2px #ff4fbd;
    }
    33% {
        border-color: #ffe35a;
        box-shadow: inset 0 0 0 2px #866aff;
    }
    66% {
        border-color: #74ef72;
        box-shadow: inset 0 0 0 2px #ff9654;
    }
}

@keyframes scratch2000CrtIntersectionIcon {
    0%, 100% {
        filter: drop-shadow(3px 3px 0 #35e8f3);
    }
    33% {
        filter: drop-shadow(3px 3px 0 #ff58c7);
    }
    66% {
        filter: drop-shadow(3px 3px 0 #ffe35a);
    }
}

@keyframes scratch2000CrtScreenHit {
    0% {
        opacity: 0;
        transform: translateX(-45%);
    }
    30% {
        opacity: 1;
    }
    100% {
        opacity: 0;
        transform: translateX(45%);
    }
}

@keyframes scratch2000CrtJackpot {
    0%, 100% {
        opacity: 0;
        transform: translate(-50%, -50%) scale(0.72);
    }
    18%, 75% {
        opacity: 1;
        transform: translate(-50%, -50%) scale(1.08);
    }
    45% {
        transform: translate(-50%, -50%) scale(0.96);
    }
}

@keyframes scratch2000CrtTicketJackpot {
    0%, 100% {
        filter: none;
        transform: translate(0);
    }
    20% {
        filter: hue-rotate(32deg) saturate(1.35);
        transform: translateX(-3px);
    }
    40% {
        filter: hue-rotate(-24deg) brightness(1.24);
        transform: translateX(3px);
    }
    60% {
        filter: hue-rotate(18deg) saturate(1.2);
        transform: translateX(-2px);
    }
}

@keyframes scratch2000CrtChip {
    0% {
        opacity: 1;
        transform: translate(0, 0);
    }
    100% {
        opacity: 0;
        transform: translate(var(--crt-chip-x), -14px);
    }
}

@media (max-width: 560px) {
    .scratch2000-modal.is-crt .scratch2000-star-stage {
        min-height: min(410px, calc(100dvh - 138px));
    }

    .scratch2000-modal.is-crt.has-result .scratch2000-star-stage {
        min-height: min(360px, calc(100dvh - 258px));
    }

    .scratch2000-crt-ticket {
        width: min(100%, 94vw, calc(100dvh - 140px));
    }
}

@media (max-height: 620px) {
    .scratch2000-modal.is-crt .scratch2000-star-stage {
        min-height: min(350px, calc(100dvh - 112px));
    }

    .scratch2000-crt-ticket {
        width: min(88vw, calc(100dvh - 120px), 100%);
    }
}

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

    .scratch2000-crt-cell.is-multi-match {
        border-color: #35e8f3;
        box-shadow: inset 0 0 0 2px #ff58c7;
    }

    .scratch2000-crt-cell.is-multi-match img {
        filter: drop-shadow(3px 3px 0 #ffe35a);
    }

    .scratch2000-crt-lines path.is-active {
        opacity: 0.68;
        stroke-dasharray: 10 8;
    }
}