/* collectstatic supplies the final content hash for this nested stylesheet. */
@import url("./renaissance_font.35df14152d08.css");

.wm-level-summary-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 14px;
}

.wm-level-summary-header .wm-level-display {
    flex-shrink: 0;
}

.wm-level-recent {
    min-width: 0;
    margin-left: auto;
    color: var(--wm-mode-muted, #73798c);
    font-size: 13px;
    font-weight: 700;
    line-height: 1.5;
    text-align: right;
    overflow-wrap: anywhere;
}

.wm-level-display {
    display: inline-flex;
    max-width: 100%;
    align-items: center;
    gap: 10px;
    color: var(--wm-mode-violet, #483d8b);
    vertical-align: middle;
    white-space: nowrap;
}

.wm-level-label {
    font-family: inherit;
    font-size: 20px;
    font-weight: 700;
    line-height: 1.2;
    letter-spacing: 0;
}

.wm-level-badge {
    position: relative;
    isolation: isolate;
    display: inline-flex;
    overflow: hidden;
    box-sizing: border-box;
    flex: 0 0 auto;
    align-items: center;
    justify-content: center;
    min-width: 36px;
    min-height: 36px;
    padding: 2px 6px;
    border: 1px solid rgba(var(--wm-mode-violet-rgb, 103, 69, 183), 0.24);
    border-radius: 10px;
    color: var(--wm-mode-violet, #6745b7);
    background:
        radial-gradient(ellipse at 18% 0%, rgba(255, 255, 255, var(--wm-level-gloss, 0.32)), transparent 68%),
        linear-gradient(135deg, transparent 40%, rgba(166, 145, 234, 0.09) 68%, rgba(105, 218, 214, 0.12)),
        linear-gradient(145deg, var(--wm-mode-surface, #faf7ff), var(--wm-mode-soft, #eee7fb));
    box-shadow:
        inset 0 1px 0 rgba(255, 255, 255, 0.3),
        inset 0 -1px 0 rgba(var(--wm-mode-violet-rgb, 103, 69, 183), 0.08),
        0 2px 8px rgba(var(--wm-mode-violet-rgb, 103, 69, 183), 0.1);
    font-family: 'WMRenaissanceSecret', 'NanumMyeongjo', Batang, serif;
    font-size: 22px;
    font-weight: 700;
    font-style: normal;
    font-synthesis: weight;
    -webkit-text-stroke: 0.4px currentColor;
    line-height: 1;
    letter-spacing: 0;
    font-variant-numeric: tabular-nums;
    vertical-align: middle;
    white-space: nowrap;
}

/* The decorative sheen stays behind the numeral and cannot intercept input. */
.wm-level-badge::before {
    content: '';
    position: absolute;
    z-index: -1;
    pointer-events: none;
}

.wm-level-badge::before {
    inset: 0;
    background: linear-gradient(110deg, transparent 25%, rgba(255, 255, 255, var(--wm-level-sheen, 0.46)) 50%, transparent 75%);
    transform: translateX(-140%);
}

@media screen {
    html[data-wm-theme="dark"] .wm-level-badge {
        --wm-level-gloss: 0.12;
        --wm-level-sheen: 0.1;
    }
}

@keyframes wm-level-sheen {
    0% { transform: translateX(-140%); }
    25%, 100% { transform: translateX(140%); }
}

/* One second of sheen, then three seconds of rest; also works on touch screens. */
@media screen and (prefers-reduced-motion: no-preference) {
    .wm-level-badge::before {
        animation: wm-level-sheen 4s ease-out 1.5s infinite;
    }
}

@media (max-width: 639px) {
    .wm-level-label {
        font-size: 18px;
    }

    .wm-level-badge {
        min-width: 30px;
        min-height: 30px;
        padding-inline: 4px;
        border-radius: 9px;
        font-size: 20px;
    }
}

@media print, (forced-colors: active) {
    .wm-level-badge {
        background: none;
        box-shadow: none;
        border-color: currentColor;
    }

    .wm-level-badge::before {
        display: none;
        animation: none;
    }
}