.exam-workspace-shell {
    height: 100vh;
    height: 100dvh;
    position: relative;
    display: flex;
    flex-direction: column;
    overflow: hidden;
}

.exam-workspace-shell .app-header {
    position: relative;
    flex: 0 0 auto;
}

.exam-workspace-background {
    position: fixed;
    inset: 0;
    z-index: 0;
    background:
        radial-gradient(circle at 8% 10%, #ffe7f6 0, transparent 36%),
        radial-gradient(circle at 92% 90%, #e2edff 0, transparent 36%),
        linear-gradient(160deg, #fff8fc, #f6f3ff 50%, #f2f8ff);
}

.exam-workspace.juicy-theme {
    --ink: var(--exam-ink);
    --muted: var(--exam-muted);
    --line: var(--exam-border);
    --card: var(--exam-surface);
    --primary: var(--exam-primary);
    --primary-strong: var(--exam-primary-strong);
    --accent: var(--exam-accent);
    --mint: var(--exam-mint);

    flex: 1;
    min-height: 0;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    overflow: hidden;
    padding: .75rem;
    width: min(1540px, calc(100vw - 2rem));
    margin: 0 auto;
    color: var(--ink);
    display: grid;
    gap: .55rem;
    background: transparent;
    isolation: isolate;
}

.exam-workspace .ambient-layer {
    position: absolute;
    inset: 0;
    pointer-events: none;
}

.exam-workspace .mesh-a {
    inset: 12% 20%;
    border-radius: 26px;
    background: linear-gradient(120deg, rgba(255,255,255,.45), rgba(255,255,255,0));
    transform: rotate(-5deg);
}

.exam-workspace-context {
    position: relative;
    z-index: 1;
    display: flex;
    align-items: baseline;
    gap: .65rem;
    min-width: 0;
    padding: .05rem .2rem;
}

.exam-workspace-context > span {
    flex-shrink: 0;
    color: var(--primary-strong);
    font-size: .72rem;
    font-weight: 850;
}

.exam-workspace-context h1 {
    overflow: hidden;
    margin: 0;
    color: var(--ink);
    font-size: clamp(.98rem, .92rem + .28vw, 1.2rem);
    line-height: 1.3;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.exam-workspace .progress-stage,
.exam-workspace .question-stage-shell {
    position: relative;
    z-index: 1;
    border: 1px solid var(--line);
    background: var(--card);
    backdrop-filter: blur(12px);
    border-radius: 18px;
    box-shadow: var(--surface-shadow-raised);
}

.exam-workspace .progress-stage {
    height: 142px;
    padding: .58rem .75rem .7rem;
    display: grid;
    grid-template-rows: auto minmax(0, 1fr);
    gap: .48rem;
    overflow: hidden;
}

.exam-workspace .progress-toolbar { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: center; gap: .75rem; }
.exam-workspace .progress-summary { display: grid; min-width: 0; gap: .35rem; }
.exam-workspace .progress-header { display: flex; justify-content: space-between; flex-wrap: wrap; gap: .35rem; color: #5a5477; font-size: .84rem; }
.exam-workspace .progress-track { height: .55rem; background: #ece8fb; border-radius: 999px; overflow: hidden; }
.exam-workspace .progress-value { height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--accent), var(--primary), var(--mint)); transition: width .3s ease; }
.exam-workspace .progress-nav { display: grid; min-height: 0; }
.exam-workspace .timeline-grid { display: grid; grid-template-columns: repeat(25, minmax(0, 1fr)); gap: .32rem; overflow: auto; align-content: start; }

.exam-workspace .node {
    min-height: 1.72rem;
    border-radius: 10px;
    border: 1px solid #dbd2f7;
    background: #fff;
    color: #6a628a;
    font-weight: 700;
    transition: transform .14s ease, box-shadow .14s ease;
}

.exam-workspace .node:hover {
    transform: translateY(-1px);
    box-shadow: 0 8px 14px rgba(113, 81, 199, .16);
}

.exam-workspace .node.active {
    color: #fff;
    border-color: transparent;
    background: linear-gradient(180deg, var(--accent), var(--primary-strong));
    box-shadow: 0 8px 14px rgba(113, 81, 199, .25);
}

.exam-workspace .question-flow { display: grid; grid-template-columns: 1fr; min-height: 0; }
.exam-workspace .question-stage-shell { overflow: hidden; padding: .72rem .82rem; min-height: 0; display: grid; grid-template-rows: minmax(0, 1fr); gap: .55rem; }
.exam-workspace .question-stage-content { display: grid; align-content: start; gap: .58rem; min-height: 0; overflow: auto; padding-right: .12rem; }
.exam-workspace .question-title { margin: 0; font-size: clamp(1rem, .92rem + .38vw, 1.36rem); line-height: 1.45; white-space: pre-wrap; }
.exam-workspace .options { display: grid; gap: .42rem; }

.exam-workspace .option-card {
    border: 1px solid #e4dbfa;
    border-radius: 14px;
    background: linear-gradient(150deg, #fff, #fcf9ff);
    padding: .58rem .7rem;
    width: 100%;
    display: grid;
    grid-template-columns: 1.9rem 1fr;
    gap: .55rem;
    align-items: start;
}

.exam-workspace .option-index { width: 1.9rem; height: 1.9rem; border-radius: 50%; display: inline-flex; align-items: center; justify-content: center; font-weight: 700; color: #694ebf; background: #eee6ff; }
.exam-workspace .option-body { min-width: 0; }
.exam-workspace .option-text { line-height: 1.42; color: #4a4666; min-width: 0; }
.exam-workspace .mini-btn { border: 1px solid var(--button-soft-border); background: var(--button-soft-bg); border-radius: var(--button-radius); padding: .3rem .66rem; font-size: .9rem; font-weight: 800; color: var(--button-soft-text); transition: transform .16s ease, box-shadow .16s ease, border-color .16s ease; }
.exam-workspace .mini-btn:hover:not(:disabled) { transform: translateY(-1px); box-shadow: var(--button-primary-shadow); }
.exam-workspace .mini-btn.primary { background: var(--button-primary-bg); color: #fff; border-color: var(--button-primary-border); box-shadow: var(--button-primary-shadow); }
.exam-workspace button:disabled { opacity: .55; cursor: not-allowed; }

@media (max-height: 900px) and (min-width: 981px) {
    .exam-workspace.juicy-theme {
        padding: .55rem .75rem;
        gap: .45rem;
    }

    .exam-workspace .progress-stage {
        height: 126px;
        padding: .5rem .7rem;
        gap: .34rem;
    }

    .exam-workspace .timeline-grid {
        grid-template-columns: repeat(25, minmax(0, 1fr));
        gap: .26rem;
    }

    .exam-workspace .node {
        min-height: 1.54rem;
        border-radius: 9px;
    }

    .exam-workspace .question-stage-shell {
        padding: .62rem .75rem;
    }

    .exam-workspace .question-stage-content {
        gap: .46rem;
    }

    .exam-workspace .option-card {
        padding: .48rem .62rem;
    }
}

@media (max-width: 980px) {
    .exam-workspace.juicy-theme {
        width: calc(100vw - 1.25rem);
        gap: .45rem;
    }

    .exam-workspace .progress-stage { height: 164px; }
    .exam-workspace .timeline-grid { grid-template-columns: repeat(10, minmax(0, 1fr)); }
    .exam-workspace .node { min-height: 1.44rem; }
}

@media (max-width: 640px) {
    .exam-workspace.juicy-theme {
        padding: .5rem;
        width: calc(100vw - .8rem);
        gap: .38rem;
    }

    .exam-workspace .progress-stage {
        padding: .45rem .58rem;
        gap: .36rem;
    }

    .exam-workspace .timeline-grid { grid-template-columns: repeat(5, minmax(0, 1fr)); }
    .exam-workspace .mini-btn { flex: 1; }
    .exam-workspace .question-stage-shell { padding: .55rem .62rem; }
}
