.level-ritual-modal{box-sizing:border-box;isolation:isolate;width:min(620px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 24px);padding:22px 24px;overflow:auto;text-align:center;border:1px solid #c2a162;border-radius:18px;color:#f4e8d0;background:radial-gradient(ellipse at 50% 45%,#3d3152 0,#1b1727 40%,#0e1018 78%);box-shadow:0 24px 100px #000e,0 0 70px #d9b76522}
.level-ritual-modal::backdrop{background:#040611e8;backdrop-filter:blur(6px)}
.level-ritual-heading .eyebrow,.level-ritual-result .eyebrow{margin:0 0 8px;font-size:11px;letter-spacing:.17em;text-transform:uppercase;color:#d6b97f}
.level-ritual-modal h2{margin:0;font:700 clamp(26px,5vw,36px)/1.2 Georgia,serif;color:#ffebba}.level-character-name{margin:8px 0 0;font-size:17px;line-height:1.4;overflow-wrap:anywhere;color:#e5d5bd}
.level-ritual-scene{position:relative;isolation:isolate;width:min(100%,380px,52dvh);aspect-ratio:1;margin:12px auto 4px;overflow:hidden}
.level-avatar-frame{position:absolute;z-index:2;inset:16% 29%;overflow:hidden;border-radius:48% 48% 18% 18%;border:1px solid #d8b56b66;background:#0c0c15;box-shadow:0 0 30px #ffd98d33}
.level-avatar-frame img{display:block;width:100%;height:100%;object-fit:contain;mask-image:linear-gradient(#000 85%,transparent);-webkit-mask-image:linear-gradient(#000 85%,transparent)}
.level-rune-circle{position:absolute;z-index:3;inset:0;width:100%;height:100%;fill:none;stroke:#ffdf91;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;opacity:0;filter:drop-shadow(0 0 4px #efb44e);transform:scale(.9)}
.level-rune-circle path{stroke-width:2.2}.level-ring-dashes{stroke-dasharray:2 11;stroke-width:2.5}
.level-floor{position:absolute;z-index:1;left:10%;right:10%;bottom:6%;height:20%;border:2px solid #ecc576aa;border-radius:50%;background:radial-gradient(ellipse,#fff3c299,#efc26544 45%,transparent 72%);box-shadow:0 0 28px #ffcc7855;opacity:0;transform:scale(.65)}
.level-light-column{position:absolute;z-index:3;inset:0 18% 15%;transform:scaleY(0);transform-origin:50% 100%;opacity:0;clip-path:polygon(18% 0,82% 0,100% 100%,0 100%);background:linear-gradient(90deg,transparent,#ffdf8e11 18%,#fff6d98c 48%,#fffbea99 52%,#ffdf8e11 82%,transparent),linear-gradient(0deg,#fff1b988,transparent 90%);filter:blur(2px);pointer-events:none}
.level-sparks{position:absolute;z-index:4;inset:0;pointer-events:none}.level-sparks i{position:absolute;left:var(--spark-x);bottom:9%;width:3px;height:5px;border-radius:50%;background:#fff1bd;box-shadow:0 0 9px #ffe090;opacity:0}
.level-ritual-result{min-height:84px;visibility:hidden}.level-ritual-result h3{margin:0;font:700 clamp(23px,4vw,28px)/1.15 Georgia,serif;color:#eedac0}.level-ritual-result h3 strong{display:block;font-size:clamp(50px,9vw,68px);line-height:1.05;color:#ffe7a3;text-shadow:0 0 25px #e2b85166}.level-ritual-note{margin:10px auto 0;max-width:38ch;font-size:14px;line-height:1.5;color:#c7c4d0}
.level-ritual-modal>button{display:block;min-height:48px;min-width:180px;max-width:100%;margin:16px auto 0;padding:10px 24px;border:1px solid #e8c88b;border-radius:8px;background:linear-gradient(#e4c384,#ad803d);color:#251a0d;font-size:16px;font-weight:700;touch-action:manipulation}.level-ritual-modal>button:focus-visible{outline:3px solid #ffedbd;outline-offset:4px}
.level-ritual-modal.is-ascending .level-rune-circle{animation:level-runes-awaken 2.1s ease-out both}.level-ritual-modal.is-ascending .level-floor{animation:level-floor-glow 2.1s ease-out both}.level-ritual-modal.is-ascending .level-light-column{animation:level-light-rise 1.5s .6s ease-out both}.level-ritual-modal.is-ascending .level-sparks i{animation:level-spark-rise 1.6s calc(.6s + var(--spark-delay)) ease-out both}
.level-ritual-modal.is-revealed .level-rune-circle{animation:none;opacity:1;transform:none}.level-ritual-modal.is-revealed .level-floor{animation:none;opacity:1;transform:none}.level-ritual-modal.is-revealed .level-light-column{animation:none;transform:scaleY(1);opacity:.16}.level-ritual-modal.is-revealed .level-sparks i{animation:none;opacity:0}.level-ritual-modal.is-revealed .level-ritual-result{visibility:visible;animation:level-number-reveal .45s ease-out both}
@keyframes level-runes-awaken{0%{opacity:0;transform:scale(.9) rotate(-24deg)}35%{opacity:1}100%{opacity:1;transform:none}}
@keyframes level-floor-glow{0%{opacity:0;transform:scale(.65)}35%,100%{opacity:1;transform:none}}
@keyframes level-light-rise{0%{opacity:0;transform:scaleY(0)}35%{opacity:.9}70%{opacity:.65;transform:scaleY(1)}100%{opacity:.16;transform:scaleY(1)}}
@keyframes level-spark-rise{0%{opacity:0;transform:translateY(0)}20%{opacity:1}100%{opacity:0;transform:translateY(-240px)}}
@keyframes level-number-reveal{from{opacity:0;transform:translateY(12px) scale(.94)}to{opacity:1;transform:none}}
@media(max-width:480px){.level-ritual-modal{padding:18px 14px;width:calc(100vw - 16px);max-height:calc(100dvh - 16px)}.level-character-name{font-size:15px}.level-ritual-modal>button{width:100%}}
@media(max-height:560px) and (min-width:600px){.level-ritual-modal{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:8px 18px;padding:16px 20px}.level-ritual-modal:not([open]){display:none}.level-ritual-heading{grid-column:1/-1}.level-ritual-scene{grid-row:2/4;width:min(100%,52dvh);margin:0}.level-ritual-result{align-self:end}.level-ritual-modal>button{align-self:start;margin-top:4px}.level-ritual-note{font-size:12px}.level-character-name{margin-top:4px}}
@media(prefers-reduced-motion:reduce){.level-ritual-modal *{animation:none!important;transition:none!important}.level-ritual-modal .level-sparks{display:none}}