.sacred-trial-page{
    position:relative;
    isolation:isolate;
    min-height:100vh;
    padding:118px var(--page-gutter) 90px;
    overflow:hidden;
}

.sacred-trial-page::before,
.sacred-trial-page::after{
    position:absolute;
    z-index:-1;
    width:360px;
    height:360px;
    border:1px solid rgba(231,201,112,.15);
    border-radius:50%;
    content:"";
    pointer-events:none;
}

.sacred-trial-page::before{ top:150px; left:-230px; box-shadow:0 0 90px rgba(75,163,255,.14); }
.sacred-trial-page::after{ right:-240px; bottom:80px; }

.sacred-trial-aura{
    position:absolute;
    z-index:-1;
    top:210px;
    left:50%;
    width:min(850px,100vw);
    height:560px;
    border-radius:50%;
    background:radial-gradient(ellipse,rgba(54,197,255,.16),rgba(7,54,88,.08) 46%,transparent 72%);
    filter:blur(8px);
    transform:translateX(-50%);
    pointer-events:none;
}

.sacred-trial-back{
    display:inline-flex;
    position:relative;
    z-index:2;
    align-items:center;
    padding:9px 14px;
    border:1px solid rgba(139,233,255,.2);
    border-radius:999px;
    background:rgba(2,18,34,.42);
    color:var(--primary-light);
    font-size:.87rem;
    text-decoration:none;
    backdrop-filter:blur(10px);
}

.sacred-trial-back:hover,
.sacred-trial-back:focus-visible{ border-color:rgba(139,233,255,.65); outline:none; }

.sacred-trial-heading{
    width:min(860px,100%);
    margin:12px auto 30px;
    text-align:center;
}

.sacred-trial-seal{
    display:grid;
    width:76px;
    height:76px;
    margin:0 auto 13px;
    place-items:center;
    border:1px solid rgba(231,201,112,.42);
    border-radius:50%;
    background:radial-gradient(circle,rgba(231,201,112,.15),rgba(12,67,105,.35));
    box-shadow:0 0 32px rgba(91,202,255,.2),inset 0 0 18px rgba(255,255,255,.06);
    font-size:2rem;
}

.sacred-trial-heading p,
.sacred-trial-kicker,
.sacred-trial-question-type{
    margin:0 0 10px;
    color:#e7c970;
    font-size:.72rem;
    font-weight:800;
    letter-spacing:.22em;
    text-transform:uppercase;
}

.sacred-trial-heading h1{
    margin:0;
    background:linear-gradient(180deg,#fff 8%,#c9f2ff 60%,#79d9f5);
    background-clip:text;
    color:transparent;
    font-size:clamp(2rem,6vw,4.3rem);
    letter-spacing:.08em;
    line-height:1.08;
    text-shadow:0 10px 38px rgba(41,187,239,.18);
}

.sacred-trial-stage{
    width:min(900px,100%);
    margin:auto;
}

.sacred-trial-stage.is-entering{ animation:sacred-trial-enter .38s ease both; }

.sacred-trial-panel{
    position:relative;
    overflow:hidden;
    padding:clamp(25px,5vw,52px);
    border:1px solid rgba(139,233,255,.25);
    border-radius:28px;
    background:
        radial-gradient(circle at 100% 0,rgba(75,163,255,.17),transparent 38%),
        linear-gradient(145deg,rgba(8,35,59,.9),rgba(3,18,33,.82));
    box-shadow:0 28px 80px rgba(0,0,0,.4),inset 0 1px rgba(255,255,255,.08);
    backdrop-filter:blur(22px);
}

.sacred-trial-intro{ max-width:760px; margin:auto; text-align:center; }
.sacred-trial-intro h2{ margin:0 auto 20px; font-size:clamp(1.55rem,4vw,2.45rem); line-height:1.25; }
.sacred-trial-intro > p:not(.sacred-trial-kicker){ max-width:620px; margin:0 auto 30px; color:var(--text-muted); font-size:1.06rem; line-height:1.75; }

.sacred-trial-primary,
.sacred-trial-secondary{
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-height:48px;
    padding:12px 23px;
    border-radius:999px;
    color:#fff;
    font:inherit;
    font-weight:800;
    text-decoration:none;
    cursor:pointer;
    transition:transform .2s,border-color .2s,box-shadow .2s,filter .2s;
}

.sacred-trial-primary{
    border:1px solid rgba(188,238,255,.55);
    background:linear-gradient(135deg,#287fc8,#1cb3d2);
    box-shadow:0 12px 34px rgba(15,151,213,.3),inset 0 1px rgba(255,255,255,.25);
}

.sacred-trial-secondary{ border:1px solid rgba(139,233,255,.28); background:rgba(93,194,237,.09); }
.sacred-trial-primary:hover:not(:disabled),
.sacred-trial-primary:focus-visible:not(:disabled),
.sacred-trial-secondary:hover:not(:disabled),
.sacred-trial-secondary:focus-visible:not(:disabled){ transform:translateY(-2px); border-color:#8be9ff; box-shadow:0 14px 34px rgba(15,151,213,.24); outline:none; }
.sacred-trial-primary:disabled,
.sacred-trial-secondary:disabled{ cursor:not-allowed; opacity:.45; }

.sacred-trial-progress-copy{ display:flex; justify-content:space-between; margin-bottom:9px; color:var(--text-muted); font-size:.82rem; font-weight:700; }
.sacred-trial-progress{ overflow:hidden; height:8px; margin-bottom:34px; border-radius:999px; background:rgba(255,255,255,.08); }
.sacred-trial-progress span{ display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#4ba3ff,#8be9ff,#e7c970); box-shadow:0 0 18px rgba(139,233,255,.45); transition:width .35s ease; }
.sacred-trial-question h2{ max-width:760px; margin:0 0 28px; font-size:clamp(1.35rem,3.5vw,2.05rem); line-height:1.32; }
.sacred-trial-options{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:13px; }

.sacred-trial-option{
    display:flex;
    align-items:center;
    gap:14px;
    min-height:68px;
    padding:13px 17px;
    border:1px solid rgba(255,255,255,.11);
    border-radius:16px;
    background:rgba(255,255,255,.045);
    color:var(--text);
    font:inherit;
    font-weight:700;
    text-align:left;
    cursor:pointer;
    transition:background .2s,border-color .2s,transform .2s;
}

.sacred-trial-option span{ display:grid; flex:0 0 34px; width:34px; height:34px; place-items:center; border:1px solid rgba(139,233,255,.25); border-radius:50%; color:var(--secondary); font-family:"Cinzel",serif; }
.sacred-trial-option:hover:not(:disabled),.sacred-trial-option:focus-visible:not(:disabled){ transform:translateY(-2px); border-color:rgba(139,233,255,.62); background:rgba(75,163,255,.12); outline:none; }
.sacred-trial-option.is-selected{ border-color:#8be9ff; background:linear-gradient(135deg,rgba(75,163,255,.22),rgba(139,233,255,.09)); box-shadow:0 0 0 2px rgba(139,233,255,.08); opacity:1; }
.sacred-trial-option.is-selected span{ background:#8be9ff; color:#052039; }
.sacred-trial-next{ display:flex; margin:26px 0 0 auto; }

.sacred-trial-results{ text-align:center; }
.sacred-trial-score{ display:flex; align-items:baseline; justify-content:center; gap:8px; color:#e7c970; }
.sacred-trial-score strong{ font-family:"Cinzel",serif; font-size:clamp(4rem,11vw,7rem); line-height:1; text-shadow:0 0 28px rgba(231,201,112,.25); }
.sacred-trial-score span{ color:var(--text-muted); font-size:1.4rem; }
.sacred-trial-results > h2{ margin:7px 0 30px; color:var(--primary-light); font-size:clamp(1.65rem,4vw,2.6rem); }

.sacred-trial-reaction{ display:grid; grid-template-columns:minmax(190px,.72fr) minmax(0,1.28fr); align-items:center; gap:22px; margin:0 auto 35px; padding:22px; border:1px solid rgba(139,233,255,.18); border-radius:23px; background:rgba(2,18,33,.48); text-align:left; }
.sacred-trial-reaction.is-happy{ box-shadow:inset 0 0 44px rgba(76,211,255,.09),0 0 36px rgba(76,211,255,.08); }
.sacred-trial-reaction.is-angry{ border-color:rgba(255,145,123,.26); background:linear-gradient(135deg,rgba(52,23,31,.48),rgba(2,18,33,.55)); }
.sacred-trial-sprite-wrap{ display:grid; min-height:230px; place-items:end center; }
.sacred-trial-sprite{ width:auto; max-width:100%; height:auto; max-height:270px; object-fit:contain; filter:drop-shadow(0 15px 18px rgba(0,0,0,.35)); }
.is-happy .sacred-trial-sprite{ animation:sacred-trial-happy 2.4s ease-in-out infinite; }
.is-perfect .sacred-trial-sprite{ animation:sacred-trial-perfect 1.05s cubic-bezier(.2,.8,.25,1) both,sacred-trial-happy 2.4s 1.05s ease-in-out infinite; }
.is-angry .sacred-trial-sprite{ animation:sacred-trial-angry .38s ease both; }
.sacred-trial-dialogue{ position:relative; padding:24px; border:1px solid rgba(255,255,255,.14); border-radius:20px; background:rgba(242,251,255,.94); color:#09213a; box-shadow:0 12px 30px rgba(0,0,0,.25); font-size:1.02rem; line-height:1.65; overflow-wrap:anywhere; }
.sacred-trial-dialogue::before{ position:absolute; top:44%; left:-13px; width:24px; height:24px; border-left:1px solid rgba(255,255,255,.14); border-bottom:1px solid rgba(255,255,255,.14); background:rgba(242,251,255,.94); content:""; transform:rotate(45deg); }
.sacred-trial-dialogue p{ position:relative; margin:0; }
.sacred-trial-recommendation{ margin-top:14px!important; padding-top:14px; border-top:1px solid rgba(9,33,58,.14); }

.sacred-trial-summary{ padding-top:4px; text-align:left; }
.sacred-trial-summary h3{ margin:0 0 7px; font-size:1.45rem; }
.sacred-trial-summary > p{ margin:0 0 19px; color:var(--text-muted); }
.sacred-trial-summary ol{ display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:9px; margin:0; padding:0; list-style:none; }
.sacred-trial-summary li{ display:flex; justify-content:space-between; gap:10px; padding:11px 14px; border:1px solid rgba(255,255,255,.08); border-radius:12px; background:rgba(255,255,255,.035); }
.sacred-trial-summary .is-correct strong{ color:#87f2c2; }
.sacred-trial-summary .is-incorrect strong{ color:#ff9f9f; }
.sacred-trial-actions{ display:flex; flex-wrap:wrap; justify-content:center; gap:10px; margin-top:28px; }
.sacred-trial-share-status{ min-height:1.5em; margin:14px 0 0; color:var(--primary-light); font-size:.88rem; }

@keyframes sacred-trial-enter{ from{ opacity:0; transform:translateY(14px) scale(.99); } to{ opacity:1; transform:none; } }
@keyframes sacred-trial-happy{ 0%,100%{ transform:translateY(0) rotate(-1deg); } 50%{ transform:translateY(-7px) rotate(1deg); } }
@keyframes sacred-trial-perfect{ 0%{ opacity:0; transform:translateY(18px) scale(.88); } 65%{ opacity:1; transform:translateY(-8px) scale(1.04); } 100%{ transform:none; } }
@keyframes sacred-trial-angry{ 0%{ opacity:0; transform:translateX(18px) rotate(2deg); } 65%{ transform:translateX(-4px) rotate(-1deg); } 100%{ opacity:1; transform:none; } }

@media (max-width:700px){
    .sacred-trial-page{ padding-top:100px; padding-bottom:calc(var(--mobile-nav-height) + 36px); }
    .sacred-trial-back{ font-size:.8rem; }
    .sacred-trial-heading{ margin-top:20px; }
    .sacred-trial-seal{ width:62px; height:62px; }
    .sacred-trial-options{ grid-template-columns:1fr; }
    .sacred-trial-option{ min-height:62px; }
    .sacred-trial-next{ width:100%; }
    .sacred-trial-reaction{ grid-template-columns:1fr; padding:17px; }
    .sacred-trial-sprite-wrap{ min-height:190px; }
    .sacred-trial-sprite{ max-height:220px; }
    .sacred-trial-dialogue::before{ top:-12px; left:calc(50% - 12px); transform:rotate(135deg); }
    .sacred-trial-summary ol{ grid-template-columns:repeat(2,minmax(0,1fr)); }
    .sacred-trial-actions > *{ width:100%; }
}

@media (max-width:420px){
    .sacred-trial-page{ --page-gutter:14px; }
    .sacred-trial-panel{ border-radius:21px; }
    .sacred-trial-summary ol{ grid-template-columns:1fr; }
}

@media (prefers-reduced-motion:reduce){
    .sacred-trial-stage.is-entering,
    .is-happy .sacred-trial-sprite,
    .is-perfect .sacred-trial-sprite,
    .is-angry .sacred-trial-sprite{ animation:none; }
    .sacred-trial-progress span{ transition:none; }
}

