/* Authored CSS: deliberately separate from the legacy Sass build. */
.ctc-fever {
    position: fixed;
    inset: 0;
    z-index: 2147483646;
    overflow: hidden;
    pointer-events: none;
    contain: layout paint style;
}
.ctc-fever[hidden] { display: none; }
.ctc-fever *, .ctc-fever *::before, .ctc-fever *::after { pointer-events: none; }
.ctc-fever__canvas { position: absolute; inset: 0; width: 100%; height: 100%; }
.ctc-fever__band { position: absolute; left: 0; width: 100%; max-height: min(11vh, 88px); overflow: hidden; }
.ctc-fever__band--top { top: env(safe-area-inset-top, 0px); }
.ctc-fever__band--bottom { bottom: env(safe-area-inset-bottom, 0px); }
.ctc-fever__track { display: flex; width: max-content; }
.ctc-fever__track img { transform-origin: center center; will-change: transform; display: block; flex: none; height: auto; max-height: min(11vh, 88px); }

.ctc-fever-reward {
    position: fixed;
    inset: 0;
    z-index: 2147483647;
    display: flex;
    align-items: center;
    justify-content: center;
    background: transparent;
    pointer-events: none;
    color: #050505;
    font-weight: 900;
}
.ctc-fever-reward__frame { position: relative; transform-origin: center bottom; }
.ctc-fever-reward__layout {
    width: 650px;
    height: 297px;
    display: grid;
    grid-template-columns: 176px 450px;
    gap: 24px;
    transform: scale(var(--fever-result-scale));
    transform-origin: left top;
}
.ctc-fever-reward__character { display: block; width: 176px; height: auto; }
.ctc-fever-reward__messages { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; }
.ctc-fever-reward__heading, .ctc-fever-reward__card {
    border: 1.5px solid #050505;
    border-radius: 20px;
    background: rgb(255 255 255 / 94%);
    box-sizing: border-box;
}
.ctc-fever-reward__heading { margin: 0; padding: 22px 30px; font-size: 24px; line-height: 36px; }
.ctc-fever-reward__card { width: 450px; padding: 26px 28px; display: flex; flex-direction: column; gap: 12px; }
.ctc-fever-reward__copy { margin: 0; font-size: 24px; line-height: 36px; }
/* Match the existing quiz/result exclamation typography. */
.ctc-fever-reward__copy .exclamation {
    font-family: "Noto Sans", sans-serif !important;
    font-optical-sizing: auto;
    font-weight: 900 !important;
    font-style: italic;
}
.ctc-fever-reward__award { display: flex; align-items: center; justify-content: space-between; gap: 8px; }
.ctc-fever-reward__label { flex: none; font-size: 19px; line-height: 1.3; font-style: italic; }
.ctc-fever-reward__ticket { display: block; width: 108px; height: auto; }
.ctc-fever-reward__amount { display: flex; align-items: baseline; gap: 4px; white-space: nowrap; }
.ctc-fever-reward__multiply { font-size: 38px; line-height: 1; }
.ctc-fever-reward__amount strong { font-size: 88px; line-height: 1.1; font-weight: 900; letter-spacing: -0.04em; }
.ctc-fever-reward__unit { font-size: 36px; line-height: 1; }

/* Local/staging only: invisible tap target directly below the zoom buttons. */
.ctc-fever-debug-target {
    position: absolute;
    top: 100%;
    right: 0;
    width: max(44px, 100%);
    height: 44px;
    margin-top: 10px;
}
.ctc-fever-debug-button {
    display: block;
    width: 100%;
    height: 100%;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: transparent;
    appearance: none;
    cursor: pointer;
    touch-action: manipulation;
    -webkit-tap-highlight-color: transparent;
}
.ctc-fever-debug-button:focus { outline: none; }
.ctc-fever-debug-button:focus-visible { outline: 2px dashed #111; outline-offset: 2px; }
@media (max-width: 786px), (any-pointer: coarse) and (orientation: portrait) {
    .ctc-fever-debug-target { width: max(44px, 11.2821vw); height: max(44px, 11.2821vw); }
}
