/*
  COLLEGE ESSAY GRADER — Supplemental stylesheet (build 2026-10-27.u5)

  Generated by `node tools/ivy-loader-build.mjs` from:
    snippets/ivy-supplemental-frontend.html

  Do not edit by hand: the next build overwrites it, and `tests/uc-piq-loader.test.mjs`
  refuses a file that is not what the tool produces. WordPress holds a short loader
  (snippets/ivy-supplemental-loader.html) that points at this build id; rolling back is pointing at
  another one (docs/motor-m1-cargador.md). BUILD.json, beside these files, records which
  sources produced them: an id is never reused with other content.
*/

:root {
        --primary: #004481;
        --primary-hover: #002d56;
        --bg-gray: #f8fafc;
        --border: #e2e8f0;
        --text-dark: #1e293b;
        --text-light: #64748b;
        --success: #16a34a;
        --success-hover: #15803d;
        --error: #dc2626;
        --error-bg: #fef2f2;
        --lemon-purple: #7047eb;
    }

    .ucpiq-auth-bar {
        position: relative;
        z-index: 50;
        isolation: isolate;
        pointer-events: auto;
        max-width: 960px;
        margin: 0 auto 10px;
        padding: 0 2rem;
        display: flex;
        align-items: center;
        gap: 10px;
        flex-wrap: wrap;
    }

    #ceg-reviews-root > .ceg-reviews-launch {
        display: none !important;
    }

    .ucpiq-auth-btn {
        position: relative;
        z-index: 51;
        pointer-events: auto;
        touch-action: manipulation;
        background: #fff;
        border: 1px solid #cbd5e1;
        padding: 10px 16px;
        border-radius: 8px;
        cursor: pointer;
        display: inline-flex;
        align-items: center;
        gap: 10px;
        font-weight: 700;
        font-family: inherit;
        color: var(--text-dark);
        text-decoration: none;
        transition: all 0.2s ease;
    }

    .ucpiq-auth-btn > img,
    .ucpiq-auth-btn > span {
        pointer-events: none;
    }

    .ucpiq-auth-btn:hover {
        transform: translateY(-1px);
        box-shadow: 0 6px 14px rgba(15, 23, 42, 0.12);
    }

    .ucpiq-logout-btn {
        background: #0f172a;
        color: #fff;
        border: 1px solid #0f172a;
    }

    .ucpiq-account-status {
        display: inline-flex;
        align-items: center;
        min-height: 42px;
        padding: 10px 16px;
        border: 1px solid #bae6fd;
        border-radius: 8px;
        background: #f0f9ff;
        color: var(--primary);
        font-weight: 800;
    }

    .ucpiq-grader-container {
        display: flex;
        flex-direction: column;
        gap: 2.5rem;
        max-width: 960px;
        margin: 1rem auto 3rem;
        background: white;
        /* M7-color (17-10-2026): el bloque cover/columns del tema pinta su texto en blanco
           (`.wp-block-cover:not(.has-text-color){color:#fff}`) y el widget, sobre su tarjeta clara,
           lo heredaba: el título «Elite Second Opinion» y los títulos de la lectura y de la
           comparación salían blancos sobre blanco. El color se fija aquí y lo hereda todo el texto
           del widget (los botones ya traen su propio color). */
        color: var(--text-dark);
        padding: 2rem;
        border-radius: 12px;
        box-shadow: 0 10px 15px -3px rgba(0, 0, 0, 0.1);
        align-items: stretch;
        text-align: left;
        scroll-margin-top: 120px;
    }

    /* Los títulos y el texto que la lectura, la ESO y la comparación generan sin clase propia
       llevan su color por derecho propio, sin depender solo de la herencia. */
    .ucpiq-elite-results > h2,
    .ucpiq-comparison-card > h2,
    .ucpiq-comparison-card h3,
    .ucpiq-comparison-card p,
    .ucpiq-comparison-list h3,
    .ucpiq-comparison-list li,
    .ucpiq-comparison-list p {
        color: var(--text-dark);
    }

    .ucpiq-value-block {
        margin: 1rem 0 1.25rem;
        /* M9 PARADA Y7: menos aire encima del título «What You'll Get…» dentro de su recuadro. */
        padding: 0.55rem 1.15rem 1.15rem;
        border: 1px solid #bae6fd;
        border-radius: 12px;
        background: linear-gradient(145deg, #f8fbff, #eef7ff);
    }

    .ucpiq-value-block h3 {
        margin: 0 0 0.8rem;
        color: var(--primary);
        font-size: 1.25rem;
    }

    .ucpiq-value-grid {
        display: grid;
        grid-template-columns: repeat(3, minmax(0, 1fr));
        gap: 8px;
    }

    .ucpiq-value-card {
        padding: 0.75rem;
        border: 1px solid #dbeafe;
        border-radius: 8px;
        background: #fff;
        color: #334155;
        font-size: 0.88rem;
        font-weight: 750;
    }

    .ucpiq-prompt-copy {
        margin: 0 0 1.1rem; /* M9 PARADA 7: sin el -0.7rem que pegaba el enunciado al título */
        padding: 0.8rem;
        border-left: 3px solid var(--primary);
        background: #f8fafc;
        color: #475569;
        font-size: 0.9rem;
        line-height: 1.5;
    }

    .ucpiq-readiness,
    .ucpiq-next-action {
        margin-top: 1rem;
        padding: 1rem;
        border: 1px solid #bae6fd;
        border-radius: 10px;
        background: #f0f9ff;
        color: #1e3a5f;
    }

    .ucpiq-result-actions {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        margin-top: 1rem;
    }

    .ucpiq-result-actions button,
    .ucpiq-result-actions a {
        flex: 1;
        min-width: 150px;
        padding: 0.8rem;
        border: 1px solid #93c5fd;
        border-radius: 8px;
        background: #fff;
        color: var(--primary);
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        font-weight: 800;
    }

    .ucpiq-elite-funnel,
    .ucpiq-elite-results,
    .ucpiq-comparison-card,
    .ucpiq-final-actions-card {
        margin-top: 1rem;
        padding: 1rem;
        border: 1px solid #bae6fd;
        border-radius: 12px;
        background: #f8fbff;
    }

    .ucpiq-elite-results,
    .ucpiq-comparison-card { scroll-margin-top: 110px; }
    .ucpiq-elite-funnel button { width: 100%; }
    .ucpiq-elite-state { margin: 0.75rem 0 0; color: #475569; line-height: 1.5; }
    .ucpiq-elite-buy { display: inline-flex; margin-top: 0.75rem; }
    /* M3d (15-10-2026 · el propietario, en su página privada): el cajetín de la segunda opinión salía
       sin diseño —un botón gris plano, el del navegador, porque no tenía estilo propio— y el de la home
       sí lo tiene. Estas reglas son las de la home (`#home-ps-elite-card` / `#home-ps-elite-btn` /
       `#home-ps-elite-buy`), con sus mismos valores: la misma tarjeta, el mismo botón azul y el mismo
       gris del botón deshabilitado. */
    #ucpiq-elite-funnel {
        padding: 1.25rem;
        border-color: #93c5fd;
        background: linear-gradient(145deg, #eff6ff, #f0f9ff);
        color: #1e3a8a;
    }

    #ucpiq-elite-btn {
        width: 100%;
        min-height: 48px;
        border: 0;
        border-radius: 8px;
        background: #1d4ed8;
        color: #fff;
        cursor: pointer;
        font: inherit;
        font-weight: 800;
    }

    #ucpiq-elite-btn:disabled {
        cursor: not-allowed;
        opacity: 0.52;
    }

    #ucpiq-elite-buy {
        margin-top: 0.7rem;
        border: 0;
        padding: 0;
        background: none;
        color: #1d4ed8;
        font-weight: 800;
    }
    .ucpiq-elite-score { margin: 0.9rem 0; padding: 1rem; border-left: 4px solid var(--primary); border-radius: 8px; background: #fff; }
    .ucpiq-elite-score span { display: block; color: #64748b; font-weight: 800; }
    .ucpiq-elite-score strong { display: block; margin-top: 0.2rem; color: var(--primary); font-size: 2rem; }
    .ucpiq-compare-score-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 0.65rem; }
    .ucpiq-compare-score { padding: 0.8rem; border: 1px solid #dbeafe; border-radius: 8px; background: #fff; }
    .ucpiq-compare-score span { display: block; color: #64748b; font-size: 0.8rem; font-weight: 800; }
    .ucpiq-compare-score strong { display: block; margin-top: 0.3rem; color: var(--primary); font-size: 1.2rem; }
    .ucpiq-compare-criterion { margin-top: 0.75rem; padding: 0.85rem; border: 1px solid #e2e8f0; border-radius: 8px; background: #fff; }
    .ucpiq-compare-criterion p { margin: 0.45rem 0 0 !important; }
    .ucpiq-comparison-list { margin-top: 1rem; }
    .ucpiq-final-actions-card .ucpiq-result-actions { margin-top: 0; }

    .ucpiq-saved-note {
        box-sizing: border-box;
        width: 100%;
        margin: 0 0 1rem;
        padding: 0.8rem 1.2rem;
        border: 1px solid #bbf7d0;
        border-radius: 8px;
        background: #f0fdf4;
        color: #166534;
        font-weight: 800;
    }

    .ucpiq-input-section h2 {
        font-size: 1.8rem !important;
        /* M9 PARADA Y7: el tema deja un margen superior grande al primer h2; se acota aquí. */
        margin-top: 0 !important;
        margin-bottom: 0.5rem !important;
        color: var(--primary) !important;
        font-weight: 800 !important;
    }

    /* M3e (15-10-2026) · El aviso del progreso queda fuera de este bloque. Esta regla —con `!important`—
       es la del tema, que vestía los párrafos de la sección, y también alcanzaba al aviso: le imponía
       `display: block` y su `margin-bottom`, así que un aviso oculto seguía ocupando su alto y su aire.
       Se le deja fuera por su identificador, y su propia regla —más abajo— manda en él. */
    .ucpiq-input-section p:not(#ucpiq-processing-notice) {
        color: #475569 !important;
        margin-bottom: 1.5rem !important;
        font-size: 1rem !important;
        line-height: 1.5 !important;
        display: block !important;
    }

    .ucpiq-input-section strong {
        color: var(--primary) !important;
        font-weight: 700 !important;
    }

    .ucpiq-note-box {
        background: #f0f9ff;
        border: 1px solid #bae6fd;
        border-left: 4px solid var(--primary);
        padding: 1rem;
        border-radius: 8px;
        margin-bottom: 1.2rem;
        color: var(--text-dark);
        font-size: 0.92rem;
        line-height: 1.55;
    }

    .ucpiq-input-group {
        margin-bottom: 1.5rem;
    }

    .ucpiq-input-group label {
        display: block;
        font-size: 0.9rem;
        font-weight: 700;
        margin-bottom: 0.6rem; /* M9 PARADA 7: 9.6px entre el título y su enunciado */
        color: var(--text-dark);
    }

    .ucpiq-input-group select {
        width: 100%;
        padding: 0.8rem;
        border: 2px solid var(--border);
        border-radius: 8px;
        font-size: 1rem;
        box-sizing: border-box;
        background: white;
        color: var(--text-dark);
    }

    .ucpiq-textarea-wrapper {
        position: relative;
        margin-bottom: 1.875rem; /* M9 PARADA 7: 30px entre la caja y el título de la pregunta siguiente */
        background: #fff;
        border: 2px solid var(--border);
        border-radius: 8px;
        transition: border-color 0.2s;
    }

    .ucpiq-textarea-wrapper:focus-within {
        border-color: var(--primary);
    }

    [id^="ucpiq-essay-input"] {
        width: 100%;
        height: 150px;
        padding: 1.2rem;
        border: none;
        outline: none;
        resize: vertical;
        font-size: 16px;
        line-height: 1.6;
        box-sizing: border-box;
        border-radius: 8px;
        color: var(--text-dark);
        font-family: inherit;
    }

    /* M9 PARADA Y7: la caja de un short take (~200 caracteres) es de unas 3 líneas, no de ensayo. */
    .ucpiq-short-take {
        height: 96px;
    }

    /* M9 PARADA P3: la respuesta de Community (400-500 palabras) es más alta que el ensayo de 250. */
    .ucpiq-long-response {
        height: 260px;
    }

    /* M9 PARADA C3: los ensayos largos de Cornell (550–650 palabras) van más altos. */
    .ucpiq-xlong-response {
        height: 320px;
    }

    [id^="ucpiq-word-count"] {
        padding: 0.7rem;
        text-align: right;
        font-size: 13px;
        color: var(--text-light);
        border-top: 1px solid var(--border);
        background: #fafafa;
        border-radius: 0 0 8px 8px;
    }
    [id^="ucpiq-word-count"] .ucpiq-word-count__notice {
        display: block;
        margin-top: 0.35rem;
        font-weight: 600;
        color: #b7791f;
    }

    .ucpiq-list-notice {
        margin: 0.6rem 0 0;
        padding: 0.6rem 0.9rem;
        border: 1px solid #f6c23e;
        border-radius: 8px;
        background: #fdf6e3;
        color: #7c5a12;
        font-size: 0.9rem;
        font-weight: 600;
        line-height: 1.4;
    }

    /* Los selectores y los campos de texto del formulario (tipo de solicitud, áreas y ensayo largo). */
    .ucpiq-select {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        margin-top: 0.3rem;
        padding: 0.6rem 0.7rem;
        border: 1px solid var(--border);
        border-radius: 8px;
        background: #fff;
        color: var(--text-dark, #1e293b);
        font: inherit;
        font-size: 0.95rem;
        line-height: 1.4;
    }
    .ucpiq-select:focus {
        outline: none;
        border-color: var(--primary, #004481);
        box-shadow: 0 0 0 2px rgba(0, 68, 129, 0.12);
    }
    /* M9 PARADA Y8 · Los campos de área van apilados y separados; la nota va debajo, discreta. */
    .ucpiq-area {
        margin-bottom: 0.6rem;
        -webkit-appearance: none;
        appearance: none;
        border-radius: 8px;
    }
    .ucpiq-area-note {
        margin: 0.35rem 0 0;
        font-size: 0.85rem;
        color: var(--text-light);
        line-height: 1.4;
    }

    .ucpiq-captcha-container {
        margin-top: 1rem;
        display: flex;
        justify-content: center;
    }

    #ucpiq-message-box {
        color: var(--error);
        background: var(--error-bg);
        padding: 12px;
        margin-top: 10px;
        border-radius: 8px;
        border: 1px solid var(--error);
        font-size: 0.9rem;
        line-height: 1.5;
    }

    /* M9 PARADA C3-diag · Regla 9: el botón del reporte de fallo de generación. */
    .ucpiq-report-issue-btn {
        display: block;
        margin-top: 10px;
        padding: 8px 14px;
        border: 1px solid var(--border);
        border-radius: 8px;
        background: #fff;
        color: var(--text-dark);
        font: inherit;
        font-weight: 700;
        cursor: pointer;
    }
    .ucpiq-report-issue-btn:disabled {
        opacity: 0.6;
        cursor: default;
    }

    #ucpiq-analyze-btn {
        width: 100%;
        padding: 1.1rem;
        margin-top: 1.2rem;
        background-color: var(--primary);
        color: white !important;
        border: none;
        border-radius: 8px;
        cursor: pointer;
        font-weight: 700;
        transition: all 0.3s;
        display: flex;
        gap: 10px;
        justify-content: center;
        align-items: center;
    }

    /* M3e (15-10-2026) · El aviso no reserva hueco. Antes sí: su caja pedía `min-height: 62px` (82 en
       el móvil) y el párrafo, que sólo se ocultaba con `opacity`/`visibility`, seguía ocupando su alto
       —y el `margin-top` de la caja, con él—, así que entre el reto y «Analyze My PIQ» quedaban más de
       cien píxeles de aire que el propietario vio como un hueco. En la home el aviso está fuera del
       flujo (`display: none`) hasta que hay una lectura en marcha, y ese es el trato que se pide aquí:
       en reposo, la distancia entre el reto y el botón es la del botón —1.2rem, la misma que la home—,
       y el aviso, cuando aparece, trae su propio aire (0.85rem, también el de la home). */
    .ucpiq-processing-slot {
        margin: 0;
    }

    #ucpiq-processing-notice {
        box-sizing: border-box;
        display: none;
        margin: 0;
        padding: 11px 13px;
        opacity: 0;
        visibility: hidden;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        background: #eff6ff;
        color: #334155;
        font-size: 0.9rem;
        line-height: 1.45;
        transition: opacity 0.18s ease;
    }

    #ucpiq-processing-notice.is-visible {
        display: block;
        margin-top: 0.85rem;
        opacity: 1;
        visibility: visible;
    }

    #ucpiq-analyze-btn:hover {
        background-color: var(--primary-hover);
        transform: translateY(-1px);
    }

    #ucpiq-analyze-btn:disabled {
        opacity: 0.7;
        cursor: not-allowed;
    }

    #ucpiq-buy-credits-container {
        margin-top: 1.5rem;
        padding: 1.25rem;
        background: #fdf2ff;
        border: 2px solid #d8b4fe;
        border-radius: 10px;
        text-align: center;
    }

    #ucpiq-credit-status-msg {
        margin: 0 0 0.45rem;
        font-size: 0.95rem;
        font-weight: 800;
        color: #7e22ce;
    }

    .ucpiq-credit-helper {
        margin: 0 auto 1rem;
        max-width: 520px;
        font-size: 0.82rem;
        line-height: 1.45;
        color: var(--text-light);
    }

    .ucpiq-buy-btn-group {
        display: flex;
        gap: 10px;
        justify-content: center;
        margin-top: 10px;
        flex-wrap: wrap;
    }

    .ucpiq-buy-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background-color: var(--lemon-purple);
        color: white !important;
        padding: 0.85rem 1rem;
        border-radius: 8px;
        text-decoration: none !important;
        font-weight: 800;
        transition: all 0.25s ease;
        font-size: 0.9rem;
        flex: 1;
        min-width: 180px;
        border: none;
        cursor: pointer;
        text-align: center;
        line-height: 1.25;
    }

    .ucpiq-buy-btn.premium {
        background-color: var(--success);
        border: 2px solid var(--success-hover);
    }

    .ucpiq-buy-btn:hover {
        opacity: 0.95;
        transform: translateY(-1px);
    }

    .ucpiq-pricing-link-wrap {
        margin-top: 0.9rem;
        font-size: 0.82rem;
        color: var(--text-light);
    }

    .ucpiq-pricing-link-wrap a {
        color: var(--primary);
        font-weight: 800;
        text-decoration: none;
    }

    .ucpiq-pricing-link-wrap a:hover {
        text-decoration: underline;
    }

    .ucpiq-results-section {
        width: 100%;
        max-width: 100%;
        box-sizing: border-box;
        border-top: 1px solid var(--border);
        padding-top: 2rem;
        overflow-x: hidden;
    }

    .ucpiq-readiness-hero {
        text-align: left;
        padding: 1.5rem;
        background: #f0f9ff;
        border-radius: 12px;
        margin-bottom: 1.5rem;
        border: 1px solid #bae6fd;
    }

    .ucpiq-readiness-hero .ucpiq-readiness-eyebrow {
        font-size: 0.75rem;
        text-transform: uppercase;
        font-weight: 800;
        color: var(--text-light);
        letter-spacing: 1.5px;
        margin-bottom: 0.3rem;
    }

    .ucpiq-readiness-hero .ucpiq-readiness-band {
        font-size: 1.5rem;
        font-weight: 900;
        color: var(--primary);
        margin: 0 0 0.9rem;
    }

    .ucpiq-readiness-hero p {
        margin: 0 0 0.7rem;
        font-size: 0.96rem;
        line-height: 1.6;
        color: var(--text-dark);
    }

    .ucpiq-readiness-hero p:last-of-type {
        margin-bottom: 0;
    }

    .ucpiq-review-index {
        margin-top: 1rem;
        padding-top: 0.9rem;
        border-top: 1px solid #bae6fd;
        font-size: 0.8rem;
        color: var(--text-light);
    }

    .ucpiq-review-index strong {
        color: var(--text-dark);
        font-size: 0.95rem;
        font-weight: 900;
    }

    .ucpiq-metric-row {
        margin-top: 0.5rem;
        display: flex;
        justify-content: flex-start;
        gap: 8px;
        flex-wrap: wrap;
    }

    .ucpiq-badge {
        display: inline-flex;
        padding: 0.45rem 0.75rem;
        border-radius: 999px;
        font-size: 0.78rem;
        font-weight: 800;
        background: #fee2e2;
        color: #b91c1c;
    }

    .ucpiq-profile-group {
        border: 1px solid var(--border);
        border-radius: 10px;
        padding: 0.9rem 1rem;
        margin-bottom: 0.75rem;
        background: #fafafa;
    }

    .ucpiq-profile-group summary {
        list-style: none;
        cursor: pointer;
        display: grid;
        grid-template-columns: 16px 170px 1fr 170px;
        grid-template-areas: "arrow name track tag";
        align-items: center;
        column-gap: 0.75rem;
    }

    .ucpiq-profile-group summary::-webkit-details-marker {
        display: none;
    }

    .ucpiq-profile-group summary::before {
        grid-area: arrow;
        content: '▸';
        color: var(--text-light);
        font-size: 0.8rem;
        transition: transform 0.15s ease;
    }

    .ucpiq-profile-group[open] summary::before {
        transform: rotate(90deg);
    }

    .ucpiq-profile-name {
        grid-area: name;
        font-weight: 800;
        font-size: 0.95rem;
        color: var(--text-dark);
        min-width: 0;
        overflow-wrap: break-word;
    }

    .ucpiq-profile-track {
        grid-area: track;
        width: 100%;
        min-width: 0;
        height: 10px;
        background: #e2e8f0;
        border-radius: 6px;
        overflow: hidden;
    }

    .ucpiq-profile-fill {
        height: 100%;
        border-radius: 6px;
    }

    .ucpiq-profile-tag {
        grid-area: tag;
        font-size: 0.75rem;
        font-weight: 900;
        white-space: nowrap;
        text-align: right;
    }

    .ucpiq-profile-note {
        margin: 0.5rem 0 0;
        font-size: 0.75rem;
        color: var(--text-light);
        font-style: italic;
    }

    .ucpiq-profile-detail {
        margin: 0.75rem 0 0;
        padding-top: 0.75rem;
        border-top: 1px dashed var(--border);
        list-style: none;
    }

    .ucpiq-profile-detail li {
        display: flex;
        justify-content: space-between;
        align-items: baseline;
        gap: 0.75rem;
        padding: 0.35rem 0;
        font-size: 0.85rem;
        color: var(--text-dark);
        margin-bottom: 0;
    }

    .ucpiq-profile-detail li + li {
        border-top: 1px solid #f1f5f9;
    }

    .ucpiq-profile-detail-tag {
        font-weight: 800;
        white-space: nowrap;
    }

    .ucpiq-feedback-item {
        background: #fff;
        border: 1px solid var(--border);
        padding: 1.2rem;
        border-radius: 8px;
        margin-bottom: 1rem;
        border-left: 5px solid var(--primary);
    }

    .ucpiq-feedback-item h3 {
        margin: 0 0 0.6rem;
        font-size: 1rem;
        color: var(--primary);
        text-transform: uppercase;
        letter-spacing: 0.5px;
    }

    .ucpiq-feedback-item p {
        margin: 0;
        font-size: 0.95rem;
        line-height: 1.6;
        color: #334155;
    }

    .ucpiq-feedback-item ul {
        margin: 0.5rem 0 0;
        padding-left: 1.2rem;
        font-size: 0.95rem;
        line-height: 1.6;
        color: #334155;
    }

    .ucpiq-feedback-item li {
        margin-bottom: 0.4rem;
    }

    .ucpiq-wcf-readiness-pill {
        display: inline-block;
        font-size: 0.95rem;
        font-weight: 700;
        padding: 5px 14px;
        border-radius: 999px;
        background: #eaf1f8;
        color: var(--primary);
        margin-bottom: 10px;
    }

    .ucpiq-wcf-card {
        border: 1px solid var(--border);
        border-radius: 8px;
        padding: 0.8rem 1rem;
        margin-bottom: 0.6rem;
    }

    .ucpiq-wcf-card-good { border-left: 3px solid #1f8a4c; }
    .ucpiq-wcf-card-improve { border-left: 3px solid #b7791f; }

    .ucpiq-wcf-card-title {
        font-weight: 700;
        font-size: 0.92rem;
        margin-bottom: 4px;
        color: #1e293b;
    }

    .ucpiq-wcf-card p {
        margin: 4px 0 0;
        font-size: 0.88rem;
        color: #475569;
    }

    .ucpiq-wcf-recover-tag {
        display: inline-block;
        font-size: 0.72rem;
        font-weight: 600;
        color: #b7791f;
        background: #fff6e5;
        padding: 2px 8px;
        border-radius: 6px;
        margin-left: 6px;
    }

    .ucpiq-wcf-index-details {
        border: 1px solid var(--border);
        border-radius: 8px;
        margin-bottom: 0.6rem;
        overflow: hidden;
    }

    .ucpiq-wcf-index-details summary {
        list-style: none;
        cursor: pointer;
        padding: 0.7rem 1rem;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        gap: 8px;
    }

    .ucpiq-wcf-index-details summary::-webkit-details-marker {
        display: none;
    }

    .ucpiq-wcf-index-summary-label {
        font-weight: 700;
        font-size: 0.92rem;
        flex: 1 1 auto;
        min-width: 140px;
        color: #1e293b;
    }

    .ucpiq-wcf-index-summary-points {
        font-size: 0.85rem;
        color: #555;
    }

    .ucpiq-wcf-index-bar-track {
        flex-basis: 100%;
        background: #eee;
        border-radius: 6px;
        height: 8px;
        overflow: hidden;
    }

    .ucpiq-wcf-index-bar-fill {
        height: 100%;
        background: var(--primary);
        border-radius: 6px;
    }

    .ucpiq-wcf-index-criteria {
        padding: 4px 1rem 0.9rem;
        border-top: 1px solid #f2f2f2;
    }

    .ucpiq-wcf-criterion {
        padding: 0.7rem 0;
        border-bottom: 1px solid #f5f5f5;
    }

    .ucpiq-wcf-criterion:last-child {
        border-bottom: none;
    }

    .ucpiq-wcf-criterion-head {
        display: flex;
        justify-content: space-between;
        gap: 8px;
        font-size: 0.88rem;
        margin-bottom: 4px;
    }

    .ucpiq-wcf-criterion-label {
        font-weight: 600;
        color: #1e293b;
    }

    .ucpiq-wcf-criterion-points {
        color: #666;
        white-space: nowrap;
    }

    .ucpiq-wcf-level {
        display: inline-block;
        font-size: 0.72rem;
        font-weight: 700;
        padding: 2px 8px;
        border-radius: 6px;
        margin-bottom: 6px;
    }

    .ucpiq-wcf-level-good { background: #e7f6ec; color: #1f8a4c; }
    .ucpiq-wcf-level-mid { background: #fff6e5; color: #b7791f; }
    .ucpiq-wcf-level-low { background: #fdecea; color: #c0392b; }

    .ucpiq-wcf-quote {
        margin: 6px 0;
        padding: 6px 10px;
        border-left: 2px solid #ddd;
        font-style: italic;
        color: #555;
        font-size: 0.85rem;
    }

    .ucpiq-wcf-shared-note {
        font-size: 0.76rem;
        color: #888;
        margin: 2px 0 0;
    }

    .ucpiq-wcf-gap, .ucpiq-wcf-action {
        font-size: 0.85rem;
        margin: 4px 0 0;
        color: #475569;
    }

    ol.ucpiq-wcf-priorities {
        list-style: none;
        padding-left: 0;
        margin: 0;
    }

    ol.ucpiq-wcf-priorities li {
        margin-bottom: 14px;
        font-size: 0.9rem;
    }

    ol.ucpiq-wcf-priorities p {
        margin: 2px 0 0;
        color: #475569;
    }

    .ucpiq-wcf-next-action-card {
        border: 1px solid var(--primary);
        background: #eaf1f8;
        border-radius: 8px;
        padding: 1rem;
    }

    .ucpiq-wcf-next-action-card .ucpiq-wcf-card-title {
        color: var(--primary);
    }

    .ucpiq-wcf-secondary {
        background: #fafafa;
        border: 1px solid var(--border);
        border-radius: 8px;
        padding: 0.7rem 1rem;
        font-size: 0.82rem;
        color: #555;
        margin-top: 1.4rem;
    }

    .ucpiq-wcf-secondary summary {
        cursor: pointer;
        font-weight: 700;
        color: #333;
    }

    .ucpiq-wcf-secondary pre {
        white-space: pre-wrap;
        font-size: 0.78rem;
        margin-top: 8px;
    }

    @media (max-width: 520px) {
        .ucpiq-wcf-index-summary-label {
            min-width: 100%;
        }
    }

    .hidden {
        display: none !important;
    }

    #ucpiq-loader {
        border: 3px solid #fff;
        border-top: 3px solid transparent;
        border-radius: 50%;
        width: 20px;
        height: 20px;
        animation: ucpiqSpin 1s linear infinite;
    }

    /* M8 (17-10-2026 · regla 6): la ESO también avisa mientras se prepara — el giro y el aviso de
       1–3 minutos, como la Primary y la home. Visible durante la petición, oculto al terminar o
       fallar (`ucpiqUpdateEliteState` lo gobierna por `ucpiqEliteActive`). */
    #ucpiq-elite-processing {
        display: flex;
        align-items: center;
        justify-content: center;
        gap: 0.6rem;
        margin-top: 0.85rem;
        padding: 0.7rem 0.9rem;
        border: 1px solid #bfdbfe;
        border-radius: 8px;
        background: #eff6ff;
        color: #334155;
        font-size: 0.9rem;
        line-height: 1.45;
        font-weight: 600;
    }
    #ucpiq-elite-processing-spinner {
        display: inline-block;
        width: 16px;
        height: 16px;
        flex: 0 0 auto;
        border: 2px solid #cbd5e1;
        border-top-color: var(--primary);
        border-radius: 50%;
        animation: ucpiqSpin 0.8s linear infinite;
    }

    @keyframes ucpiqSpin {
        0% { transform: rotate(0deg); }
        100% { transform: rotate(360deg); }
    }

    @media (max-width: 768px) {
        .ucpiq-auth-bar {
            padding: 0;
        }

        .ucpiq-auth-btn,
        .ucpiq-account-status {
            width: 100%;
            justify-content: center;
            box-sizing: border-box;
        }

        .ucpiq-grader-container {
            padding: 1.2rem;
            gap: 1.5rem;
            scroll-margin-top: 140px;
        }

        .ucpiq-value-grid {
            grid-template-columns: 1fr;
        }

        .ucpiq-compare-score-grid { grid-template-columns: 1fr; }

        .ucpiq-result-actions { flex-direction: column; }

        .ucpiq-result-actions button,
        .ucpiq-result-actions a {
            min-width: 100%;
        }

        [id^="ucpiq-essay-input"] {
            height: 280px;
        }

        .ucpiq-profile-group summary {
            grid-template-columns: 16px 1fr auto;
            grid-template-areas:
                "arrow name tag"
                ".     track track";
            row-gap: 0.5rem;
        }

        .ucpiq-profile-name,
        .ucpiq-profile-track,
        .ucpiq-profile-tag {
            min-width: 0;
        }

        .ucpiq-buy-btn {
            min-width: 100%;
        }
    }
/* ==== M3b-2 · LAS REGLAS DE LA LECTURA CUALITATIVA (portadas de la home, 15-10-2026) ==== */
.ucpiq-q{--ucpiq-q-line:#dfe3e8;--ucpiq-q-card:#fff;--ucpiq-q-ink:#1b2430;--ucpiq-q-muted:#5b6471;--ucpiq-q-amber:#8a4b0f;--ucpiq-q-amber-bg:#fdf1e3;--ucpiq-q-green:#1f6b3a;--ucpiq-q-green-bg:#eaf5ee;--ucpiq-q-blue:var(--tema-acento,#0b4f8a);--ucpiq-q-blue-bg:var(--tema-fondo-suave,#eef4fb);background:#f3f4f6;color:var(--ucpiq-q-ink);padding:20px 16px;border-radius:14px;line-height:1.55;font-family:'IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',Roboto,'Helvetica Neue',Arial,sans-serif}
.ucpiq-q h2,.ucpiq-q h3,.ucpiq-q h4,.ucpiq-q h5,.ucpiq-q .ucpiq-q-title{font-family:'Space Grotesk','IBM Plex Sans',-apple-system,BlinkMacSystemFont,'Segoe UI',sans-serif}
.ucpiq-q .ucpiq-q-kicker{margin:0;color:var(--ucpiq-q-muted);font-size:.82rem;font-weight:700;letter-spacing:.06em;text-transform:uppercase}
.ucpiq-q .ucpiq-q-title{margin:6px 0 2px;font-size:1.7rem;color:#111827}
.ucpiq-q .ucpiq-q-panel-heading{margin:0 0 8px;font-size:1.4rem;color:#111827}
.ucpiq-q .ucpiq-q-reader,.ucpiq-q .ucpiq-q-note{margin:0;color:var(--ucpiq-q-muted);font-size:.92rem}
.ucpiq-q .ucpiq-q-block{margin:22px 0 0}
.ucpiq-q .ucpiq-q-heading{margin:0;color:#111827;font-size:1.05rem}
.ucpiq-q .ucpiq-q-heading+.ucpiq-q-note{margin-top:4px}
.ucpiq-q .ucpiq-q-actions{margin:10px 0 0;padding-left:22px}
.ucpiq-q .ucpiq-q-action{margin:12px 0;padding-left:4px}
.ucpiq-q .ucpiq-q-where{margin:0;color:var(--ucpiq-q-blue);font-weight:700}
.ucpiq-q .ucpiq-q-action-text{margin:2px 0 0}
.ucpiq-q .ucpiq-q-status,.ucpiq-q .ucpiq-q-how,.ucpiq-q .ucpiq-q-chip{display:inline-block;padding:2px 10px;border-radius:999px;font-size:.82rem;font-weight:800;white-space:nowrap}
.ucpiq-q .ucpiq-q-status--ready,.ucpiq-q .ucpiq-q-how--ready,.ucpiq-q .ucpiq-q-chip--ready{background:var(--ucpiq-q-green-bg);color:var(--ucpiq-q-green)}
.ucpiq-q .ucpiq-q-status--work,.ucpiq-q .ucpiq-q-how--work,.ucpiq-q .ucpiq-q-chip--work{background:var(--ucpiq-q-amber-bg);color:var(--ucpiq-q-amber)}
.ucpiq-q details{margin-top:12px;border:1px solid var(--ucpiq-q-line);border-radius:10px;background:var(--ucpiq-q-card)}
.ucpiq-q details>summary{display:flex;align-items:center;min-height:44px;box-sizing:border-box;padding:10px 14px;cursor:pointer;font-weight:700;color:#111827}
.ucpiq-q details>summary:focus-visible{outline:2px solid var(--ucpiq-q-blue);outline-offset:-2px}
.ucpiq-q details>p,.ucpiq-q details>ul,.ucpiq-q details>div{margin:0;padding:0 14px 12px}
.ucpiq-q .ucpiq-q-list{margin:8px 0 0;padding-left:20px}
.ucpiq-q .ucpiq-q-prompt{margin:8px 0 0;color:var(--ucpiq-q-muted);font-size:.88rem;border-left:3px solid var(--ucpiq-q-line);padding-left:10px}
.ucpiq-q .ucpiq-q-card{margin:22px 0 0;padding:18px 16px;border:1px solid var(--ucpiq-q-line);border-radius:12px;background:var(--ucpiq-q-card);scroll-margin-top:12px}
.ucpiq-q .ucpiq-q-card-head{margin:0 0 4px}
.ucpiq-q .ucpiq-q-card-title{margin:0;font-size:1.18rem;color:#111827}
.ucpiq-q .ucpiq-q-card-meta{display:flex;flex-wrap:wrap;gap:10px;align-items:center;margin:6px 0 0}
/* C13 P2 (13-10-2026): el recuento de palabras de la tarjeta y, debajo, el aviso del mínimo oficial
   dentro de la revisión. Su tamaño es el del texto que se lee —no el de un pie de página— porque es
   información que el alumno tiene que poder leer sin volver al formulario. */
.ucpiq-q .ucpiq-q-words{color:var(--ucpiq-q-muted);font-size:.92rem}
.ucpiq-q .ucpiq-q-below{margin:6px 0 0;color:var(--ucpiq-q-amber);font-size:.95rem;font-weight:700}
.ucpiq-q .ucpiq-q-change{margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--ucpiq-q-line)}
.ucpiq-q .ucpiq-q-change-head{margin:0;font-size:1rem;color:#111827}
.ucpiq-q .ucpiq-q-under{margin:6px 0 0}
.ucpiq-q .ucpiq-q-quote{margin:8px 0 0;padding:8px 10px;border-left:4px solid #c4a68e;background:#faf8f6;font-family:'IBM Plex Serif',Georgia,serif;font-style:italic;color:#38424f}
.ucpiq-q .ucpiq-q-proposal{margin:10px 0 0;padding:12px 14px;border:1px solid #c9dcf0;border-left:5px solid var(--ucpiq-q-blue);border-radius:8px;background:var(--ucpiq-q-blue-bg)}
.ucpiq-q .ucpiq-q-proposal-label{margin:0;color:var(--ucpiq-q-blue);font-weight:800;font-size:.84rem;letter-spacing:.04em;text-transform:uppercase}
.ucpiq-q .ucpiq-q-proposal-text{margin:4px 0 0}
.ucpiq-q .ucpiq-q-other{margin:12px 0 0;padding:10px 12px;border:1px dashed #c4a68e;border-radius:8px}
.ucpiq-q .ucpiq-q-other-label{margin:0;color:var(--ucpiq-q-amber);font-weight:800;font-size:.84rem;letter-spacing:.04em;text-transform:uppercase}
.ucpiq-q .ucpiq-q-already>summary{font-size:.96rem}
.ucpiq-q .ucpiq-q-chips{margin:12px 0 0;padding:0;list-style:none;display:grid;gap:8px}
.ucpiq-q .ucpiq-q-chip-item{display:flex;flex-wrap:wrap;gap:6px 12px;align-items:center;justify-content:space-between;padding:10px 12px;border:1px solid var(--ucpiq-q-line);border-radius:10px;background:var(--ucpiq-q-card)}
.ucpiq-q .ucpiq-q-chip-where{font-weight:700;color:#111827}
.ucpiq-q .ucpiq-q-columns{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:8px}
.ucpiq-q .ucpiq-q-reading{padding:12px;border:1px solid var(--ucpiq-q-line);border-radius:10px;background:var(--ucpiq-q-card)}
.ucpiq-q .ucpiq-q-reading-head{display:flex;flex-wrap:wrap;gap:6px 10px;align-items:center;margin:0}
.ucpiq-q .ucpiq-q-who{color:var(--ucpiq-q-blue);font-weight:800}
.ucpiq-q .ucpiq-q-reading-text{margin:8px 0 0}
.ucpiq-q .ucpiq-q-reading-offer{margin:8px 0 0;padding:8px 10px;border-left:4px solid var(--ucpiq-q-blue);background:var(--ucpiq-q-blue-bg);border-radius:6px}
.ucpiq-q .ucpiq-q-crits{margin:12px 0 0}
.ucpiq-q .ucpiq-q-crit{margin:0 0 14px;padding:0 0 12px;border-bottom:1px solid var(--ucpiq-q-line)}
.ucpiq-q .ucpiq-q-crit-head{margin:0;font-size:1rem;color:#111827}
.ucpiq-q .ucpiq-q-agree-row{margin:0;padding:12px 14px;border-top:1px solid var(--ucpiq-q-line)}
.ucpiq-q .ucpiq-q-agree-where{margin:0;font-weight:700;color:#111827}
.ucpiq-q .ucpiq-q-tag{display:inline-block;padding:2px 8px;border-radius:999px;background:#f1ede9;color:#4e3629;font-size:.78rem;font-weight:800}
.ucpiq-q .ucpiq-q-other-line{margin:8px 0 0;font-size:.94rem;color:#334155}
.ucpiq-q .ucpiq-q-quote-inline{font-family:'IBM Plex Serif',Georgia,serif;font-style:italic;color:#38424f}
.ucpiq-q .ucpiq-q-reason{margin:0;font-size:.94rem;color:#334155}
/* Punto 3 (14-10-2026): en la fila de una razón el nombre del lector y su frase se leían pegados
   («PrimaryYour PIQ…»), porque el nombre es un `span` y su frase le sigue sin nada en medio. El
   hueco lo pone la hoja de estilo, con la misma medida que las frases de «What to do next» —que ya lo
   llevaban—, y vale para las dos filas donde un lector dice algo: la razón de la coincidencia y la
   línea de la otra lectura. Así la separación no depende de un espacio suelto en el marcado. */
.ucpiq-q .ucpiq-q-reason .ucpiq-q-who,.ucpiq-q .ucpiq-q-other-line .ucpiq-q-who{margin-right:6px}
.ucpiq-q .ucpiq-q-next-head{margin:14px 0 0;font-size:.95rem;color:#111827}
.ucpiq-q .ucpiq-q-next-list{margin:8px 0 0;padding-left:20px}
.ucpiq-q .ucpiq-q-next-where{margin:0;font-weight:700;color:var(--ucpiq-q-blue)}
.ucpiq-q .ucpiq-q-next-text{margin:4px 0 0}
.ucpiq-q .ucpiq-q-next-text .ucpiq-q-who{margin-right:6px}
.ucpiq-q .ucpiq-q-next-more>summary{color:var(--ucpiq-q-blue)}
.ucpiq-q .ucpiq-q-next-more>h5{padding:0 14px}
.ucpiq-q .ucpiq-q-foot{margin:18px 0 0;padding:10px 12px;border-left:4px solid #c4a68e;background:#faf8f6;border-radius:6px}
@media(max-width:720px){.ucpiq-q .ucpiq-q-columns{grid-template-columns:1fr}}
/* ==== M3b-2 · fin de las reglas de la lectura cualitativa ==== */

/* ==== CEG · CONSENTIMIENTO — tarjeta, opciones y nota (pieza compartida · 5 widgets) ====

   La pieza `snippets/motor-consentimiento.js` dibuja esta tarjeta dentro del widget. Antes, el
   `<fieldset>`/`<legend>` del navegador la dejaba con su borde y su sangría, los radios salían
   pegados («YesO No»), la nota entera ocupaba media pantalla y la pregunta caía debajo del botón.
   Este bloque —acotado a `[data-ceg-consent]`— la convierte en una tarjeta como las demás del
   widget: el `fieldset` se resetea (sin borde ni legend del navegador), Yes/No son dos botones del
   mismo tamaño con el elegido marcado en el acento del tema (`var(--accent)` en la home,
   `var(--brown)` en Brown, `var(--tema-acento)` en UC/Ivy), y la nota se pliega con «Read more».

   Viaja IDÉNTICO en los 5 widgets, como la pieza JS; `tests/motor-consentimiento.test.mjs` lo exige
   byte a byte.
   ================================================================================================ */

/* 1 · La tarjeta: como los demás avisos del widget (fondo claro, borde suave, esquinas, padding). */
[data-ceg-consent] {
  --ceg-consent-acento: var(--accent, var(--brown, var(--tema-acento, #0b4f8a)));
  --ceg-consent-borde: #e2e8f0;
  --ceg-consent-fondo: #f8fafc;
  margin: 0 0 1rem;
  padding: 1rem 1rem .9rem;
  border: 1px solid var(--ceg-consent-borde);
  border-radius: 12px;
  background: var(--ceg-consent-fondo);
  color: inherit;
  font: inherit;
  line-height: 1.5;
  box-sizing: border-box;
}

/* 2 · El fieldset, reseteado: sin el borde ni el legend del navegador. */
[data-ceg-consent] .ceg-consent-campo {
  border: 0;
  margin: 0;
  padding: 0;
  min-width: 0;
}

/* 3 · La pregunta: en negrita y del tamaño del texto normal (sin la caja del legend). */
[data-ceg-consent] .ceg-consent-pregunta {
  display: block;
  float: none;
  width: auto;
  padding: 0;
  margin: 0 0 .6rem;
  border: 0;
  font-weight: 700;
  font-size: 1rem;
  line-height: 1.4;
}

/* 4 · Yes / No: dos botones del mismo tamaño, uno al lado del otro y con separación. */
[data-ceg-consent] .ceg-consent-opciones {
  display: flex;
  gap: .6rem;
  margin: 0 0 .8rem;
}
[data-ceg-consent] .ceg-consent-opcion {
  position: relative;
  flex: 1 1 0;
  min-width: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 44px;
  padding: .6rem .75rem;
  border: 1px solid #cbd5e1;
  border-radius: 8px;
  background: #fff;
  color: inherit;
  font-weight: 600;
  text-align: center;
  cursor: pointer;
  box-sizing: border-box;
}

/* El radio real sigue existiendo (accesibilidad y teclado): invisible, pero cubre la etiqueta. */
[data-ceg-consent] .ceg-consent-radio {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  opacity: 0;
  cursor: pointer;
}

/* 5 · El elegido, marcado con el color del tema de la ficha. */
[data-ceg-consent] .ceg-consent-opcion:has(.ceg-consent-radio:checked) {
  border-color: var(--ceg-consent-acento);
  box-shadow: inset 0 0 0 1px var(--ceg-consent-acento);
  color: var(--ceg-consent-acento);
  font-weight: 700;
}

/* Foco visible (teclado). */
[data-ceg-consent] .ceg-consent-opcion:has(.ceg-consent-radio:focus-visible) {
  outline: 2px solid var(--ceg-consent-acento);
  outline-offset: 2px;
}

/* 6 · La nota: pequeña (≈0.85rem) y en color suave. */
[data-ceg-consent] .ceg-consent-nota {
  margin: 0;
  font-size: .85rem;
  line-height: 1.45;
  color: #64748b;
}

/* 7 · «Read more» / «Show less»: un botón real (teclado), con aria-expanded. */
[data-ceg-consent] .ceg-consent-leer {
  display: inline;
  margin: 0 0 0 .35rem;
  padding: 0;
  min-height: 0;
  border: 0;
  background: none;
  color: var(--ceg-consent-acento);
  font: inherit;
  font-size: .85rem;
  line-height: inherit;
  vertical-align: baseline;
  text-decoration: underline;
  cursor: pointer;
}
[data-ceg-consent] .ceg-consent-leer:hover {
  text-decoration: none;
}
[data-ceg-consent] .ceg-consent-leer:focus-visible {
  outline: 2px solid var(--ceg-consent-acento);
  outline-offset: 2px;
  border-radius: 2px;
  text-decoration: none;
}

/* 8 · Móvil (390 px): los dos botones caben en una línea o se apilan limpios; nada se sale. */
@media (max-width: 390px) {
  [data-ceg-consent] .ceg-consent-opciones {
    flex-wrap: wrap;
  }
  [data-ceg-consent] .ceg-consent-opcion {
    flex: 1 1 100%;
  }
}

/* ==== CEG · CONSENTIMIENTO — fin ==== */

.ceg-reviews-launch {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 38px;
    margin-top: 0;
    padding: 9px 14px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    color: #132238;
    cursor: pointer;
    font: inherit;
    font-size: 14px;
    font-weight: 800;
    line-height: 1;
    transition: border-color 0.18s ease, box-shadow 0.18s ease,
      transform 0.18s ease;
  }

  .ceg-reviews-launch:hover {
    border-color: #2563eb;
    box-shadow: 0 6px 16px rgba(37, 99, 235, 0.12);
    transform: translateY(-1px);
  }

  /* Punto 3 del propietario (15-10-2026): el modal ya no se corta por arriba —el chip del tipo de
     uso y la cabecera quedaban tapados—. La capa se alinea arriba y scrollea ella misma
     (`align-items: flex-start` + `overflow-y: auto`) y el modal no se pasa de la ventana
     (`calc(100vh - 32px)`, con su `100dvh` para el móvil): con la capa centrada y el modal más alto
     que la pantalla, el navegador recortaba el principio del contenido. Son las reglas del My
     Reviews del motor (`my-essay-reviews.html`, §M2b) —la misma forma que ya usan la home y Brown—,
     así que la caja se ve igual en las tres páginas.
     M3h (16-10-2026) intentó dos cosas que no bastaban: empezar la capa debajo de la cabecera
     (`inset: 60px 0 0 0`) y subir su z-index al máximo. La capa seguía tapada porque vivía dentro
     de `.ucpiq-auth-bar` —la barra de sesión del widget, `isolation: isolate` y `z-index: 50`—, que
     abre un contexto de apilamiento: ahí ningún z-index gana a la cabecera.
     M3i (16-10-2026): la capa cuelga de `document.body` —el guion la mueve al abrir, como el My
     Reviews del motor—, así que su `position: fixed; inset: 0` se mide contra la ventana y su
     z-index máximo pinta por encima de la cabecera fija del tema. */
  .ceg-reviews-backdrop {
    position: fixed;
    z-index: 2147483000;
    inset: 0;
    display: none;
    align-items: flex-start;
    justify-content: center;
    box-sizing: border-box;
    padding: 16px;
    overflow-x: hidden;
    overflow-y: auto;
    overscroll-behavior: contain;
    background: rgba(15, 23, 42, 0.68);
  }

  .ceg-reviews-backdrop.is-open {
    display: flex;
  }

  .ceg-reviews-modal {
    display: flex;
    flex-direction: column;
    width: min(960px, calc(100vw - 32px));
    max-width: 960px;
    max-height: calc(100vh - 32px);
    max-height: calc(100dvh - 32px);
    margin: auto 0;
    overflow-x: hidden;
    overflow-y: auto;
    box-sizing: border-box;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(15, 23, 42, 0.34);
    color: #132238;
    font-family: inherit;
  }

  .ceg-reviews-header {
    position: sticky;
    z-index: 50;
    top: 0;
    display: flex;
    flex: 0 0 auto;
    align-items: center;
    justify-content: space-between;
    gap: 16px;
    padding: 20px 22px;
    border-bottom: 1px solid #e2e8f0;
    background: #fff;
  }

  .ceg-reviews-title {
    margin: 0 !important;
    color: #132238;
    font-size: 23px;
    font-weight: 900;
    line-height: 1.2;
  }

  .ceg-reviews-close {
    position: relative;
    z-index: 60;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    width: 38px;
    height: 38px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: #f1f5f9;
    color: #334155;
    cursor: pointer;
    font-size: 24px;
    line-height: 1;
  }

  /* El cuerpo del modal no reserva su propio scroll: el que scrollea es el modal entero —así la
     cabecera pegajosa enseña siempre el título y el chip no se queda debajo del borde—, que es como
     lo hace el My Reviews del motor. */
  .ceg-reviews-body {
    flex: 0 0 auto;
    min-height: 0;
    min-width: 0;
    max-height: none;
    overflow: visible;
    box-sizing: border-box;
    padding: 20px 22px 24px;
  }

  .ceg-reviews-privacy {
    margin: 0 0 18px !important;
    padding: 12px 14px;
    border-left: 4px solid #2563eb;
    border-radius: 8px;
    background: #eff6ff;
    color: #334155;
    font-size: 14px;
    line-height: 1.5;
  }

  .ceg-reviews-cta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 0 0 18px;
    padding: 14px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fafc;
  }

  .ceg-reviews-cta__text {
    margin: 0 !important;
    color: #334155;
    font-size: 14px;
    font-weight: 700;
    line-height: 1.45;
  }

  .ceg-reviews-cta__button {
    flex: 0 0 auto;
    padding: 9px 13px;
    border: 0;
    border-radius: 8px;
    background: #2563eb;
    color: #fff;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
    line-height: 1.2;
  }

  .ceg-reviews-cta__button:hover {
    background: #1d4ed8;
  }

  .ceg-reviews-message {
    margin: 18px 0 !important;
    padding: 18px;
    border-radius: 10px;
    background: #f8fafc;
    color: #475569;
    text-align: center;
  }

  .ceg-reviews-message.is-error {
    background: #fef2f2;
    color: #b91c1c;
  }

  .ceg-reviews-list {
    display: grid;
    gap: 14px;
  }

  .ceg-review-card {
    padding: 17px;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    background: #fff;
  }

  /* Punto 5 del propietario (15-10-2026): la segunda opinión se anida dentro de su Primary —la
     pareja de `parent_review_id` se ve de un vistazo, como en la home y en Brown—, y esta es la
     tarjeta que la anida. La regla es la de la casa (`home-personal-statement-frontend.html`). */
  .ceg-review-card--elite-child {
    margin-top: 16px;
    border-color: #c4b5fd;
    background: #f5f3ff;
  }

  .ceg-review-card__top {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
  }

  .ceg-review-card__name {
    margin: 0 !important;
    color: #132238;
    font-size: 17px;
    font-weight: 900;
    line-height: 1.35;
  }

  .ceg-review-card__date {
    flex: 0 0 auto;
    color: #64748b;
    font-size: 13px;
    line-height: 1.4;
  }

  .ceg-review-card__title,
  .ceg-review-card__prompt {
    margin: 7px 0 0 !important;
    color: #475569;
    font-size: 14px;
    line-height: 1.45;
  }

  .ceg-review-card__title {
    color: #1e293b;
    font-weight: 800;
  }

  .ceg-review-card__meta {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 13px;
  }

  .ceg-review-chip {
    display: inline-flex;
    padding: 5px 8px;
    border-radius: 999px;
    background: #f1f5f9;
    color: #475569;
    font-size: 12px;
    font-weight: 800;
  }

  .ceg-review-card__actions {
    position: relative;
    z-index: 2;
    pointer-events: auto;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 15px;
  }

  .ceg-review-action {
    position: relative;
    pointer-events: auto;
    touch-action: manipulation;
    min-height: 36px;
    padding: 8px 12px;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    background: #fff;
    color: #1e293b;
    cursor: pointer;
    font: inherit;
    font-size: 13px;
    font-weight: 800;
  }

  .ceg-review-action--primary {
    border-color: #2563eb;
    background: #2563eb;
    color: #fff;
  }

  .ceg-review-action--danger {
    border-color: #fecaca;
    color: #b91c1c;
  }

  .ceg-review-action--compare {
    border-color: #93c5fd;
    background: #eff6ff;
    color: #1d4ed8;
  }

  .ceg-review-action:disabled {
    cursor: wait;
    opacity: 0.6;
  }

  .ceg-review-detail {
    display: none;
  }

  .ceg-review-detail.is-visible {
    display: block;
  }

  .ceg-review-detail__back {
    margin-bottom: 16px;
  }

  .ceg-review-detail__heading {
    margin: 0 0 6px !important;
    color: #132238;
    font-size: 21px;
    font-weight: 900;
  }

  .ceg-review-detail__subheading {
    margin: 22px 0 9px !important;
    color: #132238;
    font-size: 17px;
    font-weight: 900;
  }

  .ceg-review-detail__essay {
    padding: 16px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #f8fafc;
    color: #1e293b;
    font-family: inherit;
    font-size: 14px;
    line-height: 1.65;
    white-space: pre-wrap;
    overflow-wrap: anywhere;
  }

  .ceg-review-result {
    display: grid;
    gap: 16px;
  }

  .ceg-review-section {
    padding: 15px 16px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
  }


  .ucpiq-result-summary h3,
  .ucpiq-result-criteria > h3,
  .ucpiq-result-section h4 {
    margin: 0 0 9px !important;
    color: #132238;
  }

  .ucpiq-result-summary p,
  .ucpiq-result-section p,
  .ucpiq-result-list {
    color: #334155;
    font-size: 14px;
    line-height: 1.55;
  }

  .ucpiq-result-criteria {
    display: grid;
    gap: 12px;
  }

  .ucpiq-result-criterion {
    padding: 14px;
    border: 1px solid #dbe3ee;
    border-radius: 9px;
    background: #f8fafc;
  }

  .ucpiq-result-criterion-heading {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    gap: 12px;
  }

  .ucpiq-result-criterion-name {
    margin: 0 !important;
    color: #132238;
    font-size: 15px;
  }

  .ucpiq-result-criterion-points {
    flex: 0 0 auto;
    color: var(--primary);
    font-size: 13px;
    font-weight: 900;
  }

  .ucpiq-result-reason,
  .ucpiq-result-missing,
  .ucpiq-result-recommendation {
    margin: 9px 0 0 !important;
    color: #334155;
    font-size: 14px;
    line-height: 1.55;
  }

  .ucpiq-result-evidence {
    margin: 10px 0 0;
    padding: 10px 12px;
    border-left: 3px solid var(--primary);
    background: #fff;
    color: #334155;
    font-size: 14px;
    font-style: italic;
    line-height: 1.5;
  }

  .ceg-review-section__title {
    margin: 0 0 8px !important;
    color: #132238;
    font-size: 15px;
    font-weight: 900;
    line-height: 1.35;
  }

  .ceg-review-section__text {
    margin: 0 !important;
    color: #334155;
    font-size: 14px;
    line-height: 1.55;
    white-space: pre-wrap;
  }

  .ceg-review-section__list {
    margin: 0 !important;
    padding-left: 20px;
    color: #334155;
    font-size: 14px;
    line-height: 1.55;
  }

  .ceg-review-score {
    display: flex;
    align-items: baseline;
    gap: 6px;
  }

  .ceg-review-score__value {
    color: #2563eb;
    font-size: 34px;
    font-weight: 900;
    line-height: 1;
  }

  .ceg-review-score__maximum {
    color: #64748b;
    font-size: 15px;
    font-weight: 800;
  }

  .ceg-review-index-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 9px;
  }

  .ceg-review-index {
    padding: 10px;
    border-radius: 8px;
    background: #f8fafc;
    text-align: center;
  }

  .ceg-review-index__label {
    display: block;
    color: #475569;
    font-size: 11px;
    font-weight: 800;
    line-height: 1.3;
  }

  .ceg-review-index__value {
    display: block;
    margin-top: 5px;
    color: #132238;
    font-size: 20px;
    font-weight: 900;
    line-height: 1;
  }

  .ceg-review-risk-badges {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
  }

  .ceg-review-risk-badge {
    display: inline-flex;
    padding: 7px 9px;
    border: 1px solid #fecaca;
    border-radius: 999px;
    background: #fef2f2;
    color: #b91c1c;
    font-size: 12px;
    font-weight: 800;
  }

  .ceg-review-risk-badge.is-clean {
    border-color: #bbf7d0;
    background: #f0fdf4;
    color: #15803d;
  }

  .ceg-review-risk-badge.is-active {
    border-color: #fecaca;
    background: #fef2f2;
    color: #b91c1c;
  }

  .ceg-review-risk-empty {
    margin: 0 !important;
    color: #15803d;
    font-size: 13px;
    font-weight: 800;
  }

  .ceg-review-detail__bottom-back {
    margin-top: 18px;
  }

  .ceg-review-comparison {
    display: none;
  }

  .ceg-review-comparison.is-visible {
    display: block;
  }

  .ceg-comparison-heading {
    margin: 0 0 6px !important;
    color: #132238;
    font-size: 23px;
    font-weight: 900;
    line-height: 1.25;
  }

  .ceg-comparison-intro {
    margin: 0 0 16px !important;
    color: #64748b;
    font-size: 14px;
    line-height: 1.5;
  }

  .ceg-comparison-selector {
    margin-bottom: 16px;
    padding: 14px;
    border: 1px solid #dbeafe;
    border-radius: 10px;
    background: #f8fafc;
  }

  .ceg-comparison-selector__label {
    display: block;
    margin-bottom: 7px;
    color: #334155;
    font-size: 13px;
    font-weight: 900;
  }

  .ceg-comparison-selector__select {
    width: 100%;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    background: #fff;
    color: #1e293b;
    font: inherit;
    font-size: 14px;
  }

  .ceg-comparison-loading,
  .ceg-comparison-error {
    margin: 14px 0 0 !important;
    padding: 14px;
    border-radius: 9px;
    background: #f8fafc;
    color: #475569;
    font-size: 14px;
    text-align: center;
  }

  .ceg-comparison-error {
    background: #fef2f2;
    color: #b91c1c;
  }

  .ceg-comparison-version-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .ceg-comparison-version {
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
  }

  .ceg-comparison-version__label {
    display: block;
    color: #64748b;
    font-size: 12px;
    font-weight: 900;
    text-transform: uppercase;
  }

  .ceg-comparison-version__date {
    display: block;
    margin-top: 7px;
    color: #334155;
    font-size: 13px;
    line-height: 1.4;
  }

  .ceg-comparison-version__score {
    display: block;
    margin-top: 9px;
    color: #132238;
    font-size: 27px;
    font-weight: 900;
    line-height: 1;
  }

  .ceg-comparison-score-change {
    margin: 12px 0 16px !important;
    padding: 12px 14px;
    border-radius: 9px;
    font-size: 15px;
    font-weight: 900;
    text-align: center;
  }

  .ceg-comparison-score-change.is-positive {
    background: #ecfdf5;
    color: #15803d;
  }

  .ceg-comparison-score-change.is-neutral {
    background: #f1f5f9;
    color: #475569;
  }

  .ceg-comparison-score-change.is-negative {
    background: #fef2f2;
    color: #b91c1c;
  }

  .ceg-comparison-index-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 14px;
  }

  .ceg-comparison-index {
    padding: 12px;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    background: #fff;
  }

  .ceg-comparison-index.is-top-improvement {
    border-color: #86efac;
    background: #f0fdf4;
  }

  .ceg-comparison-index__label {
    display: block;
    color: #475569;
    font-size: 12px;
    font-weight: 900;
    line-height: 1.35;
  }

  .ceg-comparison-index__values {
    display: block;
    margin-top: 7px;
    color: #132238;
    font-size: 16px;
    font-weight: 900;
  }

  .ceg-comparison-index__change {
    margin-left: 5px;
    color: #15803d;
  }

  .ceg-comparison-index__change.is-negative {
    color: #b91c1c;
  }

  .ceg-comparison-section {
    margin-top: 16px;
    padding: 14px;
    border: 1px solid #e2e8f0;
    border-radius: 10px;
    background: #fff;
  }

  .ceg-comparison-section__title {
    margin: 0 0 8px !important;
    color: #132238;
    font-size: 15px;
    font-weight: 900;
  }

  .ceg-comparison-section__list {
    margin: 0 !important;
    padding-left: 20px;
    color: #334155;
    font-size: 14px;
    line-height: 1.55;
  }

  .ceg-comparison-section__empty {
    margin: 0 !important;
    color: #64748b;
    font-size: 14px;
    line-height: 1.5;
  }

  .ceg-comparison-cta {
    margin-top: 18px;
    padding: 15px;
    border-radius: 10px;
    background: #eff6ff;
  }

  .ceg-comparison-cta__text {
    margin: 0 0 11px !important;
    color: #1e3a8a;
    font-size: 14px;
    font-weight: 900;
  }

  .ceg-comparison-cta__actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
  }

  .ceg-comparison-buy {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    min-height: 36px;
    padding: 8px 12px;
    border-radius: 7px;
    background: #16a34a;
    color: #fff !important;
    font-size: 13px;
    font-weight: 900;
    text-decoration: none !important;
  }

  .ucpiq-compare-score-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:10px; margin:14px 0; }
  .ucpiq-compare-score,.ucpiq-compare-criterion { padding:12px; border:1px solid #dbeafe; border-radius:9px; background:#fff; }
  .ucpiq-compare-score span { display:block; color:#64748b; font-size:12px; font-weight:800; }
  .ucpiq-compare-score strong { display:block; margin-top:4px; color:var(--primary); font-size:18px; }
  .ucpiq-compare-criterion { margin-top:10px; }
  .ucpiq-comparison-list { margin-top:16px; }

  @media (max-width: 767px) {
    .ucpiq-compare-score-grid { grid-template-columns:1fr; }
    .ceg-reviews-backdrop {
      align-items: flex-start;
      padding: 12px;
      overflow-x: hidden;
      overflow-y: auto;
    }

    .ceg-reviews-modal {
      width: calc(100vw - 24px);
      max-width: calc(100vw - 24px);
      max-height: calc(100vh - 24px);
      max-height: calc(100dvh - 24px);
      margin: auto 0;
      overflow-x: hidden;
      overflow-y: auto;
      border-radius: 10px;
      box-sizing: border-box;
    }

    .ceg-reviews-header {
      padding: 13px 14px;
    }

    .ceg-reviews-title {
      font-size: 20px;
    }

    .ceg-reviews-close {
      width: 44px;
      height: 44px;
      min-width: 44px;
      min-height: 44px;
    }

    .ceg-reviews-body {
      min-height: 0;
      overflow-y: auto;
      -webkit-overflow-scrolling: touch;
      padding: 14px 14px 18px;
    }

    .ceg-reviews-privacy,
    .ceg-reviews-cta,
    .ceg-review-card,
    .ceg-review-section {
      padding: 12px;
    }

    .ceg-reviews-list {
      grid-template-columns: minmax(0, 1fr);
    }

    .ceg-review-card__top {
      display: block;
    }

    .ceg-review-card__date {
      display: block;
      margin-top: 5px;
    }

    .ceg-reviews-cta {
      align-items: stretch;
      flex-direction: column;
    }

    .ceg-reviews-cta__button {
      width: 100%;
      min-height: 44px;
      white-space: normal;
    }

    .ceg-review-card__actions {
      align-items: stretch;
      flex-direction: column;
      flex-wrap: wrap;
    }

    .ceg-review-action {
      width: 100%;
      min-height: 44px;
      white-space: normal;
    }

    .ceg-reviews-launch {
      min-height: 44px;
    }

    .ceg-review-index-grid {
      grid-template-columns: minmax(0, 1fr);
    }

    .ceg-comparison-version-grid,
    .ceg-comparison-index-grid {
      grid-template-columns: minmax(0, 1fr);
    }

    .ceg-comparison-selector,
    .ceg-comparison-version,
    .ceg-comparison-index,
    .ceg-comparison-section,
    .ceg-comparison-cta {
      padding: 12px;
    }

    .ceg-comparison-selector__select,
    .ceg-comparison-buy {
      min-height: 44px;
    }

    .ceg-comparison-cta__actions {
      align-items: stretch;
      flex-direction: column;
    }

    .ceg-comparison-buy {
      width: 100%;
      box-sizing: border-box;
    }

    .ceg-review-risk-badges {
      max-width: 100%;
      flex-wrap: wrap;
    }

    .ceg-review-risk-badge {
      max-width: 100%;
      box-sizing: border-box;
      overflow-wrap: anywhere;
      white-space: normal;
    }
  }

  .ceg-report-review-button { margin-top: 16px; background: transparent; color: #475569; }
  /* M3k (16-10-2026): el z-index era 1000001, por debajo del backdrop de My Reviews (2147483000), así
     que el formulario de reporte se abría DETRÁS de la capa de My Reviews y parecía no hacer nada. */
  .ceg-report-backdrop { position: fixed; z-index: 2147483001; inset: 0; display: none; align-items: center; justify-content: center; padding: 16px; background: rgba(15, 23, 42, .72); }
  .ceg-report-backdrop.is-open { display: flex; }
  .ceg-report-modal { width: min(560px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; box-sizing: border-box; padding: 22px; border-radius: 14px; background: #fff; color: #132238; }
  .ceg-report-header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
  .ceg-report-title { margin: 0; font-size: 21px; }
  .ceg-report-close { border: 0; background: #f1f5f9; border-radius: 999px; width: 36px; height: 36px; cursor: pointer; }
  .ceg-report-field { display: grid; gap: 7px; margin-top: 16px; font-weight: 700; }
  .ceg-report-field select, .ceg-report-field textarea { width: 100%; box-sizing: border-box; padding: 10px 12px; border: 1px solid #cbd5e1; border-radius: 8px; font: inherit; }
  .ceg-report-consent { display: flex; align-items: flex-start; gap: 9px; margin: 16px 0; }
  .ceg-report-message { min-height: 22px; margin: 12px 0; color: #475569; }
  .ceg-report-message.is-error { color: #b91c1c; }
  .ceg-report-actions { display: flex; justify-content: flex-end; gap: 10px; }
  .ceg-report-submit { border: 0; border-radius: 8px; padding: 10px 16px; background: #1d4ed8; color: #fff; font: inherit; font-weight: 800; cursor: pointer; }
  /* M8 (17-10-2026 · regla 6): el giro y el aviso de la ESO pedida desde My Reviews, como en la home. */
  .ceg-report-processing { display: flex; align-items: center; justify-content: center; gap: 0.6rem; margin: 12px 0; padding: 0.7rem 0.9rem; border: 1px solid #bfdbfe; border-radius: 8px; background: #eff6ff; color: #334155; font-size: 0.88rem; font-weight: 600; }
  .ceg-report-processing-spinner { display: inline-block; width: 16px; height: 16px; flex: 0 0 auto; border: 2px solid #cbd5e1; border-top-color: #1d4ed8; border-radius: 50%; animation: ucpiqSpin 0.8s linear infinite; }