@charset "UTF-8";

body {
    font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
    line-height: 1.6;
    margin: 0;
    padding: 0;
    background-color: #f4f4f4;
    color: #333;
    display: flex;
    flex-direction: column;
    min-height: 100vh;
}

header {
    background: #fff;
    box-shadow: 0 2px 5px rgba(0,0,0,0.1);
    position: sticky;
    top: 0;
    z-index: 100;
}

nav {
    display: flex;
    justify-content: space-between;
    align-items: center;
    max-width: 1200px;
    margin: 0 auto;
    padding: 1rem 2rem;
}

.logo {
    font-size: 1.5rem;
    font-weight: bold;
    color: #0056b3;
}

.nav-links {
    list-style: none;
    display: flex;
    gap: 20px;
}

.nav-links a {
    text-decoration: none;
    color: #333;
    font-weight: 500;
}

.nav-links a:hover {
    color: #0056b3;
}

main {
    flex: 1;
    max-width: 1200px;
    margin: 20px auto;
    padding: 0 20px;
    width: 100%;
    box-sizing: border-box;
}

footer {
    background: #071c3e;
    color: #fff;
    text-align: center;
    padding: 1.5rem 1rem;
    margin-top: auto;
}

footer p {
    margin: .5rem 0 0;
    opacity: .82;
}

.footer-brand {
    background: #ffffff;
    border-radius: 12px;
    display: inline-block;
    padding: 8px 12px;
}

.footer-brand img {
    display: block;
    filter: drop-shadow(0 8px 16px rgba(0, 0, 0, .2));
    height: auto;
    width: 112px;
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 8px 18px;
    justify-content: center;
    margin: 16px auto 4px;
    padding: 0;
}

.footer-links a {
    color: #dbeafe;
    font-size: .88rem;
    text-decoration: none;
}

.footer-links a:hover {
    color: #fff;
    text-decoration: underline;
}

.legal-page {
    background: #fff;
    border: 1px solid #dce7ef;
    border-radius: 18px;
    box-shadow: 0 16px 42px rgba(15, 42, 67, .08);
    color: #334155;
    margin: 10px auto 28px;
    max-width: 860px;
    overflow: hidden;
}

.legal-page-hero {
    background: linear-gradient(135deg, #082f73, #0f5f91);
    color: #fff;
    padding: 34px clamp(22px, 5vw, 52px);
    position: static;
}

.legal-page-hero span {
    color: #f6d36d;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
}

.legal-page-hero h1 {
    font-family: Georgia, serif;
    font-size: clamp(1.8rem, 4vw, 2.65rem);
    margin: 6px 0 8px;
}

.legal-page-hero p {
    color: #e5eefc;
    margin: 0;
}

.legal-page > section {
    border-bottom: 1px solid #e5edf3;
    padding: 24px clamp(22px, 5vw, 52px);
}

.legal-page > section:last-child { border-bottom: 0; }
.legal-page h2 { color: #183559; font-size: 1.22rem; margin: 0 0 9px; }
.legal-page p { margin: 0 0 10px; }
.legal-page p:last-child { margin-bottom: 0; }
.legal-page a { color: #0f5f91; font-weight: 700; }

.contact-card {
    align-items: center;
    display: flex;
    gap: 24px;
    justify-content: space-between;
}

.contact-card .btn { text-decoration: none; white-space: nowrap; }

@media (max-width: 560px) {
    .contact-card { align-items: flex-start; flex-direction: column; }
}

/* Bible Reader Styles */
.bible-reader {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

.bible-controls {
    display: flex;
    justify-content: space-between;
    margin-bottom: 20px;
    flex-wrap: wrap;
    gap: 10px;
}

.control-group {
    display: flex;
    gap: 10px;
}

select, .btn {
    padding: 8px 12px;
    border: 1px solid #ddd;
    border-radius: 4px;
    font-size: 1rem;
}

.btn {
    background: #0056b3;
    color: #fff;
    cursor: pointer;
    border: none;
    transition: background 0.3s;
    text-decoration: none;
    display: inline-block;
}

.btn:hover {
    background: #004494;
}

.btn-sm {
    padding: 5px 10px;
    font-size: 0.9rem;
}

.bible-text {
    font-size: 18px;
    line-height: 1.8;
    margin-bottom: 30px;
}

.highlight-verse {
    background-color: #fff3cd;
    transition: background-color 1s;
}

/* Banner Carousel */
.banner-carousel-container {
    position: relative;
    max-width: 100%;
    overflow: hidden;
    height: 400px;
    background: #000;
}

.banner-carousel {
    display: flex;
    transition: transform 0.5s ease-in-out;
    height: 100%;
}

.banner-slide {
    min-width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
    text-align: center;
    position: relative;
}

.banner-slide::before {
    content: '';
    position: absolute;
    top: 0; left: 0; right: 0; bottom: 0;
    background: rgba(0,0,0,0.4);
}

.banner-content {
    position: relative;
    z-index: 2;
    padding: 20px;
    max-width: 800px;
}

.banner-content h1 {
    font-size: 3rem;
    margin-bottom: 10px;
    text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.banner-content p {
    font-size: 1.2rem;
    margin-bottom: 20px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.5);
}

.btn-banner {
    display: inline-block;
    padding: 10px 25px;
    background: #ffc107;
    color: #333;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: background 0.3s;
}

.btn-banner:hover {
    background: #e0a800;
}

.carousel-nav {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    background: rgba(0,0,0,0.5);
    color: #fff;
    border: none;
    padding: 15px;
    cursor: pointer;
    font-size: 1.5rem;
    z-index: 3;
}

.carousel-nav:hover {
    background: rgba(0,0,0,0.8);
}

.prev { left: 0; }
.next { right: 0; }

.carousel-indicators {
    position: absolute;
    bottom: 20px;
    left: 50%;
    transform: translateX(-50%);
    display: flex;
    gap: 10px;
    z-index: 3;
}

.dot {
    width: 12px;
    height: 12px;
    background: rgba(255,255,255,0.5);
    border-radius: 50%;
    cursor: pointer;
}

.dot.active {
    background: #fff;
}

/* Auth Forms */
.auth-container {
    max-width: 400px;
    margin: 50px auto;
    background: #fff;
    padding: 30px;
    border-radius: 8px;
    box-shadow: 0 2px 10px rgba(0,0,0,0.1);
}

.form-group {
    margin-bottom: 15px;
}

.form-group label {
    display: block;
    margin-bottom: 5px;
}

.form-group input {
    width: 100%;
    padding: 10px;
    border: 1px solid #ddd;
    border-radius: 4px;
    box-sizing: border-box;
}

.alert {
    padding: 10px;
    border-radius: 4px;
    margin-bottom: 15px;
}

.alert-danger {
    background: #f8d7da;
    color: #721c24;
}

.alert-success {
    background: #d4edda;
    color: #155724;
}

/* Dictionary */
.dictionary-container {
    background: #fff;
    padding: 20px;
    border-radius: 8px;
    box-shadow: 0 2px 5px rgba(0,0,0,0.05);
}

/* Tabs */
.tabs-container {
    margin-bottom: 0;
    display: flex;
}

.tab-btn {
    padding: 10px 20px;
    background: #e0e0e0;
    border: none;
    border-radius: 5px 5px 0 0;
    cursor: pointer;
    font-weight: 500;
    margin-right: 5px;
    transition: background 0.2s;
}

.tab-btn:hover {
    background: #d0d0d0;
}

.tab-btn.active {
    background: #fff;
    font-weight: bold;
    /* Simulate connection to content below */
    position: relative;
    top: 1px;
    z-index: 1;
}

.verse {
    margin-bottom: 10px;
}

.verse-num {
    font-weight: bold;
    color: #555;
    margin-right: 5px;
    font-size: 0.8em;
    vertical-align: super;
}

.dictionary-page { max-width: 960px; margin: 28px auto; }
.dictionary-header { text-align: center; margin-bottom: 24px; }
.dictionary-header h1 { margin: 4px 0 8px; color: #173b5f; }
.dictionary-eyebrow { color: #8c5a1f; font-size: .82rem; font-weight: 700; letter-spacing: .09em; text-transform: uppercase; }
.dictionary-search { display: flex; align-items: center; gap: 10px; max-width: 720px; margin: 0 auto; padding: 4px 16px; border: 1px solid #b9c6d2; border-radius: 999px; background: #fff; box-shadow: 0 5px 18px rgba(23,59,95,.08); }
.dictionary-search:focus-within { border-color: #286da8; box-shadow: 0 0 0 3px rgba(40,109,168,.15); }
.dictionary-search input { width: 100%; padding: 12px 0; border: 0; outline: 0; font-size: 1rem; background: transparent; }
.dictionary-status { min-height: 24px; margin: 12px 0 18px; text-align: center; color: #627282; }
.dictionary-results { display: grid; gap: 14px; }
.dictionary-entry { padding: 20px; border: 1px solid #e0e6eb; border-radius: 12px; background: #fff; }
.dictionary-entry-title { display: flex; justify-content: space-between; align-items: baseline; gap: 16px; border-bottom: 1px solid #edf0f2; margin-bottom: 12px; padding-bottom: 10px; }
.dictionary-entry-title h2 { margin: 0; color: #175a91; font-size: 1.25rem; }
.dictionary-entry-title span { font-family: 'Ezra SIL','SBL Hebrew',serif; font-size: 1.8rem; color: #173b5f; }
.dictionary-explanation { line-height: 1.65; }

.verse-comment-link {
    color: inherit;
    text-decoration: underline;
    text-decoration-color: #0d6efd;
    text-decoration-thickness: 2px;
    text-underline-offset: 3px;
    cursor: pointer;
}

.verse-comment-link:hover {
    color: #0d6efd;
}

.comments-section {
    margin-top: 40px;
    background: #fff;
    padding: 20px;
    border-radius: 8px;
}

.comment {
    border-bottom: 1px solid #eee;
    padding: 15px 0;
    color: #0056b3; /* Azul */
}

.no-copy {
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.comment-header {
    font-size: 0.9em;
    color: #777;
    margin-bottom: 5px;
}

.login-prompt {
    background: #e8f4fd;
    padding: 15px;
    border-radius: 4px;
    text-align: center;
}

/* Hebrew Course Ad */
.ad-section {
    background: linear-gradient(135deg, #fdfbfb 0%, #ebedee 100%);
    border: 1px solid #e1e1e1;
    overflow: hidden;
}

.ad-content {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
}

.ad-text {
    flex: 2;
}

.ad-text h2 {
    color: #0056b3;
    margin-top: 0;
}

.ad-features {
    list-style: none;
    padding: 0;
    margin: 20px 0;
}

.ad-features li {
    margin-bottom: 8px;
    font-size: 1.1em;
}

.btn-ad {
    display: inline-block;
    padding: 12px 30px;
    background: #28a745;
    color: #fff;
    text-decoration: none;
    border-radius: 5px;
    font-weight: bold;
    transition: transform 0.2s, background 0.2s;
}

.btn-ad:hover {
    background: #218838;
    transform: translateY(-2px);
}

.ad-image {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.hebrew-letter {
    font-size: 150px;
    font-family: 'Ezra SIL', 'SBL Hebrew', serif;
    color: #0056b3;
    opacity: 0.2;
    transform: rotate(-10deg);
}

@media (max-width: 768px) {
    .ad-content {
        flex-direction: column;
        text-align: center;
    }
    
    .hebrew-letter {
        font-size: 100px;
    }
    
    .nav-links {
        display: none; /* Simplificação para mobile por enquanto */
    }
}

/* Hebrew Words Interaction */
.hebrew-word {
    cursor: pointer;
    transition: color 0.2s, background-color 0.2s;
    border-radius: 3px;
    padding: 0 2px;
    border: 0;
    background: transparent;
    font-family: 'Ezra SIL', 'SBL Hebrew', serif;
    font-size: 1.5em;
    line-height: 1.2;
}

.hebrew-word:hover {
    color: #0056b3;
    background-color: #e8f4fd;
}

/* Modal Styles */
.modal {
    display: none; 
    position: fixed; 
    z-index: 1000; 
    left: 0;
    top: 0;
    width: 100%; 
    height: 100%; 
    overflow: auto; 
    background-color: rgb(0,0,0); 
    background-color: rgba(0,0,0,0.4); 
}

.modal-content {
    background-color: #fefefe;
    margin: 15% auto; 
    padding: 20px;
    border: 1px solid #888;
    width: 80%; 
    max-width: 600px;
    border-radius: 8px;
    position: relative;
    animation: modalFadeIn 0.3s;
}

@keyframes modalFadeIn {
    from {opacity: 0; transform: translateY(-50px);}
    to {opacity: 1; transform: translateY(0);}
}

.close-modal {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
    cursor: pointer;
}

.close-modal:hover,
.close-modal:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

/* Share Tooltip Styles */
#share-tooltip {
    position: absolute;
    display: none;
    background-color: #333;
    border-radius: 4px;
    padding: 5px;
    box-shadow: 0 4px 6px rgba(0,0,0,0.1);
    z-index: 2000;
    white-space: nowrap;
}

#share-tooltip::after {
    content: "";
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -5px;
    border-width: 5px;
    border-style: solid;
    border-color: #333 transparent transparent transparent;
}

#share-tooltip button {
    background: none;
    border: none;
    color: white;
    cursor: pointer;
    padding: 5px 10px;
    font-size: 14px;
    display: inline-flex;
    align-items: center;
    gap: 5px;
    transition: background-color 0.2s;
    border-radius: 3px;
}

#share-tooltip button:hover {
    background-color: #555;
}

#share-tooltip .divider {
    display: inline-block;
    width: 1px;
    height: 14px;
    background-color: #555;
    vertical-align: middle;
    margin: 0 2px;
}

.hebrew-word:focus-visible { outline: 2px solid #0056b3; outline-offset: 3px; }
.dictionary-sheet[hidden] { display: none; }
.dictionary-sheet { position: fixed; inset: 0; z-index: 3000; }
.dictionary-sheet-backdrop { position: absolute; inset: 0; background: rgba(8,20,34,.48); opacity: 0; transition: opacity .3s ease; }
.dictionary-sheet-panel { position: absolute; left: 0; right: 0; bottom: 0; max-height: min(78vh,720px); overflow-y: auto; box-sizing: border-box; padding: 18px max(24px,calc((100vw - 900px)/2)) 28px; background: #fff; border-radius: 22px 22px 0 0; box-shadow: 0 -12px 35px rgba(0,0,0,.22); transform: translateY(105%); transition: transform .32s cubic-bezier(.22,.8,.3,1); }
.dictionary-sheet.is-open .dictionary-sheet-backdrop { opacity: 1; }
.dictionary-sheet.is-open .dictionary-sheet-panel { transform: translateY(0); }
.dictionary-sheet-handle { width: 48px; height: 5px; margin: 0 auto 14px; border-radius: 999px; background: #cbd3da; }
.dictionary-sheet-close { position: absolute; top: 12px; right: 20px; border: 0; background: transparent; color: #52606d; font-size: 32px; cursor: pointer; }
.dictionary-sheet-hebrew { direction: rtl; font-family: 'Ezra SIL','SBL Hebrew',serif; font-size: 2.2em; margin: 0 0 12px; color: #173b5f; }
body.dictionary-sheet-open { overflow: hidden; }
@media (prefers-reduced-motion: reduce) { .dictionary-sheet-backdrop, .dictionary-sheet-panel { transition: none; } }

#selection-comment-menu {
    position: absolute;
    background: #ffffff;
    border: 1px solid #d7dde5;
    border-radius: 6px;
    box-shadow: 0 12px 30px rgba(15, 23, 42, 0.18);
    min-width: 240px;
    padding: 4px;
    z-index: 2100;
}

#selection-comment-menu button {
    background: transparent;
    border: 0;
    border-radius: 4px;
    color: #1f2937;
    cursor: pointer;
    display: block;
    font-size: 14px;
    padding: 9px 11px;
    text-align: left;
    width: 100%;
}

#selection-comment-menu button:hover,
#selection-comment-menu button:focus-visible {
    background: #eef4ff;
    color: #0f3b63;
    outline: none;
}

.hebrew-verse-play-btn {
    align-items: center;
    background: #0f3b63;
    border: 0;
    border-radius: 999px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    height: 32px;
    justify-content: center;
    margin-top: 7px;
    transition: background-color .2s ease, transform .2s ease, box-shadow .2s ease;
    width: 32px;
}

.hebrew-verse-play-btn:hover:not(:disabled),
.hebrew-verse-play-btn:focus-visible {
    background: #8c5a1f;
    box-shadow: 0 0 0 3px rgba(140, 90, 31, .2);
    outline: none;
    transform: scale(1.06);
}

.hebrew-verse-play-btn.is-playing {
    background: #b42318;
}

.hebrew-verse-play-btn:disabled {
    background: #b8c1ca;
    cursor: not-allowed;
    opacity: .7;
}

.word-pair[data-audio-url] {
    border-radius: 6px;
    transition: background-color .18s ease, box-shadow .18s ease;
}

.hebrew-word-play-btn,
.hebrew-word-play-placeholder {
    height: 25px;
    margin-bottom: 2px;
    width: 25px;
}

.hebrew-word-play-btn {
    align-items: center;
    background: #0f3b63;
    border: 0;
    border-radius: 999px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font-size: 10px;
    justify-content: center;
    opacity: .35;
    pointer-events: auto;
    transform: translateY(4px) scale(.88);
    transition: opacity .16s ease, transform .16s ease, background-color .16s ease, box-shadow .16s ease;
}

.word-pair:hover .hebrew-word-play-btn,
.word-pair:focus-within .hebrew-word-play-btn,
.hebrew-word-play-btn:focus-visible,
.hebrew-word-play-btn.is-playing {
    opacity: 1;
    pointer-events: auto;
    transform: translateY(0) scale(1);
}

.hebrew-word-play-btn:hover,
.hebrew-word-play-btn:focus-visible {
    background: #8c5a1f;
    box-shadow: 0 0 0 3px rgba(140, 90, 31, .2);
    outline: none;
}

.hebrew-word-play-btn.is-playing {
    background: #b42318;
}

.word-pair.is-audio-playing {
    background: #fff1c7;
    box-shadow: 0 0 0 3px #fff1c7;
}

@media (hover: none) {
    .hebrew-word-play-btn {
        opacity: .72;
        pointer-events: auto;
        transform: none;
    }
}

.bible-public-intro {
    background: linear-gradient(135deg, #f7efe0 0%, #eef5fb 100%);
    border: 1px solid #d9e3ef;
    border-radius: 12px;
    margin-bottom: 20px;
    padding: 22px 24px;
}

.bible-public-eyebrow {
    color: #8c5a1f;
    display: block;
    font-size: .8rem;
    font-weight: 800;
    letter-spacing: .08em;
    margin-bottom: 5px;
    text-transform: uppercase;
}

.bible-public-intro h1 {
    color: #183559;
    font-size: clamp(1.75rem, 4vw, 2.5rem);
    line-height: 1.12;
    margin: 0 0 8px;
}

.bible-public-intro p {
    color: #4d6278;
    margin: 0;
    max-width: 75ch;
}

.bible-reader-title {
    height: 1px;
    margin: -1px;
    overflow: hidden;
    padding: 0;
    position: absolute;
    width: 1px;
    clip: rect(0, 0, 0, 0);
    white-space: nowrap;
}

.bible-student-ranking {
    background: linear-gradient(118deg, #071c3e 0%, #0f3f6d 64%, #0f5f91 100%);
    border: 1px solid rgba(226, 185, 92, .42);
    border-radius: 16px;
    box-shadow: 0 12px 28px rgba(7, 28, 62, .14);
    margin-bottom: 20px;
    overflow: hidden;
    padding: 17px 18px 18px;
}

.bible-ranking-heading {
    align-items: end;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 13px;
}

.bible-ranking-heading span {
    color: #e5bd62;
    display: block;
    font-size: .67rem;
    font-weight: 850;
    letter-spacing: .1em;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.bible-ranking-heading h2 {
    color: #fff;
    font-size: 1.12rem;
    line-height: 1.2;
    margin: 0;
}

.bible-ranking-heading > a {
    color: #dceafa;
    font-size: .76rem;
    font-weight: 750;
    text-decoration: none;
    white-space: nowrap;
}

.bible-ranking-heading > a:hover,
.bible-ranking-heading > a:focus-visible {
    color: #f4cd72;
    text-decoration: underline;
}

.bible-ranking-track {
    display: flex;
    gap: 10px;
    overflow-x: auto;
    padding: 2px 2px 7px;
    scroll-snap-type: x proximity;
    scrollbar-color: rgba(229, 189, 98, .65) rgba(255, 255, 255, .09);
    scrollbar-width: thin;
}

.bible-student-card {
    align-items: center;
    background: rgba(255, 255, 255, .97);
    border: 1px solid rgba(255, 255, 255, .7);
    border-radius: 12px;
    box-shadow: 0 6px 16px rgba(3, 20, 44, .18);
    display: grid;
    flex: 0 0 225px;
    gap: 9px;
    grid-template-columns: auto auto minmax(0, 1fr) auto;
    min-height: 68px;
    padding: 9px 10px 9px 8px;
    scroll-snap-align: start;
}

.bible-student-card.is-me {
    box-shadow: 0 0 0 2px #e5bd62, 0 7px 18px rgba(3, 20, 44, .25);
}

.bible-student-position {
    color: #60758d;
    font-size: .69rem;
    min-width: 22px;
    text-align: center;
}

.bible-student-card.is-position-1 .bible-student-position { color: #b97819; }
.bible-student-card.is-position-2 .bible-student-position { color: #68788a; }
.bible-student-card.is-position-3 .bible-student-position { color: #a56d45; }

.bible-student-photo-wrap {
    align-items: center;
    display: flex;
    height: 49px;
    justify-content: center;
    position: relative;
    width: 44px;
}

.bible-student-crown {
    color: #f2bd3f;
    filter: drop-shadow(0 1px 1px rgba(91, 54, 0, .55));
    font-size: .82rem;
    left: 50%;
    line-height: 1;
    position: absolute;
    top: -4px;
    transform: translateX(-50%) rotate(-2deg);
    z-index: 2;
}

.bible-student-photo {
    align-items: center;
    background: linear-gradient(145deg, #0f5f91, #183559);
    border: 2px solid #e8c36f;
    border-radius: 50%;
    color: #fff;
    display: flex;
    flex: 0 0 44px;
    font-size: .76rem;
    font-weight: 900;
    height: 44px;
    justify-content: center;
    overflow: hidden;
    position: relative;
    width: 44px;
}

.bible-student-photo img {
    height: 100%;
    object-fit: cover;
    width: 100%;
}

.bible-student-details { min-width: 0; }
.bible-student-details strong {
    color: #183559;
    display: block;
    font-size: .77rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.bible-student-details small {
    color: #718096;
    display: block;
    font-size: .59rem;
    margin-top: 2px;
    white-space: nowrap;
}

.bible-student-score {
    color: #b97819;
    line-height: .9;
    text-align: right;
}

.bible-student-score b { display: block; font-size: .84rem; }
.bible-student-score small { font-size: .55rem; font-weight: 850; letter-spacing: .06em; }

.bible-ranking-empty {
    align-items: center;
    background: rgba(255, 255, 255, .96);
    border-radius: 12px;
    display: flex;
    gap: 12px;
    padding: 11px 13px;
}

.bible-ranking-empty > span {
    align-items: center;
    background: #edf5fb;
    border-radius: 50%;
    color: #0f5f91;
    display: flex;
    flex: 0 0 38px;
    height: 38px;
    justify-content: center;
}

.bible-ranking-empty p { color: #607086; flex: 1; font-size: .75rem; margin: 0; }
.bible-ranking-empty p strong { color: #183559; display: block; }
.bible-ranking-empty a { color: #0f5f91; font-size: .72rem; font-weight: 800; white-space: nowrap; }

@media (max-width: 560px) {
    .bible-student-ranking { border-radius: 13px; margin-left: -8px; margin-right: -8px; padding: 14px 12px 15px; }
    .bible-ranking-heading h2 { font-size: 1rem; }
    .bible-student-card { flex-basis: 210px; }
    .bible-ranking-empty { align-items: flex-start; flex-wrap: wrap; }
    .bible-ranking-empty p { min-width: calc(100% - 54px); }
    .bible-ranking-empty a { margin-left: 50px; }
}

.server-rendered-chapter h2 {
    color: #183559;
    margin-top: 0;
}

.bible-reading-mode {
    align-items: center;
    background: linear-gradient(110deg, #edf6f8, #fff);
    border: 1px solid #c9dde5;
    border-radius: 12px 12px 0 0;
    color: #183559;
    gap: 10px;
    margin-top: 14px;
    padding: 11px 14px;
}

.bible-reading-mode > span {
    align-items: center;
    background: #0f5f91;
    border-radius: 9px;
    color: #fff;
    display: flex;
    height: 36px;
    justify-content: center;
    width: 36px;
}

.bible-reading-mode small, .bible-reading-mode strong { display: block; }
.bible-reading-mode small { color: #718096; font-size: .61rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.bible-reading-mode strong { font-size: .88rem; }
.bible-loading-state { color: #718096; padding: 22px; text-align: center; }

.server-rendered-chapter > header {
    background: #f4f8fb;
    border-bottom: 1px solid #dce7ef;
    padding: 20px;
    position: static;
}

.server-rendered-chapter > header h2 {
    color: #183559;
    font-family: Georgia, serif;
    margin: 0 0 6px;
}

.server-rendered-chapter > header p {
    color: #526579;
    margin: 0;
}

.server-interlinear-list {
    list-style: none;
    margin: 0;
    padding: 0;
}

.server-interlinear-verse {
    border-bottom: 1px solid #e5edf3;
    padding: 22px 22px 20px 62px;
    position: relative;
}

.server-verse-number {
    align-items: center;
    background: #0f5f91;
    border-radius: 50%;
    color: #fff;
    display: flex;
    font-size: .8rem;
    font-weight: 800;
    height: 30px;
    justify-content: center;
    left: 18px;
    position: absolute;
    top: 24px;
    width: 30px;
}

.server-interlinear-verse strong {
    color: #64748b;
    display: block;
    font-size: .68rem;
    letter-spacing: .08em;
    margin-bottom: 2px;
    text-transform: uppercase;
}

.server-interlinear-verse p { margin: 0; }
.server-original-line p { color: #111827; font-family: "Ezra SIL", "SBL Hebrew", serif; font-size: 1.55rem; line-height: 1.65; }
.server-transliteration-line { margin-top: 7px; }
.server-transliteration-line p { color: #1d4ed8; font-style: italic; }
.server-portuguese-line { border-top: 1px solid #e2e8f0; margin-top: 10px; padding-top: 10px; }
.server-portuguese-line p { color: #334155; }

.server-chapter-navigation {
    display: flex;
    gap: 16px;
    justify-content: space-between;
    padding: 18px 4px 2px;
}

.server-chapter-navigation a,
.server-book-chapters a {
    background: #0f5f91;
    border-radius: 8px;
    color: #fff;
    font-weight: 700;
    padding: 8px 12px;
    text-decoration: none;
}

.server-book-chapters {
    padding: 20px;
}

.server-book-chapters nav {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0;
}

.server-book-chapters a {
    min-width: 24px;
    text-align: center;
}

@media (max-width: 560px) {
    .server-interlinear-verse { padding-left: 48px; padding-right: 14px; }
    .server-verse-number { height: 26px; left: 12px; width: 26px; }
    .server-original-line p { font-size: 1.32rem; }
}

.tab-btn.is-private {
    align-items: center;
    display: inline-flex;
    gap: 5px;
}

.private-tab-message {
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 12px;
    margin: 10px auto;
    max-width: 620px;
    padding: 34px 24px;
    text-align: center;
}

.private-tab-message h2 {
    color: #183559;
    margin: 8px 0;
}

.private-tab-message p {
    color: #526579;
    margin: 0 auto 18px;
    max-width: 52ch;
}

.private-tab-icon {
    display: block;
    font-size: 2rem;
}

.hebrew-verse-body {
    flex: 1 1 auto;
    min-width: 0;
}

.hebrew-verse-portuguese {
    border-top: 1px solid #e2e8f0;
    color: #334155;
    font-family: system-ui, -apple-system, "Segoe UI", sans-serif;
    font-size: .95rem;
    line-height: 1.55;
    margin-top: 6px;
    padding: 10px 4px 2px;
    text-align: left;
}

.hebrew-verse-portuguese-label {
    color: #64748b;
    font-size: .78rem;
    font-weight: 800;
    letter-spacing: .04em;
    margin-right: 5px;
    text-transform: uppercase;
}

/* Login: learning-focused landing page */
.login-learning-page {
    padding: 18px 0 34px;
}

.login-learning-shell {
    background: #ffffff;
    border: 1px solid rgba(15, 59, 99, .1);
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(15, 42, 67, .14);
    display: grid;
    grid-template-columns: minmax(0, 1.2fr) minmax(360px, .8fr);
    min-height: 650px;
    overflow: hidden;
}

.login-learning-marketing {
    background:
        radial-gradient(circle at 90% 8%, rgba(224, 177, 96, .23), transparent 28%),
        radial-gradient(circle at 5% 92%, rgba(87, 151, 187, .28), transparent 30%),
        linear-gradient(145deg, #092b48 0%, #0f466b 58%, #145977 100%);
    color: #ffffff;
    overflow: hidden;
    padding: clamp(36px, 5vw, 64px);
    position: relative;
}

.login-learning-marketing::after {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
    content: '';
    height: 280px;
    position: absolute;
    right: -145px;
    top: 38%;
    width: 280px;
}

.login-learning-eyebrow,
.login-access-kicker {
    display: block;
    font-size: .76rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.login-learning-eyebrow {
    color: #f3cb84;
    margin-bottom: 12px;
}

.login-learning-marketing h1 {
    color: #ffffff;
    font-size: clamp(2.25rem, 5vw, 4.15rem);
    letter-spacing: -.04em;
    line-height: 1.02;
    margin: 0 0 20px;
    max-width: 12ch;
}

.login-learning-lead {
    color: rgba(255, 255, 255, .82);
    font-size: 1.08rem;
    line-height: 1.7;
    margin: 0 0 28px;
    max-width: 61ch;
}

.login-reading-example {
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 16px;
    box-shadow: inset 0 1px 0 rgba(255, 255, 255, .08);
    margin-bottom: 28px;
    padding: 20px 22px;
    position: relative;
    z-index: 1;
}

.login-reading-header {
    align-items: center;
    color: rgba(255, 255, 255, .68);
    display: flex;
    font-size: .76rem;
    font-weight: 700;
    gap: 12px;
    justify-content: space-between;
    letter-spacing: .03em;
    margin-bottom: 14px;
    text-transform: uppercase;
}

.login-reading-reference {
    background: rgba(243, 203, 132, .16);
    border-radius: 999px;
    color: #f7dba8;
    padding: 4px 9px;
    white-space: nowrap;
}

.login-reading-line {
    border-top: 1px solid rgba(255, 255, 255, .1);
    padding: 10px 0 0;
}

.login-reading-hebrew {
    border-top: 0;
    color: #ffffff;
    font-family: "SBL Hebrew", "Ezra SIL", "Times New Roman", serif;
    font-size: clamp(1.65rem, 4vw, 2.35rem);
    line-height: 1.25;
    padding-top: 0;
    text-align: right;
}

.login-reading-transliteration {
    color: #f3cb84;
    font-family: Georgia, "Times New Roman", serif;
    font-size: 1.05rem;
    font-style: italic;
    margin-top: 8px;
}

.login-reading-portuguese {
    color: rgba(255, 255, 255, .82);
    font-size: .92rem;
    margin-top: 9px;
}

.login-learning-benefits {
    display: grid;
    gap: 15px;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
}

.login-learning-benefits li {
    align-items: center;
    display: grid;
    gap: 13px;
    grid-template-columns: 42px minmax(0, 1fr);
}

.login-benefit-icon {
    align-items: center;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 11px;
    color: #f3cb84;
    display: inline-flex;
    height: 40px;
    justify-content: center;
    width: 40px;
}

.login-learning-benefits li > span:last-child {
    color: rgba(255, 255, 255, .72);
    font-size: .87rem;
    line-height: 1.45;
}

.login-learning-benefits strong {
    color: #ffffff;
    display: block;
    font-size: .96rem;
    margin-bottom: 1px;
}

.login-access-card {
    align-self: center;
    padding: clamp(34px, 5vw, 58px);
}

.login-access-heading {
    align-items: center;
    display: flex;
    gap: 14px;
    margin-bottom: 16px;
}

.login-access-icon {
    align-items: center;
    background: #0f3b63;
    border-radius: 13px;
    color: #ffffff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.15rem;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.login-access-kicker {
    color: #8c5a1f;
    margin-bottom: 2px;
}

.login-access-heading h2 {
    color: #183559;
    font-size: clamp(1.65rem, 3vw, 2.1rem);
    letter-spacing: -.025em;
    line-height: 1.15;
    margin: 0;
}

.login-access-description {
    color: #64748b;
    font-size: .95rem;
    line-height: 1.6;
    margin: 0 0 26px;
}

.login-feedback {
    align-items: flex-start;
    border: 1px solid;
    border-radius: 10px;
    display: flex;
    font-size: .88rem;
    gap: 9px;
    line-height: 1.45;
    margin-bottom: 18px;
    padding: 11px 12px;
}

.login-feedback-error {
    background: #fff4f2;
    border-color: #fecaca;
    color: #991b1b;
}

.login-feedback-success {
    background: #f0fdf4;
    border-color: #bbf7d0;
    color: #166534;
}

.login-field {
    margin-bottom: 18px;
}

.login-field label {
    color: #334155;
    display: block;
    font-size: .86rem;
    font-weight: 750;
    margin-bottom: 7px;
}

.login-password-label {
    align-items: center;
    display: flex;
    gap: 10px;
    justify-content: space-between;
}

.login-password-label a {
    color: #0f5f91;
    font-size: .8rem;
    font-weight: 700;
    margin-bottom: 7px;
    text-decoration: none;
}

.login-password-label a:hover {
    text-decoration: underline;
}

.login-input-wrap {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    display: flex;
    min-height: 50px;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.login-input-wrap:focus-within {
    background: #ffffff;
    border-color: #0f5f91;
    box-shadow: 0 0 0 4px rgba(15, 95, 145, .12);
}

.login-input-wrap > i {
    color: #8b9aad;
    margin-left: 15px;
    width: 17px;
}

.login-input-wrap input {
    background: transparent;
    border: 0;
    color: #0f172a;
    flex: 1 1 auto;
    font: inherit;
    min-width: 0;
    outline: none;
    padding: 13px 12px;
}

.login-input-wrap input::placeholder {
    color: #94a3b8;
}

.login-password-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    color: #64748b;
    cursor: pointer;
    display: inline-flex;
    height: 46px;
    justify-content: center;
    margin-right: 3px;
    width: 44px;
}

.login-password-toggle:focus-visible {
    border-radius: 8px;
    box-shadow: 0 0 0 3px rgba(15, 95, 145, .18);
    outline: none;
}

.login-submit-btn {
    align-items: center;
    background: #0f3b63;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 10px 24px rgba(15, 59, 99, .2);
    color: #ffffff;
    cursor: pointer;
    display: flex;
    font-size: .96rem;
    font-weight: 800;
    gap: 12px;
    justify-content: center;
    min-height: 52px;
    padding: 12px 18px;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
    width: 100%;
}

.login-submit-btn:hover,
.login-submit-btn:focus-visible {
    background: #14577f;
    box-shadow: 0 13px 28px rgba(15, 59, 99, .26);
    outline: none;
    transform: translateY(-1px);
}

.login-register-callout {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    flex-wrap: wrap;
    font-size: .88rem;
    gap: 6px;
    justify-content: center;
    margin-top: 23px;
    padding-bottom: 21px;
}

.login-register-callout span {
    color: #64748b;
}

.login-register-callout a {
    color: #0f5f91;
    font-weight: 800;
    text-decoration: none;
}

.login-register-callout a:hover {
    text-decoration: underline;
}

.login-access-note {
    align-items: center;
    color: #7b8796;
    display: flex;
    font-size: .76rem;
    gap: 7px;
    justify-content: center;
    line-height: 1.4;
    margin: 17px 0 0;
    text-align: center;
}

.login-access-note i {
    color: #4f8069;
}

@media (max-width: 900px) {
    .login-learning-shell {
        grid-template-columns: 1fr;
    }

    .login-learning-marketing h1 {
        max-width: 15ch;
    }

    .login-access-card {
        max-width: 590px;
        width: 100%;
        box-sizing: border-box;
        justify-self: center;
    }
}

@media (max-width: 560px) {
    .login-learning-page {
        padding-top: 0;
    }

    .login-learning-shell {
        border-radius: 14px;
    }

    .login-learning-marketing,
    .login-access-card {
        padding: 30px 22px;
    }

    .login-learning-marketing h1 {
        font-size: 2.35rem;
    }

    .login-reading-header {
        align-items: flex-start;
        flex-direction: column;
    }

    .login-learning-benefits li {
        align-items: flex-start;
    }
}

/* Register: verified, three-step learning onboarding */
.register-learning-page {
    padding: 18px 0 34px;
}

.register-learning-shell {
    background: #ffffff;
    border: 1px solid rgba(15, 59, 99, .1);
    border-radius: 22px;
    box-shadow: 0 24px 70px rgba(15, 42, 67, .14);
    display: grid;
    grid-template-columns: minmax(0, .92fr) minmax(440px, 1.08fr);
    min-height: 690px;
    overflow: hidden;
}

.register-learning-marketing {
    background:
        radial-gradient(circle at 92% 8%, rgba(224, 177, 96, .24), transparent 26%),
        radial-gradient(circle at 0 88%, rgba(87, 151, 187, .3), transparent 30%),
        linear-gradient(145deg, #092b48 0%, #0f466b 58%, #145977 100%);
    color: #ffffff;
    overflow: hidden;
    padding: clamp(36px, 5vw, 62px);
    position: relative;
}

.register-learning-marketing::after {
    border: 1px solid rgba(255, 255, 255, .12);
    border-radius: 50%;
    content: '';
    height: 310px;
    position: absolute;
    right: -180px;
    top: 42%;
    width: 310px;
}

.register-learning-eyebrow,
.register-access-kicker {
    display: block;
    font-size: .75rem;
    font-weight: 800;
    letter-spacing: .11em;
    text-transform: uppercase;
}

.register-learning-eyebrow {
    color: #f3cb84;
    margin-bottom: 12px;
}

.register-learning-marketing h1 {
    color: #ffffff;
    font-size: clamp(2.35rem, 4.8vw, 4rem);
    letter-spacing: -.04em;
    line-height: 1.02;
    margin: 0 0 20px;
    max-width: 11ch;
}

.register-learning-lead {
    color: rgba(255, 255, 255, .82);
    font-size: 1.04rem;
    line-height: 1.68;
    margin: 0 0 28px;
    max-width: 54ch;
}

.register-method-card {
    align-items: center;
    background: rgba(255, 255, 255, .1);
    border: 1px solid rgba(255, 255, 255, .2);
    border-radius: 16px;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin-bottom: 28px;
    padding: 18px 20px;
    position: relative;
    z-index: 1;
}

.register-method-copy {
    min-width: 0;
}

.register-method-copy > span {
    color: rgba(255, 255, 255, .62);
    display: block;
    font-size: .72rem;
    font-weight: 750;
    letter-spacing: .06em;
    margin-bottom: 7px;
    text-transform: uppercase;
}

.register-method-copy strong {
    color: #ffffff;
    display: block;
    font-family: "SBL Hebrew", "Ezra SIL", "Times New Roman", serif;
    font-size: 2rem;
    font-weight: 500;
    line-height: 1.25;
    text-align: right;
}

.register-method-copy em {
    color: #f3cb84;
    display: block;
    font-family: Georgia, "Times New Roman", serif;
    font-size: .95rem;
    margin-top: 5px;
}

.register-method-copy small {
    color: rgba(255, 255, 255, .72);
    display: block;
    margin-top: 3px;
}

.register-method-play {
    align-items: center;
    background: #f3cb84;
    border-radius: 50%;
    color: #0f3b63;
    display: inline-flex;
    flex: 0 0 auto;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.register-method-play i {
    margin-left: 3px;
}

.register-learning-benefits {
    display: grid;
    gap: 16px;
    list-style: none;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 1;
}

.register-learning-benefits li {
    align-items: flex-start;
    display: grid;
    gap: 12px;
    grid-template-columns: 28px minmax(0, 1fr);
}

.register-learning-benefits li > i {
    align-items: center;
    background: rgba(243, 203, 132, .16);
    border-radius: 50%;
    color: #f3cb84;
    display: inline-flex;
    font-size: .72rem;
    height: 26px;
    justify-content: center;
    margin-top: 2px;
    width: 26px;
}

.register-learning-benefits span {
    color: rgba(255, 255, 255, .7);
    font-size: .86rem;
    line-height: 1.48;
}

.register-learning-benefits strong {
    color: #ffffff;
    display: block;
    font-size: .94rem;
    margin-bottom: 1px;
}

.register-marketing-note {
    align-items: center;
    color: rgba(255, 255, 255, .56);
    display: flex;
    font-size: .75rem;
    gap: 7px;
    margin: 25px 0 0;
    position: relative;
    z-index: 1;
}

.register-access-card {
    align-self: center;
    box-sizing: border-box;
    padding: clamp(34px, 5vw, 58px);
    width: 100%;
}

.register-access-heading {
    align-items: center;
    display: flex;
    gap: 14px;
    margin-bottom: 20px;
}

.register-access-icon {
    align-items: center;
    background: #0f3b63;
    border-radius: 13px;
    color: #ffffff;
    display: inline-flex;
    flex: 0 0 auto;
    font-size: 1.1rem;
    height: 48px;
    justify-content: center;
    width: 48px;
}

.register-access-kicker {
    color: #8c5a1f;
    margin-bottom: 2px;
}

.register-access-heading h2 {
    color: #183559;
    font-size: clamp(1.55rem, 3vw, 2rem);
    letter-spacing: -.025em;
    line-height: 1.16;
    margin: 0;
}

.register-progress {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    list-style: none;
    margin: 0 0 24px;
    padding: 0;
    position: relative;
}

.register-progress::before {
    background: #dfe7ed;
    content: '';
    height: 2px;
    left: 16.66%;
    position: absolute;
    right: 16.66%;
    top: 16px;
}

.register-progress li {
    align-items: center;
    color: #94a3b8;
    display: flex;
    flex-direction: column;
    font-weight: 700;
    gap: 5px;
    position: relative;
    z-index: 1;
}

.register-progress li > span {
    align-items: center;
    background: #f1f5f9;
    border: 2px solid #dfe7ed;
    border-radius: 50%;
    display: inline-flex;
    font-size: .78rem;
    height: 32px;
    justify-content: center;
    width: 32px;
}

.register-progress li > small {
    font-size: .7rem;
}

.register-progress li.is-current {
    color: #0f3b63;
}

.register-progress li.is-current > span {
    background: #0f3b63;
    border-color: #0f3b63;
    box-shadow: 0 0 0 5px rgba(15, 59, 99, .1);
    color: #ffffff;
}

.register-progress li.is-complete {
    color: #4f8069;
}

.register-progress li.is-complete > span {
    background: #4f8069;
    border-color: #4f8069;
    color: #ffffff;
}

.register-access-description {
    color: #64748b;
    font-size: .92rem;
    line-height: 1.55;
    margin: 0 0 21px;
}

.register-access-description strong {
    color: #334155;
}

.register-feedback {
    align-items: flex-start;
    border: 1px solid;
    border-radius: 10px;
    display: flex;
    font-size: .86rem;
    gap: 9px;
    line-height: 1.45;
    margin-bottom: 18px;
    padding: 11px 12px;
}

.register-feedback-error {
    background: #fff4f2;
    border-color: #fecaca;
    color: #991b1b;
}

.register-feedback-success {
    background: #f0fdf4;
    border-color: #bbf7d0;
    color: #166534;
}

.register-field {
    margin-bottom: 16px;
}

.register-field label {
    color: #334155;
    display: block;
    font-size: .84rem;
    font-weight: 750;
    margin-bottom: 7px;
}

.register-field label span {
    color: #94a3b8;
    font-size: .72rem;
    font-weight: 600;
}

.register-field > small {
    color: #7b8796;
    display: block;
    font-size: .73rem;
    margin-top: 6px;
}

.register-input-wrap {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 10px;
    display: flex;
    min-height: 49px;
    transition: border-color .18s ease, box-shadow .18s ease, background .18s ease;
}

.register-input-wrap:focus-within {
    background: #ffffff;
    border-color: #0f5f91;
    box-shadow: 0 0 0 4px rgba(15, 95, 145, .12);
}

.register-input-wrap > i {
    color: #8b9aad;
    margin-left: 14px;
    width: 17px;
}

.register-input-wrap input {
    background: transparent;
    border: 0;
    color: #0f172a;
    flex: 1 1 auto;
    font: inherit;
    min-width: 0;
    outline: none;
    padding: 12px;
}

.register-input-wrap input::placeholder {
    color: #94a3b8;
}

.register-code-input {
    background: #f8fafc;
    border: 1px solid #cbd5e1;
    border-radius: 11px;
    box-sizing: border-box;
    color: #183559;
    font: 800 1.8rem/1 "Segoe UI", sans-serif;
    letter-spacing: .32em;
    outline: none;
    padding: 15px 12px 15px calc(12px + .32em);
    text-align: center;
    transition: border-color .18s ease, box-shadow .18s ease;
    width: 100%;
}

.register-code-input:focus {
    background: #ffffff;
    border-color: #0f5f91;
    box-shadow: 0 0 0 4px rgba(15, 95, 145, .12);
}

.register-form-grid {
    display: grid;
    gap: 14px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
}

.register-password-toggle {
    align-items: center;
    background: transparent;
    border: 0;
    color: #64748b;
    cursor: pointer;
    display: inline-flex;
    flex: 0 0 auto;
    height: 45px;
    justify-content: center;
    margin-right: 3px;
    width: 42px;
}

.register-password-toggle:focus-visible {
    border-radius: 8px;
    box-shadow: 0 0 0 3px rgba(15, 95, 145, .18);
    outline: none;
}

.register-submit-btn {
    align-items: center;
    background: #0f3b63;
    border: 0;
    border-radius: 10px;
    box-shadow: 0 10px 24px rgba(15, 59, 99, .2);
    color: #ffffff;
    cursor: pointer;
    display: flex;
    font-size: .94rem;
    font-weight: 800;
    gap: 12px;
    justify-content: center;
    min-height: 51px;
    padding: 12px 18px;
    transition: background .18s ease, transform .18s ease, box-shadow .18s ease;
    width: 100%;
}

.register-submit-btn:hover,
.register-submit-btn:focus-visible {
    background: #14577f;
    box-shadow: 0 13px 28px rgba(15, 59, 99, .26);
    outline: none;
    transform: translateY(-1px);
}

.register-privacy-note {
    align-items: flex-start;
    color: #7b8796;
    display: flex;
    font-size: .74rem;
    gap: 7px;
    line-height: 1.45;
    margin: 14px 0 0;
}

.register-privacy-note i {
    color: #4f8069;
    margin-top: 3px;
}

.register-secondary-actions {
    align-items: center;
    color: #cbd5e1;
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    justify-content: center;
    margin-top: 17px;
}

.register-secondary-actions form {
    margin: 0;
}

.register-link-button {
    background: transparent;
    border: 0;
    color: #0f5f91;
    cursor: pointer;
    font: inherit;
    font-size: .8rem;
    font-weight: 750;
    padding: 4px;
}

.register-link-button:hover:not(:disabled),
.register-link-button:focus-visible:not(:disabled) {
    text-decoration: underline;
}

.register-link-button:disabled {
    color: #94a3b8;
    cursor: default;
}

.register-verified-email {
    align-items: center;
    background: #f0fdf4;
    border: 1px solid #bbf7d0;
    border-radius: 10px;
    color: #166534;
    display: flex;
    gap: 10px;
    margin-bottom: 18px;
    padding: 10px 12px;
}

.register-verified-email > i {
    font-size: 1.1rem;
}

.register-verified-email small,
.register-verified-email strong {
    display: block;
}

.register-verified-email small {
    font-size: .69rem;
    font-weight: 700;
    text-transform: uppercase;
}

.register-verified-email strong {
    color: #14532d;
    font-size: .84rem;
    overflow-wrap: anywhere;
}

.register-login-callout {
    align-items: center;
    border-top: 1px solid #e2e8f0;
    display: flex;
    flex-wrap: wrap;
    font-size: .85rem;
    gap: 6px;
    justify-content: center;
    margin-top: 22px;
    padding-top: 19px;
}

.register-login-callout span {
    color: #64748b;
}

.register-login-callout a {
    color: #0f5f91;
    font-weight: 800;
    text-decoration: none;
}

.register-login-callout a:hover {
    text-decoration: underline;
}

@media (max-width: 980px) {
    .register-learning-shell {
        grid-template-columns: 1fr;
    }

    .register-learning-marketing h1 {
        max-width: 15ch;
    }

    .register-access-card {
        justify-self: center;
        max-width: 680px;
    }
}

@media (max-width: 620px) {
    .register-learning-page {
        padding-top: 0;
    }

    .register-learning-shell {
        border-radius: 14px;
    }

    .register-learning-marketing,
    .register-access-card {
        padding: 30px 22px;
    }

    .register-learning-marketing h1 {
        font-size: 2.35rem;
    }

    .register-form-grid {
        gap: 0;
        grid-template-columns: 1fr;
    }
}

@media (max-width: 390px) {
    .register-method-card {
        align-items: flex-start;
    }

    .register-method-play {
        height: 42px;
        width: 42px;
    }

    .register-code-input {
        font-size: 1.55rem;
        letter-spacing: .24em;
    }
}

/* Hebrew learning system */
.learning-reader-toolbar {
    align-items: center;
    background: linear-gradient(135deg, #0c3558, #145977);
    border-radius: 12px;
    box-shadow: 0 12px 30px rgba(15, 59, 99, .18);
    color: #fff;
    display: flex;
    flex-wrap: wrap;
    gap: 16px;
    margin: 14px 0;
    padding: 13px 15px;
}

.learning-reader-toolbar[hidden] {
    display: none;
}

.learning-reader-toolbar-title {
    align-items: center;
    display: flex;
    flex: 1 1 280px;
    gap: 11px;
}

.learning-reader-toolbar-title > span {
    align-items: center;
    background: rgba(243, 203, 132, .16);
    border: 1px solid rgba(243, 203, 132, .28);
    border-radius: 9px;
    color: #f3cb84;
    display: inline-flex;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.learning-reader-toolbar-title strong,
.learning-reader-toolbar-title small {
    display: block;
}

.learning-reader-toolbar-title small {
    color: rgba(255, 255, 255, .68);
    font-size: .73rem;
}

.learning-reader-toolbar > label {
    align-items: center;
    display: flex;
    gap: 8px;
}

.learning-reader-toolbar > label > span {
    font-size: .75rem;
    font-weight: 700;
}

.learning-reader-toolbar select {
    background: rgba(255, 255, 255, .12);
    border: 1px solid rgba(255, 255, 255, .24);
    border-radius: 7px;
    color: #fff;
    font: inherit;
    font-size: .8rem;
    padding: 7px 9px;
}

.learning-reader-toolbar select option {
    color: #183559;
}

.learning-reader-check input {
    accent-color: #f3cb84;
    height: 17px;
    width: 17px;
}

.learning-reader-toolbar > a {
    background: #f3cb84;
    border-radius: 8px;
    color: #183559;
    font-size: .78rem;
    font-weight: 800;
    padding: 8px 11px;
    text-decoration: none;
}

.learning-grammar-legend {
    display: none;
    flex: 1 0 100%;
    gap: 12px;
    justify-content: flex-end;
}

.learning-reader-toolbar:has(#learning-grammar-colors:checked) .learning-grammar-legend {
    display: flex;
}

.learning-grammar-legend span {
    align-items: center;
    color: rgba(255,255,255,.72);
    display: inline-flex;
    font-size: .65rem;
    gap: 4px;
}

.learning-grammar-legend span::before {
    background: currentColor;
    border-radius: 50%;
    content: '';
    height: 7px;
    width: 7px;
}

.learning-grammar-legend .is-verb { color: #c4a5ff; }
.learning-grammar-legend .is-noun { color: #83c9ee; }
.learning-grammar-legend .is-adjective { color: #ffd18b; }
.learning-grammar-legend .is-particle { color: #83ddb8; }

.learning-grammar-colors .word-pair[data-grammar="verb"] .hebrew-word { color: #7c3aed; }
.learning-grammar-colors .word-pair[data-grammar="noun"] .hebrew-word { color: #0f5f91; }
.learning-grammar-colors .word-pair[data-grammar="adjective"] .hebrew-word { color: #d97706; }
.learning-grammar-colors .word-pair[data-grammar="particle"] .hebrew-word { color: #16875b; }

.verse-learning-actions {
    border-top: 1px dashed #d8e1e9;
    margin-top: 9px;
    padding: 10px 3px 3px;
    text-align: left;
}

.verse-practiced-badge {
    align-items: center;
    background: linear-gradient(135deg, #17603d, #2f8a60);
    border: 1px solid rgba(255,255,255,.4);
    border-radius: 999px;
    box-shadow: 0 3px 10px rgba(23,96,61,.2);
    color: #fff;
    display: inline-flex;
    font: 800 .68rem/1 "Segoe UI", sans-serif;
    gap: 5px;
    letter-spacing: .02em;
    margin-bottom: 8px;
    padding: 6px 10px;
    text-transform: uppercase;
}

.verse-practiced-badge i {
    color: #ffe29a;
    font-size: .78rem;
}

.verse-learning-steps {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-bottom: 8px;
}

.verse-learning-steps span {
    align-items: center;
    background: #f1f5f9;
    border-radius: 999px;
    color: #7b8796;
    display: inline-flex;
    font-family: "Segoe UI", sans-serif;
    font-size: .67rem;
    font-weight: 700;
    gap: 4px;
    padding: 4px 8px;
}

.verse-learning-steps span.is-complete {
    background: #e9f7ef;
    color: #23704a;
}

.verse-learning-buttons {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.verse-learning-buttons button {
    align-items: center;
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    color: #3e536b;
    cursor: pointer;
    display: inline-flex;
    font: 700 .71rem/1 "Segoe UI", sans-serif;
    gap: 5px;
    min-height: 31px;
    padding: 6px 8px;
}

.verse-learning-buttons button:hover,
.verse-learning-buttons button:focus-visible,
.verse-learning-buttons button.is-active {
    background: #eef6fa;
    border-color: #0f5f91;
    color: #0f5f91;
    outline: none;
}

.verse-learning-buttons button.is-primary {
    background: #0f3b63;
    border-color: #0f3b63;
    color: #fff;
}

.verse-learning-buttons button.is-practiced {
    background: #e9f7ef;
    border-color: #71a98b;
    color: #17603d;
}

.verse.is-learning-practiced .verse-container {
    background: linear-gradient(90deg, rgba(255, 247, 218, .82), transparent 58%);
}

.verse.is-learning-complete .verse-container {
    background: linear-gradient(90deg, rgba(232, 248, 239, .76), transparent 55%);
}

.learning-level-iniciante .verse-learning-buttons [data-learning-reveal] {
    display: none;
}

.learning-level-intermediario .verse:not(.show-transliteration) .translit-word,
.learning-level-avancado .verse:not(.show-transliteration) .translit-word {
    filter: blur(5px);
    opacity: .2;
    user-select: none;
}

.learning-level-avancado .verse:not(.show-translation) .hebrew-verse-portuguese {
    max-height: 8px;
    opacity: .08;
    overflow: hidden;
    padding-bottom: 0;
    user-select: none;
}

.learning-grammar-colors .word-pair {
    border-top: 3px solid transparent;
    padding-top: 2px;
}

.learning-grammar-colors .word-pair[data-grammar="verb"] { border-top-color: #7c3aed; }
.learning-grammar-colors .word-pair[data-grammar="noun"] { border-top-color: #0f5f91; }
.learning-grammar-colors .word-pair[data-grammar="adjective"] { border-top-color: #d97706; }
.learning-grammar-colors .word-pair[data-grammar="particle"] { border-top-color: #16875b; }

.learning-word-card-header {
    align-items: center;
    border-bottom: 1px solid #e2e8f0;
    display: flex;
    gap: 18px;
    justify-content: space-between;
    margin-bottom: 17px;
    padding-bottom: 14px;
}

.learning-word-card-header > div > span {
    color: #8c5a1f;
    font-size: .7rem;
    font-weight: 800;
    letter-spacing: .08em;
    text-transform: uppercase;
}

.learning-word-card-header .dictionary-sheet-hebrew {
    margin: 3px 0 0;
}

.learning-card-audio,
.learning-flashcard-audio,
.learning-quiz-audio {
    align-items: center;
    background: #0f3b63;
    border: 0;
    border-radius: 9px;
    color: #fff;
    cursor: pointer;
    display: inline-flex;
    font: 750 .82rem/1 "Segoe UI", sans-serif;
    gap: 7px;
    padding: 10px 12px;
}

.learning-card-audio.is-playing,
.learning-flashcard-audio.is-playing,
.learning-quiz-audio.is-playing {
    background: #8c5a1f;
}

.learning-word-facts {
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin-bottom: 17px;
}

.learning-word-facts > div {
    background: #f7f9fb;
    border: 1px solid #e2e8f0;
    border-radius: 9px;
    padding: 10px;
}

.learning-word-facts span,
.learning-word-facts strong {
    display: block;
}

.learning-word-facts span {
    color: #7b8796;
    font-size: .67rem;
    font-weight: 750;
    margin-bottom: 3px;
    text-transform: uppercase;
}

.learning-word-facts strong {
    color: #183559;
    font-size: .88rem;
    overflow-wrap: anywhere;
}

.learning-grammar-clues,
.learning-word-family,
.learning-word-occurrences,
.learning-morphology,
.learning-word-explanation,
.learning-word-actions,
.learning-word-notes {
    margin-top: 17px;
}

.learning-grammar-clues h4,
.learning-word-family h4,
.learning-word-occurrences h4,
.learning-morphology h4 {
    color: #183559;
    font-size: .92rem;
    margin: 0 0 9px;
}

.learning-grammar-clues > div {
    align-items: flex-start;
    background: #fff8e8;
    border-left: 3px solid #d39a3a;
    display: grid;
    gap: 10px;
    grid-template-columns: minmax(110px, .3fr) 1fr;
    margin-bottom: 6px;
    padding: 8px 10px;
}

.learning-grammar-clues > div span {
    color: #7b4e16;
    font-size: .78rem;
    font-weight: 800;
}

.learning-grammar-clues p {
    color: #5d6570;
    font-size: .79rem;
    margin: 0;
}

.learning-grammar-clues > small {
    color: #7b8796;
    display: block;
    font-size: .7rem;
}

.learning-word-family > div {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.learning-family-word {
    background: #eef5f8;
    border: 1px solid #cddde6;
    border-radius: 8px;
    color: #183559;
    cursor: pointer;
    padding: 7px 9px;
}

.learning-family-word strong,
.learning-family-word span {
    display: block;
}

.learning-family-word strong { font-family: "SBL Hebrew", "Ezra SIL", serif; font-size: 1.25rem; }
.learning-family-word span { color: #627286; font-size: .67rem; }

.learning-word-occurrences {
    display: grid;
    gap: 6px;
}

.learning-word-occurrences h4 {
    margin-bottom: 3px;
}

.learning-word-occurrences a {
    align-items: center;
    background: #f8fafc;
    border: 1px solid #e2e8f0;
    border-radius: 8px;
    color: #40546a;
    display: grid;
    gap: 10px;
    grid-template-columns: 95px 1fr;
    padding: 7px 9px;
    text-decoration: none;
}

.learning-word-occurrences a > strong {
    color: #0f5f91;
    font-size: .72rem;
}

.learning-word-occurrences a > span {
    font-family: "SBL Hebrew","Ezra SIL",serif;
    font-size: 1rem;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

.learning-morphology > div {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
}

.learning-morphology > div > span {
    background: #f3effd;
    border: 1px solid #ddd2f7;
    border-radius: 8px;
    min-width: 92px;
    padding: 7px 9px;
}

.learning-morphology small,
.learning-morphology strong {
    display: block;
}

.learning-morphology small {
    color: #7965a8;
    font-size: .62rem;
    font-weight: 800;
    text-transform: uppercase;
}

.learning-morphology strong {
    color: #46366e;
    font-size: .78rem;
}

.learning-morphology > p {
    color: #7b8796;
    font-size: .68rem;
    margin: 5px 0 0;
}

.learning-word-explanation {
    border-bottom: 1px solid #e2e8f0;
    border-top: 1px solid #e2e8f0;
    color: #52647a;
    font-size: .83rem;
    padding: 11px 0;
}

.learning-word-explanation summary {
    color: #0f5f91;
    cursor: pointer;
    font-weight: 800;
}

.learning-word-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
}

.learning-word-actions button {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    color: #40546a;
    cursor: pointer;
    font-weight: 700;
    padding: 8px 10px;
}

.learning-word-actions button[aria-pressed="true"] {
    background: #0f3b63;
    border-color: #0f3b63;
    color: #fff;
}

.learning-word-notes label {
    color: #334155;
    display: block;
    font-size: .78rem;
    font-weight: 800;
    margin-bottom: 5px;
}

.learning-word-notes textarea {
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    box-sizing: border-box;
    font: inherit;
    padding: 9px;
    resize: vertical;
    width: 100%;
}

.learning-word-notes button {
    background: #4f8069;
    border: 0;
    border-radius: 7px;
    color: #fff;
    cursor: pointer;
    font-size: .76rem;
    font-weight: 800;
    margin-top: 6px;
    padding: 7px 10px;
}

.learning-word-notes small { color: #23704a; margin-left: 8px; }

.learning-dashboard,
.learning-review-page {
    padding: 10px 0 34px;
}

.learning-dashboard-hero {
    align-items: center;
    background:
        radial-gradient(circle at 90% 20%, rgba(243, 203, 132, .2), transparent 28%),
        linear-gradient(135deg, #092b48, #145977);
    border-radius: 18px;
    color: #fff;
    display: flex;
    gap: 32px;
    justify-content: space-between;
    overflow: hidden;
    padding: clamp(28px, 5vw, 48px);
}

.learning-dashboard-eyebrow,
.learning-panel-heading > div > span,
.learning-review-header > div > span {
    color: #d7a955;
    display: block;
    font-size: .72rem;
    font-weight: 800;
    letter-spacing: .1em;
    text-transform: uppercase;
}

.learning-dashboard-hero h1 {
    color: #fff;
    font-size: clamp(2rem, 4vw, 3.5rem);
    letter-spacing: -.04em;
    line-height: 1.05;
    margin: 5px 0 10px;
}

.learning-dashboard-hero p {
    color: rgba(255, 255, 255, .76);
    margin: 0;
    max-width: 58ch;
}

.learning-hero-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 9px;
    margin-top: 20px;
}

.learning-hero-actions a {
    border-radius: 9px;
    font-size: .83rem;
    font-weight: 800;
    padding: 10px 13px;
    text-decoration: none;
}

.learning-primary-link { background: #f3cb84; color: #183559; }
.learning-secondary-link { border: 1px solid rgba(255, 255, 255, .3); color: #fff; }

.learning-daily-goal {
    align-items: center;
    background: rgba(255, 255, 255, .09);
    border: 1px solid rgba(255, 255, 255, .16);
    border-radius: 14px;
    display: flex;
    flex: 0 0 auto;
    gap: 13px;
    padding: 14px;
}

.learning-goal-ring {
    align-items: center;
    background: conic-gradient(#f3cb84 var(--goal-progress), rgba(255, 255, 255, .14) 0);
    border-radius: 50%;
    display: flex;
    flex-direction: column;
    height: 76px;
    justify-content: center;
    position: relative;
    width: 76px;
}

.learning-goal-ring::before {
    background: #124865;
    border-radius: 50%;
    content: '';
    inset: 7px;
    position: absolute;
}

.learning-goal-ring strong,
.learning-goal-ring span { position: relative; z-index: 1; }
.learning-goal-ring strong { font-size: 1.4rem; line-height: 1; }
.learning-goal-ring span { color: rgba(255,255,255,.65); font-size: .65rem; }
.learning-daily-goal > div:last-child strong,
.learning-daily-goal > div:last-child span { display: block; }
.learning-daily-goal > div:last-child span { color: rgba(255,255,255,.66); font-size: .72rem; max-width: 17ch; }

.learning-stat-grid {
    display: grid;
    gap: 12px;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    margin: 16px 0;
}

.learning-stat-grid article {
    align-items: center;
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 12px;
    display: grid;
    gap: 2px 11px;
    grid-template-columns: 38px 1fr;
    padding: 15px;
}

.learning-stat-grid article > i {
    align-items: center;
    background: #eef5f8;
    border-radius: 9px;
    color: #0f5f91;
    display: inline-flex;
    grid-row: span 2;
    height: 38px;
    justify-content: center;
    width: 38px;
}

.learning-stat-grid strong { color: #183559; font-size: 1.25rem; line-height: 1; }
.learning-stat-grid span { color: #718096; font-size: .72rem; }

.learning-hub { margin: 0 0 16px; }
.learning-hub .learning-panel-heading > small { color: #718096; font-size: .72rem; }

.learning-feature-grid {
    display: grid;
    gap: 11px;
    grid-template-columns: repeat(3, minmax(0, 1fr));
}

.learning-feature-card {
    align-items: center;
    background: #fbfdfe;
    border: 1px solid #dfe7ed;
    border-radius: 13px;
    color: #183559;
    display: grid;
    gap: 12px;
    grid-template-columns: 48px minmax(0, 1fr) auto;
    min-height: 78px;
    padding: 13px;
    text-decoration: none;
    transition: border-color .18s, box-shadow .18s, transform .18s;
}

.learning-feature-card:hover {
    border-color: var(--feature-color);
    box-shadow: 0 10px 24px rgba(15, 42, 67, .1);
    transform: translateY(-2px);
}

.learning-feature-card > span:nth-child(2) { min-width: 0; }
.learning-feature-card strong, .learning-feature-card small { display: block; }
.learning-feature-card strong { font-size: .86rem; line-height: 1.2; }
.learning-feature-card small { color: #718096; font-size: .67rem; line-height: 1.4; margin-top: 4px; }
.learning-feature-icon { align-items: center; background: var(--feature-color); border-radius: 12px; color: #fff; display: inline-flex; font-size: 1.15rem; height: 46px; justify-content: center; width: 46px; }
.learning-feature-arrow { color: var(--feature-color); font-size: .72rem; transition: transform .18s; }
.learning-feature-card:hover .learning-feature-arrow { transform: translateX(3px); }
.learning-feature-card.is-reading { --feature-color: #0f5f91; }
.learning-feature-card.is-trail { --feature-color: #4f8069; }
.learning-feature-card.is-games { --feature-color: #9b4d77; }
.learning-feature-card.is-alphabet { --feature-color: #b7791f; }
.learning-feature-card.is-review { --feature-color: #6554a4; }
.learning-feature-card.is-dictionary { --feature-color: #277c81; }
.learning-feature-card.is-courses { --feature-color: #b64d45; }
.learning-feature-card.is-alphabets { --feature-color: #406f9b; }
.learning-feature-card.is-arena { --feature-color: #d0922f; }

.learning-progress-section { margin: 22px 0 16px; }
.learning-section-heading { align-items: end; display: flex; gap: 24px; justify-content: space-between; margin-bottom: 13px; }
.learning-section-heading span { color: #b27d25; display: block; font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.learning-section-heading h2 { color: #183559; font-size: clamp(1.35rem, 2.5vw, 1.8rem); margin: 3px 0 0; }
.learning-section-heading p { color: #718096; font-size: .72rem; margin: 0; max-width: 37ch; text-align: right; }
.learning-report-strip { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.learning-report-strip article { align-items: center; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; display: flex; gap: 11px; padding: 13px; }
.learning-report-strip article > span { align-items: center; background: #eef5f8; border-radius: 9px; color: #0f5f91; display: flex; flex: 0 0 auto; height: 36px; justify-content: center; width: 36px; }
.learning-report-strip strong, .learning-report-strip small { display: block; }
.learning-report-strip strong { color: #183559; font-size: 1rem; line-height: 1.15; }
.learning-report-strip small { color: #718096; font-size: .64rem; line-height: 1.3; margin-top: 2px; }

.learning-competition-banner {
    align-items: center;
    background: linear-gradient(110deg,#fff8e8,#fff 60%,#eef6fa);
    border: 1px solid #e4c77f;
    border-radius: 13px;
    color: inherit;
    display: grid;
    gap: 13px;
    grid-template-columns: 48px 1fr auto;
    margin: 0 0 16px;
    padding: 14px 16px;
    text-decoration: none;
    transition: box-shadow .18s, transform .18s;
}
.learning-competition-banner:hover { box-shadow: 0 10px 24px rgba(15,42,67,.11); transform: translateY(-1px); }
.learning-competition-icon { align-items: center; background: #d39a3a; border-radius: 12px; color: #fff; display: flex; font-size: 1.15rem; height: 46px; justify-content: center; width: 46px; }
.learning-competition-banner small, .learning-competition-banner strong, .learning-competition-banner p { display: block; }
.learning-competition-banner small { color: #8c5a1f; font-size: .64rem; font-weight: 900; text-transform: uppercase; }
.learning-competition-banner strong { color: #183559; font-size: .98rem; }
.learning-competition-banner p { color: #718096; font-size: .68rem; margin: 2px 0 0; }
.learning-competition-banner > b { color: #0f5f91; font-size: .72rem; white-space: nowrap; }

.learning-dashboard-grid {
    display: grid;
    gap: 16px;
    grid-template-columns: minmax(0, 1.25fr) minmax(300px, .75fr);
}

.learning-reports-grid { margin-top: 0; }

.learning-panel {
    background: #fff;
    border: 1px solid #e2e8f0;
    border-radius: 14px;
    box-shadow: 0 10px 28px rgba(15, 42, 67, .06);
    padding: 20px;
}

.learning-panel-heading {
    align-items: center;
    display: flex;
    gap: 16px;
    justify-content: space-between;
    margin-bottom: 16px;
}

.learning-panel-heading h2 {
    color: #183559;
    font-size: 1.2rem;
    margin: 2px 0 0;
}

.learning-panel-heading > strong,
.learning-panel-heading > a {
    color: #0f5f91;
    font-size: .76rem;
    text-decoration: none;
}

.learning-week-chart {
    align-items: flex-end;
    display: grid;
    gap: 10px;
    grid-template-columns: repeat(7, 1fr);
    height: 165px;
}

.learning-week-day {
    align-items: center;
    display: flex;
    flex-direction: column;
    height: 100%;
    justify-content: flex-end;
}

.learning-week-value { color: #718096; font-size: .68rem; }
.learning-week-bar { align-items: flex-end; background: #edf2f7; border-radius: 7px; display: flex; flex: 1; margin: 4px 0; overflow: hidden; width: min(28px, 75%); }
.learning-week-bar i { background: linear-gradient(#4d90ad, #0f3b63); border-radius: 7px; display: block; width: 100%; }
.learning-week-day small { color: #718096; font-size: .67rem; text-transform: uppercase; }

.learning-preferences-form {
    display: grid;
    gap: 8px;
}

.learning-preferences-form > label:not(.learning-check-row) { color: #40546a; font-size: .74rem; font-weight: 800; }
.learning-preferences-form select,
.learning-preferences-form input[type="number"] { border: 1px solid #cbd5e1; border-radius: 8px; box-sizing: border-box; font: inherit; padding: 9px 10px; width: 100%; }
.learning-check-row { align-items: center; color: #52647a; display: flex; font-size: .75rem; gap: 7px; margin: 5px 0; }
.learning-check-row input { accent-color: #0f5f91; }
.learning-preferences-form button { background: #0f3b63; border: 0; border-radius: 8px; color: #fff; cursor: pointer; font-weight: 800; padding: 10px; }
.learning-preferences-status { color: #23704a; min-height: 1.2em; }

.learning-trails,
.learning-notebook { margin-top: 16px; }
.learning-trail-grid { display: grid; gap: 10px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.learning-trail-grid > a { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 11px; color: #183559; display: flex; flex-direction: column; min-height: 135px; padding: 14px; text-decoration: none; transition: border-color .18s, transform .18s; }
.learning-trail-grid > a:hover { border-color: #0f5f91; transform: translateY(-2px); }
.learning-trail-icon { align-items: center; background: #e8f1f5; border-radius: 8px; color: #0f5f91; display: inline-flex; height: 34px; justify-content: center; margin-bottom: 13px; width: 34px; }
.learning-trail-grid strong { font-size: .9rem; }
.learning-trail-grid small { color: #718096; font-size: .7rem; line-height: 1.4; margin-top: 3px; }
.learning-trail-grid > a > .fa-arrow-right { color: #0f5f91; font-size: .75rem; margin-top: auto; }
.learning-trail-progress { background: #e2e8f0; border-radius: 99px; display: block; height: 5px; margin-top: auto; overflow: hidden; }
.learning-trail-progress b { background: #4f8069; display: block; height: 100%; }

.learning-word-list { display: grid; gap: 7px; }
.learning-word-row { align-items: center; border: 1px solid #e2e8f0; border-radius: 9px; display: grid; gap: 14px; grid-template-columns: minmax(120px,.45fr) minmax(180px,1fr) auto 20px; padding: 10px 12px; }
.learning-word-main strong,
.learning-word-main span,
.learning-word-meaning strong,
.learning-word-meaning span { display: block; }
.learning-word-main strong { color: #183559; font-family: "SBL Hebrew","Ezra SIL",serif; font-size: 1.42rem; text-align: right; }
.learning-word-main span { color: #8c5a1f; font: italic .72rem Georgia,serif; }
.learning-word-meaning strong { color: #40546a; font-size: .82rem; }
.learning-word-meaning span { color: #7b8796; font-size: .68rem; }
.learning-status { border-radius: 999px; font-size: .65rem; font-weight: 800; padding: 4px 7px; }
.learning-status-aprendendo { background: #eef5f8; color: #0f5f91; }
.learning-status-dificil { background: #fff1ed; color: #a43d2e; }
.learning-status-conhecida { background: #e9f7ef; color: #23704a; }
.learning-favorite { color: #d39a3a; }
.learning-empty-state { color: #718096; padding: 25px; text-align: center; }
.learning-empty-state > i { color: #8ca4b7; font-size: 2rem; }
.learning-empty-state a { color: #0f5f91; }

.learning-review-header {
    align-items: flex-start;
    display: flex;
    gap: 24px;
    justify-content: space-between;
    margin-bottom: 20px;
}
.learning-review-header h1 { color: #183559; font-size: clamp(1.9rem,4vw,3rem); letter-spacing: -.04em; margin: 4px 0 7px; }
.learning-review-header p { color: #64748b; margin: 0; max-width: 68ch; }
.learning-review-header > a { border: 1px solid #cbd5e1; border-radius: 8px; color: #0f5f91; flex: 0 0 auto; font-size: .8rem; font-weight: 800; padding: 9px 11px; text-decoration: none; }
.learning-review-app { margin: 0 auto; max-width: 760px; }
.learning-review-progress { align-items: center; display: flex; gap: 12px; margin-bottom: 12px; }
.learning-review-progress > span { color: #64748b; font-size: .75rem; white-space: nowrap; }
.learning-review-progress > i { background: #dfe7ed; border-radius: 99px; flex: 1; height: 7px; overflow: hidden; }
.learning-review-progress > i b { background: #4f8069; display: block; height: 100%; transition: width .25s; }
.learning-flashcard { align-items: center; background: #fff; border: 1px solid #d9e3ea; border-radius: 18px; box-shadow: 0 24px 60px rgba(15,42,67,.12); display: flex; flex-direction: column; min-height: 390px; padding: clamp(28px,6vw,55px); text-align: center; }
.learning-flashcard-label { color: #8c5a1f; font-size: .72rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.learning-flashcard-word { color: #183559; font-family: "SBL Hebrew","Ezra SIL",serif; font-size: clamp(3.2rem,9vw,5.6rem); line-height: 1.3; margin: 24px 0 5px; }
.learning-flashcard-context { color: #7b8796; font-size: .72rem; margin-bottom: 19px; }
.learning-flashcard-audio { margin-bottom: 12px; }
.learning-reveal-answer { background: #0f3b63; border: 0; border-radius: 9px; color: #fff; cursor: pointer; font-weight: 800; margin-top: auto; padding: 12px 20px; }
.learning-flashcard-answer { border-top: 1px solid #e2e8f0; display: grid; gap: 15px; grid-template-columns: repeat(3,1fr); margin-top: auto; padding-top: 20px; width: 100%; }
.learning-flashcard-answer span,
.learning-flashcard-answer strong { display: block; }
.learning-flashcard-answer span { color: #7b8796; font-size: .67rem; font-weight: 800; text-transform: uppercase; }
.learning-flashcard-answer strong { color: #183559; font-size: .94rem; }
.learning-review-ratings { margin-top: 14px; text-align: center; }
.learning-review-ratings > p { color: #64748b; font-size: .78rem; }
.learning-review-ratings > div { display: grid; gap: 8px; grid-template-columns: repeat(4,1fr); }
.learning-review-ratings button { background: #fff; border: 1px solid #cbd5e1; border-radius: 9px; color: #40546a; cursor: pointer; padding: 9px; }
.learning-review-ratings button:hover { border-color: #0f5f91; }
.learning-review-ratings strong,
.learning-review-ratings span { display: block; }
.learning-review-ratings strong { font-size: .8rem; }
.learning-review-ratings span { color: #8b98a8; font-size: .63rem; }
.learning-review-empty { background: #fff; border: 1px solid #e2e8f0; border-radius: 16px; margin: 20px auto; max-width: 620px; padding: 45px 25px; text-align: center; }
.learning-review-empty > span { align-items: center; background: #e9f7ef; border-radius: 50%; color: #23704a; display: inline-flex; font-size: 1.5rem; height: 58px; justify-content: center; width: 58px; }
.learning-review-empty h2 { color: #183559; }
.learning-review-empty p { color: #64748b; }
.learning-review-empty a { background: #0f3b63; border-radius: 8px; color: #fff; display: inline-block; font-weight: 800; padding: 10px 14px; text-decoration: none; }

.learning-quiz-modal[hidden] { display: none; }
.learning-quiz-modal { inset: 0; position: fixed; z-index: 3500; }
.learning-quiz-backdrop { background: rgba(8,20,34,.62); inset: 0; opacity: 0; position: absolute; transition: opacity .22s; }
.learning-quiz-panel { background: #fff; border-radius: 18px; box-shadow: 0 28px 70px rgba(0,0,0,.26); left: 50%; max-height: 88vh; max-width: 620px; overflow-y: auto; padding: 24px; position: absolute; top: 50%; transform: translate(-50%,-46%) scale(.98); transition: transform .22s; width: calc(100% - 40px); }
.learning-quiz-modal.is-open .learning-quiz-backdrop { opacity: 1; }
.learning-quiz-modal.is-open .learning-quiz-panel { transform: translate(-50%,-50%) scale(1); }
.learning-quiz-close { background: transparent; border: 0; color: #64748b; cursor: pointer; font-size: 1.8rem; line-height: 1; position: absolute; right: 15px; top: 11px; }
.learning-quiz-progress { align-items: center; display: flex; gap: 10px; margin: 0 34px 24px 0; }
.learning-quiz-progress span { color: #718096; font-size: .7rem; }
.learning-quiz-progress i { background: #e2e8f0; border-radius: 99px; flex: 1; height: 6px; overflow: hidden; }
.learning-quiz-progress b { background: #4f8069; display: block; height: 100%; }
.learning-quiz-question h2 { color: #183559; display: flex; flex-direction: column; font-size: 1rem; gap: 12px; margin: 0 0 20px; text-align: center; }
.learning-quiz-question h2 > span { color: #8c5a1f; font-size: .72rem; letter-spacing: .07em; text-transform: uppercase; }
.learning-quiz-question h2 > strong { font-size: 1.5rem; }
.learning-quiz-question h2 > strong.is-hebrew { font-family: "SBL Hebrew","Ezra SIL",serif; font-size: 3rem; }
.learning-quiz-audio { align-self: center; }
.learning-quiz-options { display: grid; gap: 9px; grid-template-columns: repeat(2,1fr); }
.learning-quiz-options button { background: #f8fafc; border: 1px solid #cbd5e1; border-radius: 10px; color: #334155; cursor: pointer; min-height: 58px; padding: 10px; }
.learning-quiz-options button:hover:not(:disabled) { border-color: #0f5f91; }
.learning-quiz-options strong,
.learning-quiz-options small { display: block; }
.learning-quiz-options strong { font-family: "SBL Hebrew","Ezra SIL",serif; font-size: 1.45rem; }
.learning-quiz-options small { color: #718096; }
.learning-quiz-options button.is-correct { background: #e9f7ef; border-color: #4f8069; color: #17603d; }
.learning-quiz-options button.is-wrong { background: #fff1ed; border-color: #cf6d5e; color: #9b3325; }
.learning-quiz-feedback { font-size: .78rem; font-weight: 800; min-height: 1.3em; text-align: center; }
.learning-quiz-feedback.is-correct { color: #23704a; }
.learning-quiz-feedback.is-wrong { color: #a43d2e; }
.learning-quiz-next,
.learning-quiz-result button { background: #0f3b63; border: 0; border-radius: 8px; color: #fff; cursor: pointer; display: block; font-weight: 800; margin: 12px auto 0; padding: 10px 16px; }
.learning-quiz-result { color: #64748b; padding: 20px; text-align: center; }
.learning-quiz-result > span { align-items: center; background: #fff5dc; border-radius: 50%; color: #b97819; display: inline-flex; font-size: 1.5rem; height: 58px; justify-content: center; width: 58px; }
.learning-quiz-result h2 { color: #183559; }
.learning-quiz-xp { background: #fff5dc; border-radius: 999px; color: #9a6817; display: block; font-size: .72rem; margin: 12px auto 0; padding: 7px 11px; width: fit-content; }
.learning-quiz-xp i { color: #d39a3a; margin-right: 4px; }
.learning-quiz-ranking { align-items: center; background: linear-gradient(135deg,#071c3e,#0f5f91); border: 1px solid #d8b15d; border-radius: 14px; box-shadow: 0 10px 24px rgba(7,28,62,.16); color: #fff; display: grid; gap: 13px; grid-template-columns: 86px 1fr; margin: 16px auto 0; max-width: 430px; padding: 14px; text-align: left; }
.learning-quiz-ranking.is-loading { display: flex; font-size: .75rem; justify-content: center; min-height: 58px; }
.learning-quiz-ranking.is-loading i { color: #f2bd3f; }
.learning-quiz-rank-position { align-items: center; border-right: 1px solid rgba(255,255,255,.2); display: flex; flex-direction: column; justify-content: center; padding-right: 13px; }
.learning-quiz-rank-position i { color: #f2bd3f; filter: drop-shadow(0 2px 2px rgba(0,0,0,.35)); font-size: 1rem; }
.learning-quiz-rank-position strong { font-size: 1.6rem; line-height: 1.05; }
.learning-quiz-rank-position small { color: #c8d8e8; font-size: .55rem; text-transform: uppercase; }
.learning-quiz-rank-copy span { color: #e5bd62; display: block; font-size: .59rem; font-weight: 850; letter-spacing: .08em; text-transform: uppercase; }
.learning-quiz-rank-copy strong { display: block; font-size: .83rem; margin-top: 2px; }
.learning-quiz-rank-copy p { color: #dce9f5; font-size: .68rem; line-height: 1.4; margin: 4px 0 0; }
.learning-quiz-result-actions { align-items: stretch; display: flex; gap: 8px; justify-content: center; margin-top: 13px; }
.learning-quiz-result-actions button, .learning-quiz-result-actions a { align-items: center; border: 0; border-radius: 8px; box-sizing: border-box; display: inline-flex; font-size: .72rem; font-weight: 800; justify-content: center; min-height: 39px; padding: 9px 13px; text-decoration: none; }
.learning-quiz-result-actions button { background: #0f3b63; color: #fff; cursor: pointer; }
.learning-quiz-result-actions a { background: #edf3f7; color: #183559; }

.learning-order-listen {
    align-items: center;
    background: #fff8e8;
    border: 1px solid #d8b15d;
    border-radius: 999px;
    color: #765315;
    cursor: pointer;
    display: flex;
    font-weight: 800;
    gap: 8px;
    justify-content: center;
    margin: -3px auto 14px;
    min-height: 40px;
    padding: 8px 16px;
    transition: background-color .18s, border-color .18s, color .18s, transform .18s;
}

.learning-order-listen:hover:not(:disabled) {
    background: #ffefc5;
    transform: translateY(-1px);
}

.learning-order-listen:focus-visible {
    outline: 3px solid rgba(15,95,145,.25);
    outline-offset: 2px;
}

.learning-order-listen.is-playing {
    background: #a43d2e;
    border-color: #a43d2e;
    color: #fff;
}

.learning-order-listen:disabled {
    cursor: default;
    opacity: .5;
}

.learning-order-selected {
    align-items: center;
    background: #eef5f8;
    border: 1px dashed #8fb2c7;
    border-radius: 10px;
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    justify-content: flex-start;
    min-height: 68px;
    padding: 10px;
}

.learning-order-selected small {
    color: #718096;
    direction: ltr;
    font-size: .72rem;
    margin: auto;
}

.learning-order-selected button,
.learning-order-pool button {
    font-family: "SBL Hebrew","Ezra SIL",serif;
    font-size: 1.35rem;
}

.learning-order-selected button {
    align-items: center;
    background: #fff;
    border: 1px solid #c7d7e1;
    border-radius: 6px;
    color: #183559;
    cursor: pointer;
    display: inline-flex;
    gap: 6px;
    padding: 4px 7px;
}

.learning-order-selected button::after {
    color: #a65a5a;
    content: "×";
    direction: ltr;
    font-family: Arial,sans-serif;
    font-size: .8rem;
    font-weight: 800;
}

.learning-order-selected button:hover,
.learning-order-selected button:focus-visible {
    background: #fff1f1;
    border-color: #cf7a7a;
    color: #8d2727;
    outline: 2px solid rgba(207,122,122,.2);
}

.learning-order-selected button:disabled {
    cursor: default;
}

.learning-order-selected button:disabled::after {
    display: none;
}

.learning-order-pool {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    justify-content: center;
    margin: 13px 0;
}

.learning-order-pool button {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 7px;
    color: #183559;
    cursor: pointer;
    padding: 6px 9px;
}

.learning-order-pool button.is-selected {
    opacity: .25;
}

.learning-order-controls {
    display: flex;
    gap: 8px;
    justify-content: center;
}

.learning-order-controls button {
    background: #fff;
    border: 1px solid #cbd5e1;
    border-radius: 8px;
    color: #40546a;
    cursor: pointer;
    font-weight: 750;
    padding: 8px 11px;
}

.learning-order-controls button.is-primary {
    background: #0f3b63;
    border-color: #0f3b63;
    color: #fff;
}

.learning-order-controls button:disabled {
    cursor: default;
    opacity: .5;
}
body.learning-modal-open { overflow: hidden; }

.learning-toast-container { display: grid; gap: 8px; max-width: min(380px,calc(100% - 30px)); position: fixed; right: 15px; top: 82px; z-index: 5000; }
.learning-toast { align-items: flex-start; background: #fff; border: 1px solid #d8e5dd; border-radius: 9px; box-shadow: 0 14px 38px rgba(15,42,67,.2); color: #23704a; display: flex; font-size: .78rem; gap: 8px; opacity: 0; padding: 11px 12px; transform: translateY(-7px); transition: opacity .2s,transform .2s; }
.learning-toast.is-error { border-color: #f0c7bf; color: #a43d2e; }
.learning-toast.is-visible { opacity: 1; transform: none; }

/* Arena dos Alunos */
.competition-page { padding: 10px 0 38px; }
.competition-hero {
    align-items: center;
    background:
        radial-gradient(circle at 85% 12%, color-mix(in srgb, var(--league-color) 34%, transparent), transparent 31%),
        linear-gradient(135deg, #071f35, #104d6b 62%, #0e384f);
    border-radius: 20px;
    color: #fff;
    display: grid;
    gap: 32px;
    grid-template-columns: 1fr minmax(250px, .34fr);
    overflow: hidden;
    padding: clamp(28px, 5vw, 52px);
}
.competition-eyebrow { color: #f3cb84; display: block; font-size: .75rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.competition-eyebrow i { margin-right: 5px; }
.competition-hero h1 { color: #fff; font-size: clamp(2.2rem, 5vw, 4.2rem); letter-spacing: -.055em; line-height: .98; margin: 8px 0 14px; max-width: 730px; }
.competition-hero-copy > p { color: rgba(255,255,255,.76); line-height: 1.65; margin: 0; max-width: 68ch; }
.competition-hero-actions { display: flex; flex-wrap: wrap; gap: 9px; margin-top: 21px; }
.competition-hero-actions a { align-items: center; border: 1px solid rgba(255,255,255,.28); border-radius: 9px; color: #fff; display: inline-flex; font-size: .8rem; font-weight: 850; gap: 7px; padding: 10px 13px; text-decoration: none; }
.competition-hero-actions a:first-child { background: #f3cb84; border-color: #f3cb84; color: #183559; }
.competition-league-card { align-items: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.17); border-radius: 17px; display: flex; flex-direction: column; padding: 22px; text-align: center; }
.competition-league-icon { align-items: center; background: var(--league-color); border: 5px solid rgba(255,255,255,.16); border-radius: 50%; box-shadow: 0 12px 30px rgba(0,0,0,.22); display: flex; font-size: 1.55rem; height: 70px; justify-content: center; margin-bottom: 11px; width: 70px; }
.competition-league-card small { color: rgba(255,255,255,.62); font-size: .66rem; font-weight: 800; text-transform: uppercase; }
.competition-league-card strong { color: #fff; font-size: 1.45rem; margin-top: 2px; }
.competition-league-card > b { color: #f3cb84; font-size: .86rem; margin: 4px 0 9px; }
.competition-league-card > em { color: rgba(255,255,255,.68); font-size: .65rem; font-style: normal; margin-top: 7px; }
.competition-progress { background: rgba(255,255,255,.17); border-radius: 99px; height: 7px; overflow: hidden; width: 100%; }
.competition-progress span { background: var(--league-color); display: block; height: 100%; }
.competition-earned-medals { display: flex; flex-wrap: wrap; gap: 6px; justify-content: center; margin-top: 13px; }
.competition-earned-medals span { align-items: center; background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.16); border-radius: 999px; color: var(--medal-color); display: inline-flex; font-size: .68rem; gap: 5px; padding: 5px 8px; }
.competition-earned-medals span b { color: #fff; font-size: .6rem; }

.competition-alert { border-radius: 10px; font-size: .8rem; font-weight: 800; margin-top: 13px; padding: 11px 14px; }
.competition-alert.is-success { background: #e9f7ef; color: #17603d; }
.competition-alert.is-error { background: #fff1ed; color: #9b3325; }
.competition-quick-stats { display: grid; gap: 11px; grid-template-columns: repeat(4,1fr); margin: 15px 0; }
.competition-quick-stats article { align-items: center; background: #fff; border: 1px solid #e2e8f0; border-radius: 12px; display: flex; gap: 11px; padding: 14px; }
.competition-quick-stats article > span { align-items: center; background: #fff5dc; border-radius: 9px; color: #b97819; display: flex; flex: 0 0 auto; height: 39px; justify-content: center; width: 39px; }
.competition-quick-stats small, .competition-quick-stats strong { display: block; }
.competition-quick-stats small { color: #7b8796; font-size: .65rem; }
.competition-quick-stats strong { color: #183559; font-size: 1.16rem; }

.competition-periods { background: #e8eef3; border-radius: 11px; display: flex; gap: 5px; margin: 0 0 15px; padding: 5px; width: fit-content; }
.competition-periods a { border-radius: 8px; color: #52647a; font-size: .72rem; font-weight: 800; padding: 8px 11px; text-decoration: none; }
.competition-periods a.is-active { background: #fff; box-shadow: 0 4px 12px rgba(15,42,67,.1); color: #0f3b63; }
.competition-main-grid { align-items: start; display: grid; gap: 16px; grid-template-columns: minmax(0,1fr) minmax(270px,.34fr); }
.competition-ranking-column, .competition-side-column { display: grid; gap: 16px; }
.competition-panel { background: #fff; border: 1px solid #e2e8f0; border-radius: 15px; box-shadow: 0 10px 28px rgba(15,42,67,.06); padding: 20px; }
.competition-panel-heading { align-items: center; display: flex; gap: 15px; justify-content: space-between; margin-bottom: 17px; }
.competition-panel-heading > div > span { color: #b97819; display: block; font-size: .65rem; font-weight: 900; letter-spacing: .09em; text-transform: uppercase; }
.competition-panel-heading h2 { color: #183559; font-size: 1.2rem; margin: 2px 0 0; }
.competition-panel-heading > small, .competition-panel-heading > strong { color: #718096; font-size: .68rem; }

.competition-podium { align-items: end; display: grid; gap: 10px; grid-template-columns: repeat(3,1fr); padding-top: 18px; }
.competition-podium article { align-items: center; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 14px 14px 8px 8px; display: flex; flex-direction: column; min-height: 144px; padding: 14px 9px; position: relative; text-align: center; }
.competition-podium article.is-position-1 { background: linear-gradient(#fff8e8,#fff); border-color: #e6c16e; min-height: 174px; order: 2; }
.competition-podium article.is-position-2 { order: 1; }
.competition-podium article.is-position-3 { order: 3; }
.competition-podium article.is-me { box-shadow: 0 0 0 3px rgba(15,95,145,.16); }
.competition-podium article > i { color: #c18c30; font-size: 1.1rem; margin-bottom: 7px; }
.competition-podium article > span, .competition-avatar { align-items: center; background: linear-gradient(135deg,#0f5f91,#183559); border-radius: 50%; color: #fff; display: inline-flex; font-size: .72rem; font-weight: 900; height: 42px; justify-content: center; overflow: hidden; width: 42px; }
.competition-podium article > span img, .competition-avatar img, .competition-rival-row > span img { height: 100%; object-fit: cover; width: 100%; }
.competition-podium article > strong { color: #183559; font-size: .78rem; margin-top: 8px; }
.competition-podium article > b { color: #b97819; font-size: .75rem; }
.competition-podium article > small { color: #8b98a8; font-size: .61rem; }
.competition-empty { color: #718096; padding: 30px; text-align: center; }
.competition-empty > i { color: #b9c7d2; font-size: 2rem; }

.competition-table-wrap { overflow-x: auto; }
.competition-board table { border-collapse: collapse; width: 100%; }
.competition-board th { color: #8b98a8; font-size: .62rem; letter-spacing: .05em; padding: 7px 9px; text-align: left; text-transform: uppercase; }
.competition-board td { border-top: 1px solid #edf1f4; color: #52647a; font-size: .73rem; padding: 10px 9px; }
.competition-board td:nth-child(2) { align-items: center; display: flex; gap: 9px; min-width: 170px; }
.competition-board td:nth-child(2) strong, .competition-board td:nth-child(2) small { display: block; }
.competition-board td:nth-child(2) strong { color: #183559; }
.competition-board td:nth-child(2) small { color: #0f5f91; font-size: .62rem; font-weight: 800; }
.competition-board td:last-child { color: #b97819; text-align: right; white-space: nowrap; }
.competition-board th:last-child { text-align: right; }
.competition-board tr.is-me td { background: #eef7fb; }
.competition-position { align-items: center; background: #eef2f6; border-radius: 50%; color: #64748b; display: inline-flex; height: 28px; justify-content: center; width: 28px; }
.competition-position.is-1 { background: #fff0bd; color: #a26b13; }
.competition-position.is-2 { background: #eef0f2; color: #637080; }
.competition-position.is-3 { background: #f5dfd0; color: #925633; }
.competition-avatar { flex: 0 0 auto; height: 34px; width: 34px; }

.competition-rival-row { align-items: center; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 11px; display: grid; gap: 9px; grid-template-columns: 40px 1fr auto; padding: 11px; }
.competition-rival-row > span { align-items: center; background: #183559; border-radius: 50%; color: #fff; display: flex; font-size: .7rem; font-weight: 900; height: 40px; justify-content: center; overflow: hidden; }
.competition-rival-row strong, .competition-rival-row small { display: block; }
.competition-rival-row strong { color: #183559; font-size: .78rem; }
.competition-rival-row small { color: #7b8796; font-size: .63rem; }
.competition-rival-row > b { color: #b97819; font-size: .8rem; }
.competition-rival > a { background: #0f3b63; border-radius: 8px; color: #fff; display: flex; font-size: .73rem; font-weight: 800; justify-content: space-between; margin-top: 9px; padding: 10px; text-decoration: none; }
.competition-defend { color: #52647a; font-size: .65rem; margin: 10px 2px 0; }
.competition-defend i { color: #4f8069; }
.competition-rival-winner { align-items: center; color: #64748b; display: flex; flex-direction: column; padding: 16px; text-align: center; }
.competition-rival-winner i { color: #d39a3a; font-size: 2rem; }
.competition-rival-winner strong { color: #183559; margin-top: 8px; }
.competition-rival-winner span { font-size: .7rem; }

.competition-profile form { display: grid; gap: 8px; }
.competition-profile label:not(.competition-check) { color: #40546a; font-size: .72rem; font-weight: 800; }
.competition-profile input[type="text"] { border: 1px solid #cbd5e1; border-radius: 8px; box-sizing: border-box; font: inherit; padding: 9px 10px; width: 100%; }
.competition-profile textarea { border: 1px solid #cbd5e1; border-radius: 8px; box-sizing: border-box; color: #334155; font: inherit; line-height: 1.45; padding: 9px 10px; resize: vertical; width: 100%; }
.competition-profile form > small { color: #8b98a8; font-size: .61rem; line-height: 1.45; }
.competition-photo-field { align-items: center; background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 11px; display: grid; gap: 11px; grid-template-columns: 62px minmax(0,1fr); margin-bottom: 3px; padding: 10px; }
.competition-photo-preview { align-items: center; background: linear-gradient(135deg,#0f5f91,#183559); border: 2px solid #e3bd66; border-radius: 50%; color: #fff; display: flex; font-size: 1.15rem; height: 58px; justify-content: center; overflow: hidden; width: 58px; }
.competition-photo-preview img { height: 100%; object-fit: cover; width: 100%; }
.competition-photo-field > div { min-width: 0; }
.competition-photo-field label, .competition-photo-field small { display: block; }
.competition-photo-field input[type="file"] { color: #607086; display: block; font-size: .62rem; margin: 5px 0 3px; max-width: 100%; }
.competition-photo-field small { color: #8b98a8; font-size: .58rem; }
.competition-check { align-items: flex-start; color: #52647a; display: flex; font-size: .68rem; gap: 7px; margin-top: 4px; }
.competition-check input { accent-color: #0f5f91; margin-top: 2px; }
.competition-profile button { background: #0f3b63; border: 0; border-radius: 8px; color: #fff; cursor: pointer; font-weight: 800; padding: 10px; }
.competition-student-link { color: #183559; font-weight: 800; text-decoration: none; }
.competition-student-link:hover { color: #0f6b9d; text-decoration: underline; }
.competition-student-link i { color: #b97819; font-size: .62rem; margin-left: 3px; }

.competition-challenges, .competition-achievements { margin-top: 16px; }
.competition-challenge-grid { display: grid; gap: 10px; grid-template-columns: repeat(4,1fr); }
.competition-challenge-grid article { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 12px; display: grid; gap: 8px; grid-template-columns: 38px 1fr auto; padding: 13px; }
.competition-challenge-grid article.is-complete { background: #eef9f3; border-color: #9ac6ad; }
.competition-challenge-grid article > span { align-items: center; background: #e8f1f5; border-radius: 9px; color: #0f5f91; display: flex; grid-row: span 2; height: 38px; justify-content: center; }
.competition-challenge-grid article.is-complete > span { background: #d6f0e1; color: #23704a; }
.competition-challenge-grid strong { color: #183559; display: block; font-size: .76rem; }
.competition-challenge-grid p { color: #7b8796; font-size: .63rem; line-height: 1.4; margin: 2px 0 0; }
.competition-challenge-grid article > b { color: #b97819; font-size: .7rem; white-space: nowrap; }
.competition-challenge-progress { background: #dfe7ed; border-radius: 99px; grid-column: 1 / -1; height: 6px; overflow: hidden; }
.competition-challenge-progress span { background: linear-gradient(90deg,#0f5f91,#4f9a7a); display: block; height: 100%; }
.competition-challenge-grid article > small { color: #718096; font-size: .61rem; grid-column: 1 / -1; text-align: right; }
.competition-challenge-grid article.is-complete > small { color: #23704a; font-weight: 800; }

.competition-achievement-grid { display: grid; gap: 10px; grid-template-columns: repeat(4,1fr); }
.competition-achievement-grid article { align-items: center; border: 1px solid #e2e8f0; border-radius: 12px; display: flex; flex-direction: column; min-height: 175px; padding: 15px; text-align: center; }
.competition-achievement-grid article.is-locked { filter: grayscale(.65); opacity: .64; }
.competition-achievement-grid article > span { align-items: center; background: #fff3cf; border: 1px solid #ead08a; border-radius: 50%; color: #b97819; display: flex; font-size: 1.2rem; height: 48px; justify-content: center; width: 48px; }
.competition-achievement-grid strong { color: #183559; font-size: .78rem; margin-top: 8px; }
.competition-achievement-grid p { color: #7b8796; font-size: .63rem; line-height: 1.4; margin: 3px 0 10px; }
.competition-achievement-progress { background: #e2e8f0; border-radius: 99px; height: 5px; margin-top: auto; overflow: hidden; width: 100%; }
.competition-achievement-progress span { background: #d39a3a; display: block; height: 100%; }
.competition-achievement-grid small { color: #8b98a8; font-size: .6rem; margin-top: 5px; }
.competition-achievement-grid .is-unlocked small { color: #23704a; font-weight: 800; }
.competition-fair-play { align-items: center; background: #eef5f8; border: 1px solid #c9dde7; border-radius: 12px; color: #52647a; display: flex; gap: 12px; margin-top: 16px; padding: 15px 18px; }
.competition-fair-play > i { color: #0f5f91; font-size: 1.25rem; }
.competition-fair-play strong, .competition-fair-play p { display: block; }
.competition-fair-play strong { color: #183559; font-size: .78rem; }
.competition-fair-play p { font-size: .68rem; margin: 2px 0 0; }

/* Video learning */
.video-catalog-page { margin: 0 auto; max-width: 1180px; padding: 30px 18px 56px; }
.video-catalog-hero { background: linear-gradient(120deg,#071c3e 0%,#0d3c68 65%,#0f6694 100%); border: 1px solid rgba(229,189,98,.5); border-radius: 22px; box-shadow: 0 20px 48px rgba(7,28,62,.18); color: #fff; display: grid; gap: 30px; grid-template-columns: 1fr 310px; overflow: hidden; padding: 42px; position: relative; }
.video-catalog-hero > div { position: relative; z-index: 2; }
.video-catalog-hero > div > span:first-child { color: #e5bd62; font-size: .7rem; font-weight: 900; letter-spacing: .11em; text-transform: uppercase; }
.video-catalog-hero h1 { font-family: Georgia,'Times New Roman',serif; font-size: clamp(2.2rem,4.5vw,3.8rem); letter-spacing: -.04em; line-height: 1.02; margin: 12px 0 16px; max-width: 760px; }
.video-catalog-hero p { color: #d8e5f1; font-size: .98rem; line-height: 1.65; max-width: 68ch; }
.video-catalog-hero > div > div { display: flex; flex-wrap: wrap; gap: 8px; margin: 20px 0; }
.video-catalog-hero > div b { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.14); border-radius: 99px; font-size: .65rem; padding: 7px 10px; }
.video-catalog-hero > div b i { color: #e5bd62; }
.video-catalog-hero > div > a { background: #d39a3a; border-radius: 9px; color: #fff; display: inline-flex; font-size: .75rem; font-weight: 900; gap: 10px; padding: 12px 15px; text-decoration: none; }
.video-access-active { background: #dff4e7!important; border-radius: 99px; color: #23704a!important; display: inline-flex; font-size: .7rem!important; font-weight: 850; gap: 6px; letter-spacing: 0!important; padding: 8px 12px; text-transform: none!important; }
.video-catalog-hero > aside { align-self: center; aspect-ratio: 1; position: relative; }
.video-catalog-hero > aside::before, .video-catalog-hero > aside::after { border: 1px solid rgba(229,189,98,.3); border-radius: 50%; content: ''; inset: 6%; position: absolute; }
.video-catalog-hero > aside::after { inset: 20%; }
.video-catalog-hero > aside > span { align-items: center; background: #fff; border: 8px solid rgba(255,255,255,.18); background-clip: padding-box; border-radius: 50%; color: #b97819; display: flex; font-size: 2rem; height: 82px; justify-content: center; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 82px; z-index: 2; }
.video-catalog-hero > aside small, .video-catalog-hero > aside strong, .video-catalog-hero > aside b { color: #e5bd62; font-family: Georgia,'Times New Roman',serif; font-size: 1rem; position: absolute; }
.video-catalog-hero > aside small { left: 8%; top: 18%; }.video-catalog-hero > aside strong { right: 1%; top: 28%; }.video-catalog-hero > aside b { bottom: 15%; left: 28%; }
.video-catalog-category { margin-top: 37px; }
.video-catalog-heading { align-items: end; display: flex; justify-content: space-between; margin-bottom: 15px; }
.video-catalog-heading span { color: #b97819; font-size: .63rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.video-catalog-heading h2 { color: #183559; margin: 3px 0 0; }
.video-catalog-heading p { color: #718096; font-size: .72rem; margin: 0; }
.video-catalog-grid { display: grid; gap: 16px; grid-template-columns: repeat(3,minmax(0,1fr)); }
.video-catalog-grid > article { background: #fff; border: 1px solid #dfe7ed; border-radius: 15px; box-shadow: 0 10px 28px rgba(15,42,67,.07); overflow: hidden; transition: transform .2s,box-shadow .2s; }
.video-catalog-grid > article:hover { box-shadow: 0 17px 38px rgba(15,42,67,.13); transform: translateY(-3px); }
.video-catalog-cover { background: linear-gradient(135deg,#0d365d,#0f6694); display: block; height: 175px; overflow: hidden; position: relative; }
.video-catalog-cover > img { height: 100%; object-fit: cover; width: 100%; }
.video-catalog-cover > span { align-items: center; color: rgba(255,255,255,.25); display: flex; font-size: 4rem; height: 100%; justify-content: center; }
.video-catalog-cover > i { align-items: center; background: rgba(255,255,255,.94); border-radius: 50%; color: #b97819; display: flex; height: 48px; justify-content: center; left: 50%; position: absolute; top: 50%; transform: translate(-50%,-50%); width: 48px; }
.video-catalog-cover > small { background: rgba(7,28,62,.85); border-radius: 99px; bottom: 10px; color: #fff; font-size: .6rem; font-weight: 800; padding: 5px 8px; position: absolute; right: 10px; }
.video-catalog-card-copy { padding: 17px; }
.video-catalog-card-copy > span { color: #b97819; font-size: .58rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.video-catalog-card-copy h3 { font-size: 1rem; margin: 4px 0 7px; }
.video-catalog-card-copy h3 a { color: #183559; text-decoration: none; }
.video-catalog-card-copy p { color: #718096; font-size: .68rem; line-height: 1.5; min-height: 3em; }
.video-catalog-card-copy > i { background: #e3eaf0; border-radius: 99px; display: block; height: 6px; margin-top: 13px; overflow: hidden; }
.video-catalog-card-copy > i span { background: linear-gradient(90deg,#0f5f91,#4f9a7a); display: block; height: 100%; }
.video-catalog-card-copy > small { color: #718096; font-size: .58rem; }
.video-catalog-card-copy > div { color: #9a6817; font-size: .63rem; font-weight: 850; margin-top: 13px; }
.video-course-page, .video-learning-page, .student-peek-page { margin: 0 auto; max-width: 1180px; padding: 28px 18px 52px; }
.video-course-back, .student-peek-back { color: #52647a; display: inline-flex; font-size: .76rem; font-weight: 750; gap: 7px; margin-bottom: 18px; text-decoration: none; }
.video-course-hero { background: linear-gradient(125deg,#071c3e 0%,#0e3d68 68%,#0f6694 100%); border: 1px solid rgba(216,177,93,.55); border-radius: 20px; box-shadow: 0 18px 45px rgba(7,28,62,.17); color: #fff; display: grid; gap: 28px; grid-template-columns: 1fr 250px; overflow: hidden; padding: 34px; position: relative; }
.video-course-hero::after { border: 1px solid rgba(229,189,98,.2); border-radius: 50%; content: ''; height: 290px; position: absolute; right: -95px; top: -130px; width: 290px; }
.video-course-hero > div { position: relative; z-index: 1; }
.video-course-hero > div > span { color: #e5bd62; font-size: .7rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.video-course-hero h1 { font-family: Georgia,'Times New Roman',serif; font-size: clamp(2rem,4vw,3.2rem); letter-spacing: -.03em; line-height: 1.05; margin: 10px 0 13px; }
.video-course-hero p { color: #d8e5f1; line-height: 1.65; margin: 0; max-width: 68ch; }
.video-course-hero > div > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 20px; }
.video-course-hero b { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 999px; font-size: .68rem; padding: 7px 11px; }
.video-course-hero b i { color: #e5bd62; }
.video-course-hero > aside { align-self: center; background: rgba(255,255,255,.96); border-radius: 16px; color: #183559; display: flex; flex-direction: column; padding: 22px; position: relative; text-align: center; z-index: 1; }
.video-course-hero > aside > strong { color: #b97819; font-size: 2.2rem; }
.video-course-hero > aside > span { font-size: .7rem; font-weight: 800; }
.video-course-hero > aside > i, .video-course-lessons article > div > i, .video-playlist-heading > i, .video-playlist-items a div > i { background: #dce6ed; border-radius: 99px; height: 6px; margin: 13px 0 9px; overflow: hidden; }
.video-course-hero > aside > i span, .video-course-lessons article > div > i span, .video-playlist-heading > i span, .video-playlist-items a div > i span { background: linear-gradient(90deg,#b97819,#e5bd62); display: block; height: 100%; }
.video-course-hero > aside small { color: #718096; font-size: .62rem; line-height: 1.4; }
.video-course-heading { align-items: end; display: flex; justify-content: space-between; margin: 34px 4px 15px; }
.video-course-heading span { color: #b97819; font-size: .65rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.video-course-heading h2 { color: #183559; margin: 2px 0 0; }
.video-course-heading p { color: #718096; font-size: .74rem; margin: 0; }
.video-course-lessons { display: grid; gap: 11px; }
.video-course-lessons article { align-items: center; background: #fff; border: 1px solid #dfe7ed; border-radius: 14px; box-shadow: 0 8px 24px rgba(15,42,67,.05); display: grid; gap: 14px; grid-template-columns: 46px 1fr auto; padding: 16px 17px; }
.video-course-lessons article.is-complete { background: #f2faf6; border-color: #a7cdb7; }
.video-course-number { align-items: center; background: #eaf1f6; border-radius: 50%; color: #0f5f91; display: flex; font-weight: 900; height: 42px; justify-content: center; width: 42px; }
.is-complete .video-course-number { background: #d9f0e2; color: #23704a; }
.video-course-lessons article > div:nth-child(2) { min-width: 0; }
.video-course-lessons small { color: #b97819; font-size: .61rem; font-weight: 850; letter-spacing: .06em; text-transform: uppercase; }
.video-course-lessons h3 { color: #183559; font-size: 1rem; margin: 3px 0; }
.video-course-lessons p { color: #718096; font-size: .7rem; line-height: 1.45; margin: 0; }
.video-course-lessons article > div > i { display: block; margin: 9px 0 0; max-width: 330px; }
.video-course-reward { align-items: flex-end; display: flex; flex-direction: column; gap: 7px; }
.video-course-reward > span { color: #a46f19; font-size: .65rem; font-weight: 850; }
.video-course-reward > a { background: #0f3b63; border-radius: 8px; color: #fff; font-size: .7rem; font-weight: 850; padding: 9px 12px; text-decoration: none; white-space: nowrap; }
.video-course-empty { background: #fff; border: 1px dashed #cbd5e1; border-radius: 14px; color: #718096; padding: 35px; text-align: center; }

.video-learning-page { max-width: 1280px; }
.video-learning-topbar { align-items: center; display: grid; gap: 18px; grid-template-columns: 1fr auto 1fr; margin-bottom: 17px; }
.video-learning-topbar > a { color: #52647a; font-size: .72rem; font-weight: 800; text-decoration: none; }
.video-learning-topbar > div { text-align: center; }
.video-learning-topbar > div span, .video-learning-topbar > div strong { display: block; }
.video-learning-topbar > div span { color: #183559; font-size: .76rem; font-weight: 850; }
.video-learning-topbar > div strong { color: #718096; font-size: .61rem; }
.video-xp-promise { color: #a56c13; font-size: .69rem; font-weight: 900; justify-self: end; }
.video-xp-promise i { color: #d39a3a; }
.video-learning-layout { align-items: start; display: grid; gap: 22px; grid-template-columns: minmax(0,1fr) 330px; }
.video-stage { background: #020814; border: 1px solid #17395b; border-radius: 18px; box-shadow: 0 20px 45px rgba(3,15,31,.22); overflow: hidden; padding-bottom: 56.25%; position: relative; }
.video-stage iframe, .video-stage video { border: 0; height: 100%; inset: 0; position: absolute; width: 100%; z-index: 1; }
.video-stage-glow { background: radial-gradient(circle,rgba(229,189,98,.18),transparent 65%); bottom: -80px; height: 160px; pointer-events: none; position: absolute; right: -40px; width: 270px; z-index: 2; }
.video-watch-progress { background: #fff; border: 1px solid #dfe7ed; border-radius: 13px; margin-top: 13px; padding: 13px 15px; position: relative; }
.video-watch-progress > div { display: flex; justify-content: space-between; }
.video-watch-progress > div span { color: #40546a; font-size: .7rem; font-weight: 800; }
.video-watch-progress > div strong { color: #b97819; font-size: .75rem; }
.video-watch-progress > i { background: #e3eaf0; border-radius: 99px; display: block; height: 7px; margin: 8px 0; overflow: hidden; }
.video-watch-progress > i span { background: linear-gradient(90deg,#0f5f91,#4f9a7a,#e0ae4c); display: block; height: 100%; transition: width .5s; }
.video-watch-progress > small { color: #7b8796; font-size: .59rem; }
.video-watch-progress > small i { color: #4f8069; }
.video-progress-notice { align-items: flex-start; background: #fff7df; border: 1px solid #e8ca82; border-radius: 8px; color: #765315; display: flex!important; font-size: .65rem; gap: 7px; margin-top: 9px; padding: 8px; }
.video-lesson-copy { padding: 22px 4px 0; }
.video-lesson-copy > span { color: #b97819; font-size: .65rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.video-lesson-copy h1 { color: #183559; font-family: Georgia,'Times New Roman',serif; font-size: clamp(1.7rem,3vw,2.4rem); margin: 5px 0 10px; }
.video-lesson-copy > p { color: #607086; line-height: 1.7; }
.video-lesson-actions { display: flex; gap: 9px; justify-content: flex-end; margin-top: 18px; }
.video-lesson-actions a { border: 1px solid #cbd5e1; border-radius: 8px; color: #40546a; font-size: .7rem; font-weight: 800; padding: 9px 12px; text-decoration: none; }
.video-lesson-actions a.is-primary { background: #0f3b63; border-color: #0f3b63; color: #fff; }
.video-playlist { background: #fff; border: 1px solid #dfe7ed; border-radius: 16px; box-shadow: 0 12px 32px rgba(15,42,67,.08); overflow: hidden; position: sticky; top: 86px; }
.video-playlist-heading { background: #f5f8fa; border-bottom: 1px solid #e2e8f0; padding: 17px; }
.video-playlist-heading > span { color: #b97819; font-size: .61rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.video-playlist-heading h2 { color: #183559; font-size: 1.05rem; margin: 2px 0 0; }
.video-playlist-heading > i { display: block; margin-bottom: 0; }
.video-playlist-items { max-height: 500px; overflow-y: auto; padding: 7px; }
.video-playlist-items > a { align-items: center; border: 1px solid transparent; border-radius: 10px; color: inherit; display: grid; gap: 9px; grid-template-columns: 34px 1fr; padding: 10px; text-decoration: none; }
.video-playlist-items > a:hover { background: #f8fafc; }
.video-playlist-items > a.is-current { background: #eef6fa; border-color: #bad4e1; }
.video-playlist-items > a > span { align-items: center; background: #e7eef3; border-radius: 50%; color: #607086; display: flex; font-size: .68rem; font-weight: 900; height: 31px; justify-content: center; width: 31px; }
.video-playlist-items > a.is-complete > span { background: #d9f0e2; color: #23704a; }
.video-playlist-items a small, .video-playlist-items a strong { display: block; }
.video-playlist-items a small { color: #9a6817; font-size: .55rem; font-weight: 800; }
.video-playlist-items a strong { color: #334a61; font-size: .7rem; margin-top: 2px; }
.video-playlist-items a div > i { display: block; height: 4px; margin: 6px 0 0; }
.video-playlist-motivation { align-items: center; background: #fff8e8; border-top: 1px solid #ead39c; color: #765315; display: flex; gap: 9px; padding: 13px 15px; }
.video-playlist-motivation > i { font-size: 1.1rem; }
.video-playlist-motivation p { font-size: .61rem; line-height: 1.4; margin: 0; }
.video-playlist-motivation strong { display: block; }

.video-completion-modal[hidden] { display: none; }
.video-completion-modal { align-items: center; display: flex; inset: 0; justify-content: center; padding: 18px; position: fixed; z-index: 8000; }
.video-completion-backdrop { background: rgba(3,15,31,.78); inset: 0; opacity: 0; position: absolute; transition: opacity .2s; }
.video-completion-modal > section { background: #fff; border: 1px solid #e1ba61; border-radius: 20px; box-shadow: 0 28px 70px rgba(0,0,0,.28); max-width: 440px; opacity: 0; padding: 30px; position: relative; text-align: center; transform: translateY(18px) scale(.97); transition: opacity .2s,transform .2s; width: 100%; z-index: 1; }
.video-completion-modal.is-open .video-completion-backdrop, .video-completion-modal.is-open > section { opacity: 1; }
.video-completion-modal.is-open > section { transform: none; }
.video-completion-crown { align-items: center; background: #fff2c9; border-radius: 50%; color: #d39a3a; display: flex; font-size: 1.55rem; height: 60px; justify-content: center; margin: -62px auto 13px; width: 60px; }
.video-completion-modal section > small { color: #a46f19; font-size: .65rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.video-completion-modal h2 { color: #183559; font-family: Georgia,'Times New Roman',serif; margin: 7px 0; }
.video-completion-modal section > strong { color: #b97819; display: block; font-size: 1.25rem; }
.video-completion-modal section > p { color: #607086; font-size: .76rem; line-height: 1.5; }
.video-completion-modal [data-video-ranking-result] { background: #eef6fa; border: 1px solid #c9dde7; border-radius: 9px; color: #40546a; font-size: .7rem; padding: 10px; }
.video-completion-modal [data-video-ranking-result] strong { color: #b97819; }
.video-completion-actions { display: grid; gap: 8px; margin-top: 14px; }
.video-completion-actions a { background: #0f3b63; border-radius: 8px; color: #fff; font-size: .72rem; font-weight: 850; padding: 11px; text-decoration: none; }
.video-completion-actions a.is-secondary { background: #edf2f6; color: #183559; }
.video-completion-modal section > button { background: none; border: 0; color: #718096; cursor: pointer; font-size: .65rem; margin-top: 13px; text-decoration: underline; }
body.video-completion-open { overflow: hidden; }

/* Shared student learning profile */
.student-peek-hero { align-items: center; background: linear-gradient(120deg,#071c3e,#0f4f7d); border: 1px solid var(--student-league); border-radius: 20px; box-shadow: 0 18px 44px rgba(7,28,62,.16); color: #fff; display: grid; gap: 24px; grid-template-columns: 118px 1fr; padding: 30px; }
.student-peek-photo { align-items: center; background: #183559; border: 4px solid var(--student-league); border-radius: 50%; color: #fff; display: flex; font-size: 1.6rem; font-weight: 900; height: 104px; justify-content: center; overflow: hidden; width: 104px; }
.student-peek-photo img { height: 100%; object-fit: cover; width: 100%; }
.student-peek-copy > small { color: #e5bd62; font-size: .66rem; font-weight: 850; letter-spacing: .09em; text-transform: uppercase; }
.student-peek-copy h1 { font-family: Georgia,'Times New Roman',serif; font-size: clamp(2rem,4vw,3rem); margin: 5px 0; }
.student-peek-copy > p { color: #d8e5f1; margin: 0; }
.student-peek-copy > div { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 16px; }
.student-peek-copy > div span { background: rgba(255,255,255,.1); border-radius: 999px; font-size: .66rem; font-weight: 800; padding: 7px 10px; }
.student-peek-copy > div i { color: #e5bd62; }
.student-peek-stats { display: grid; gap: 11px; grid-template-columns: repeat(4,1fr); margin-top: 16px; }
.student-peek-stats article { background: #fff; border: 1px solid #dfe7ed; border-radius: 13px; display: grid; gap: 2px; grid-template-columns: 34px 1fr; padding: 15px; }
.student-peek-stats i { align-items: center; background: #eef5f8; border-radius: 9px; color: #0f5f91; display: flex; grid-row: span 2; justify-content: center; }
.student-peek-stats strong { color: #183559; font-size: 1.1rem; }
.student-peek-stats span { color: #718096; font-size: .61rem; }
.student-peek-progress, .student-peek-achievements { background: #fff; border: 1px solid #dfe7ed; border-radius: 15px; margin-top: 16px; padding: 20px; }
.student-peek-progress > div { display: flex; justify-content: space-between; }
.student-peek-progress > div span { color: #718096; font-size: .7rem; }
.student-peek-progress > div strong { color: #183559; font-size: .75rem; }
.student-peek-progress > i { background: #e3eaf0; border-radius: 99px; display: block; height: 8px; margin: 11px 0 6px; overflow: hidden; }
.student-peek-progress > i span { background: linear-gradient(90deg,#0f5f91,#4f9a7a); display: block; height: 100%; }
.student-peek-progress > small { color: #8b98a8; font-size: .6rem; }
.student-peek-achievements > div:first-child > small { color: #b97819; font-size: .62rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.student-peek-achievements h2 { color: #183559; margin: 2px 0 14px; }
.student-peek-achievements > div:last-child { display: grid; gap: 10px; grid-template-columns: repeat(3,1fr); }
.student-peek-achievements article { background: #f8fafc; border: 1px solid #e2e8f0; border-radius: 11px; padding: 13px; }
.student-peek-achievements article > span { align-items: center; background: #fff3cf; border-radius: 50%; color: #b97819; display: flex; height: 34px; justify-content: center; margin-bottom: 7px; width: 34px; }
.student-peek-achievements article strong { color: #183559; font-size: .75rem; }
.student-peek-achievements article p { color: #718096; font-size: .62rem; line-height: 1.4; margin: 3px 0 0; }
.student-peek-empty { color: #718096; font-size: .72rem; }
.student-peek-inspiration { align-items: center; background: #eef7f2; border: 1px solid #b9d8c6; border-radius: 13px; color: #405e4d; display: grid; gap: 12px; grid-template-columns: 38px 1fr auto; margin-top: 16px; padding: 15px; }
.student-peek-inspiration > i { color: #4f8069; font-size: 1.3rem; text-align: center; }
.student-peek-inspiration strong { color: #315844; font-size: .75rem; }
.student-peek-inspiration p { font-size: .65rem; margin: 2px 0 0; }
.student-peek-inspiration a, .student-peek-private > a { background: #315f49; border-radius: 8px; color: #fff; font-size: .68rem; font-weight: 800; padding: 9px 12px; text-decoration: none; }
.student-peek-private { background: #fff; border: 1px solid #dfe7ed; border-radius: 18px; padding: 45px 25px; text-align: center; }
.student-peek-private > span { align-items: center; background: #eef2f6; border-radius: 50%; color: #607086; display: inline-flex; font-size: 1.5rem; height: 58px; justify-content: center; width: 58px; }
.student-peek-private h1 { color: #183559; }
.student-peek-private p { color: #718096; margin-bottom: 22px; }

@media (max-width: 900px) {
    .learning-feature-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .learning-report-strip { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .learning-stat-grid { grid-template-columns: repeat(2,1fr); }
    .learning-dashboard-grid { grid-template-columns: 1fr; }
    .learning-trail-grid { grid-template-columns: repeat(2,1fr); }
    .learning-word-facts { grid-template-columns: repeat(2,1fr); }
    .competition-hero { grid-template-columns: 1fr; }
    .competition-league-card { justify-self: stretch; }
    .competition-main-grid { grid-template-columns: 1fr; }
    .competition-side-column { grid-template-columns: repeat(2,1fr); }
    .competition-challenge-grid, .competition-achievement-grid { grid-template-columns: repeat(2,1fr); }
    .video-course-hero { grid-template-columns: 1fr; }
    .video-course-hero > aside { max-width: none; }
    .video-learning-layout { grid-template-columns: 1fr; }
    .video-playlist { position: static; }
    .student-peek-stats { grid-template-columns: repeat(2,1fr); }
    .video-catalog-hero { grid-template-columns: 1fr; }
    .video-catalog-hero > aside { display: none; }
    .video-catalog-grid { grid-template-columns: repeat(2,minmax(0,1fr)); }
}

@media (max-width: 620px) {
    .learning-feature-grid, .learning-report-strip { grid-template-columns: 1fr; }
    .learning-section-heading { align-items: flex-start; flex-direction: column; gap: 6px; }
    .learning-section-heading p { text-align: left; }
    .learning-hub .learning-panel-heading > small { display: none; }
    .learning-reader-toolbar { align-items: stretch; flex-direction: column; }
    .learning-reader-toolbar-title { flex-basis: auto; }
    .learning-reader-toolbar > label { justify-content: space-between; }
    .learning-reader-toolbar select { flex: 1; }
    .verse-learning-steps { display: grid; grid-template-columns: repeat(2,1fr); }
    .verse-learning-buttons button { flex: 1 1 calc(50% - 7px); justify-content: center; }
    .learning-dashboard-hero { align-items: flex-start; flex-direction: column; }
    .learning-daily-goal { width: 100%; box-sizing: border-box; }
    .learning-stat-grid { grid-template-columns: 1fr; }
    .learning-trail-grid { grid-template-columns: 1fr; }
    .learning-competition-banner { grid-template-columns: 42px 1fr; }
    .learning-competition-banner > b { grid-column: 2; }
    .learning-word-row { grid-template-columns: 1fr auto; }
    .learning-word-meaning { grid-column: 1 / -1; grid-row: 2; }
    .learning-review-header { flex-direction: column; }
    .learning-flashcard-answer { grid-template-columns: 1fr; }
    .learning-review-ratings > div { grid-template-columns: repeat(2,1fr); }
    .learning-quiz-options { grid-template-columns: 1fr; }
    .learning-quiz-ranking { grid-template-columns: 72px 1fr; padding: 12px; }
    .learning-quiz-result-actions { flex-direction: column; }
    .learning-word-facts { grid-template-columns: 1fr; }
    .learning-grammar-clues > div { grid-template-columns: 1fr; gap: 2px; }
    .competition-quick-stats { grid-template-columns: repeat(2,1fr); }
    .competition-periods { box-sizing: border-box; overflow-x: auto; width: 100%; }
    .competition-periods a { flex: 0 0 auto; }
    .competition-podium { grid-template-columns: 1fr; }
    .competition-podium article, .competition-podium article.is-position-1 { min-height: 0; order: initial; }
    .competition-side-column { grid-template-columns: 1fr; }
    .competition-challenge-grid, .competition-achievement-grid { grid-template-columns: 1fr; }
    .competition-board th:nth-child(3), .competition-board td:nth-child(3) { display: none; }
    .video-course-page, .video-learning-page, .student-peek-page { padding-left: 10px; padding-right: 10px; }
    .video-course-hero { border-radius: 15px; padding: 24px 19px; }
    .video-course-heading { align-items: flex-start; flex-direction: column; gap: 5px; }
    .video-course-lessons article { align-items: start; grid-template-columns: 40px 1fr; padding: 13px; }
    .video-course-reward { align-items: center; flex-direction: row; grid-column: 2; justify-content: space-between; }
    .video-learning-topbar { grid-template-columns: 1fr auto; }
    .video-learning-topbar > div { display: none; }
    .video-stage { border-radius: 12px; }
    .video-lesson-actions { align-items: stretch; flex-direction: column; }
    .video-lesson-actions a { text-align: center; }
    .student-peek-hero { grid-template-columns: 76px 1fr; padding: 22px 16px; }
    .student-peek-photo { border-width: 3px; height: 68px; width: 68px; }
    .student-peek-copy h1 { font-size: 1.7rem; }
    .student-peek-stats { grid-template-columns: 1fr; }
    .student-peek-achievements > div:last-child { grid-template-columns: 1fr; }
    .student-peek-inspiration { grid-template-columns: 34px 1fr; }
    .student-peek-inspiration a { grid-column: 2; text-align: center; }
    .video-catalog-page { padding-left: 10px; padding-right: 10px; }
    .video-catalog-hero { border-radius: 15px; padding: 27px 20px; }
    .video-catalog-heading { align-items: flex-start; flex-direction: column; gap: 4px; }
    .video-catalog-grid { grid-template-columns: 1fr; }
}

@media (prefers-reduced-motion: reduce) {
    .learning-quiz-backdrop,
    .learning-quiz-panel,
    .learning-toast,
    .learning-trail-grid > a { transition: none; }
}
/* Assinaturas e checkout */
.billing-shell {
    --billing-navy: #0b2742;
    --billing-blue: #123f68;
    --billing-gold: #c98c32;
    --billing-ink: #17283a;
    --billing-muted: #607086;
    margin: 0 auto;
    max-width: 1240px;
    padding: 48px 22px 72px;
}

.billing-hero { max-width: 790px; margin-bottom: 34px; }
.billing-eyebrow, .admin-kicker { color: #a56720; font-size: .77rem; font-weight: 800; letter-spacing: .13em; margin: 0 0 9px; text-transform: uppercase; }
.billing-hero h1, .billing-form-panel h1, .billing-status-panel h1 { color: var(--billing-navy); font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2rem, 4vw, 3.65rem); letter-spacing: -.035em; line-height: 1.04; margin: 0 0 16px; }
.billing-hero > p, .billing-form-panel > p { color: var(--billing-muted); font-size: 1.08rem; line-height: 1.7; margin: 0; }
.billing-alert { background: #fff8e8; border: 1px solid #eed39a; border-radius: 10px; color: #754b0d; margin-top: 20px; padding: 14px 16px; }
.billing-alert.is-error { background: #fff0f1; border-color: #f2bdc2; color: #922c35; }
.billing-plans { display: grid; gap: 16px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.billing-plan { background: #fff; border: 1px solid #dce4ec; border-radius: 16px; box-shadow: 0 14px 35px rgba(11, 39, 66, .07); display: flex; flex-direction: column; min-height: 430px; padding: 28px 24px 24px; position: relative; }
.billing-plan.is-featured { border: 2px solid var(--billing-gold); box-shadow: 0 18px 45px rgba(140, 91, 26, .15); transform: translateY(-8px); }
.billing-plan-badge { background: var(--billing-gold); border-radius: 999px; color: #fff; font-size: .72rem; font-weight: 800; letter-spacing: .06em; padding: 7px 12px; position: absolute; right: 18px; text-transform: uppercase; top: -14px; }
.billing-plan h2 { color: var(--billing-navy); font-size: 1.3rem; margin: 0 0 22px; }
.billing-price { color: var(--billing-navy); font-family: Georgia, 'Times New Roman', serif; font-size: 2.25rem; font-weight: 700; letter-spacing: -.04em; margin: 0; }
.billing-period { color: #9b6421; font-size: .82rem; font-weight: 800; margin: 3px 0 18px; text-transform: uppercase; }
.billing-plan > p:not(.billing-price):not(.billing-period) { color: var(--billing-muted); line-height: 1.55; }
.billing-plan ul { color: #41556b; line-height: 1.45; list-style: none; margin: 16px 0 24px; padding: 0; }
.billing-plan li { margin: 0 0 10px; padding-left: 22px; position: relative; }
.billing-plan li::before { color: #1e7b61; content: '✓'; font-weight: 900; left: 0; position: absolute; }
.billing-plan form { margin-top: auto; }
.billing-button { align-items: center; background: var(--billing-blue); border: 0; border-radius: 8px; color: #fff !important; cursor: pointer; display: inline-flex; font: inherit; font-weight: 800; justify-content: center; min-height: 48px; padding: 12px 18px; text-align: center; text-decoration: none; transition: background .2s, transform .2s; width: 100%; }
.billing-button:hover { background: #092f51; transform: translateY(-1px); }
.billing-button:disabled { background: #9aa8b5; cursor: not-allowed; transform: none; }
.billing-button.is-secondary { background: #e8eef4; color: var(--billing-navy) !important; }
.billing-trust { border-top: 1px solid #dfe6ed; display: grid; gap: 22px; grid-template-columns: repeat(3, 1fr); margin-top: 46px; padding-top: 30px; }
.billing-trust > div { display: grid; gap: 4px; grid-template-columns: 28px 1fr; }
.billing-trust i { color: #a56720; grid-row: span 2; margin-top: 3px; }
.billing-trust strong { color: var(--billing-navy); }
.billing-trust span { color: var(--billing-muted); font-size: .9rem; line-height: 1.45; }
.billing-empty { background: #fff; border: 1px solid #dce4ec; border-radius: 14px; grid-column: 1 / -1; padding: 32px; }
.billing-empty h2 { color: var(--billing-navy); margin-top: 0; }

.billing-profile-shell { max-width: 1160px; }
.billing-steps { display: grid; grid-template-columns: repeat(3, 1fr); margin: 0 auto 38px; max-width: 720px; }
.billing-steps span { align-items: center; color: #7c8998; display: flex; font-weight: 800; gap: 8px; position: relative; }
.billing-steps span::before { align-items: center; background: #e3e9ef; border-radius: 50%; color: #5a6877; content: attr(data-step); display: flex; height: 32px; justify-content: center; width: 32px; }
.billing-steps span:not(:last-child)::after { background: #d8e0e8; content: ''; height: 2px; left: 48px; position: absolute; right: 12px; top: 16px; }
.billing-steps .is-done, .billing-steps .is-current { color: var(--billing-blue); }
.billing-steps small { font-size: .8rem; }
.billing-profile-layout { align-items: start; display: grid; gap: 26px; grid-template-columns: minmax(0, 1fr) 310px; }
.billing-form-panel, .billing-summary, .billing-status-panel { background: #fff; border: 1px solid #dce4ec; border-radius: 16px; box-shadow: 0 16px 42px rgba(11,39,66,.07); }
.billing-form-panel { padding: 34px; }
.billing-form-panel h1 { font-size: clamp(1.9rem, 3vw, 2.7rem); }
.billing-form { display: grid; gap: 17px 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); margin-top: 28px; }
.billing-field { display: flex; flex-direction: column; gap: 7px; }
.billing-field.full, .billing-consent.full, .billing-form-actions.full { grid-column: 1 / -1; }
.billing-field label { color: #263a4f; font-size: .86rem; font-weight: 800; }
.billing-field label small { color: #798899; font-weight: 500; }
.billing-field input, .billing-field select { background: #fbfcfd; border: 1px solid #cbd6e0; border-radius: 7px; color: #1d3044; font: inherit; min-height: 46px; padding: 10px 12px; width: 100%; }
.billing-field input:focus, .billing-field select:focus { border-color: #2b6d9d; box-shadow: 0 0 0 3px rgba(43,109,157,.13); outline: 0; }
.billing-consent { align-items: flex-start; color: #52657a; display: flex; font-size: .9rem; gap: 10px; line-height: 1.45; }
.billing-consent input { margin-top: 3px; }
.billing-form-actions { align-items: center; display: flex; gap: 18px; justify-content: flex-end; margin-top: 8px; }
.billing-form-actions a { color: var(--billing-blue); font-weight: 700; }
.billing-form-actions .billing-button { width: auto; }
.billing-summary { border-top: 5px solid var(--billing-gold); padding: 26px; position: sticky; top: 92px; }
.billing-summary > span { color: #8a641e; font-size: .75rem; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.billing-summary h2 { color: var(--billing-navy); font-size: 1.5rem; margin: 8px 0 12px; }
.billing-summary > strong { color: var(--billing-navy); font-family: Georgia, 'Times New Roman', serif; font-size: 2rem; }
.billing-summary p { color: var(--billing-muted); line-height: 1.55; }
.billing-summary hr { border: 0; border-top: 1px solid #dde5ec; margin: 23px 0; }
.billing-status-panel { margin: 40px auto; max-width: 650px; padding: 50px; text-align: center; }
.billing-status-panel .billing-button { margin: 18px auto 0; max-width: 280px; }
.billing-status-panel p { color: var(--billing-muted); line-height: 1.7; }
.billing-status-icon { align-items: center; background: #f9e9bd; border-radius: 50%; color: #9a631c; display: flex; font-size: 1.6rem; height: 66px; justify-content: center; margin: 0 auto 24px; width: 66px; }
.billing-status-icon.is-success { background: #dcefe8; color: #187157; }

/* Administração de assinaturas */
.admin-billing-page { color: #22364a; max-width: 1300px; }
.admin-page-heading { align-items: flex-start; display: flex; gap: 24px; justify-content: space-between; margin-bottom: 24px; }
.admin-page-heading h1 { color: #17334e; font-size: 2rem; margin: 0 0 7px; }
.admin-page-heading p:not(.admin-kicker) { color: #68798a; margin: 0; }
.admin-status-pill { background: #e9edf1; border-radius: 99px; color: #61707e; font-size: .78rem; font-weight: 800; padding: 9px 14px; white-space: nowrap; }
.admin-status-pill.is-on { background: #d9eee6; color: #14684e; }
.admin-billing-stats { display: grid; gap: 13px; grid-template-columns: repeat(4, minmax(0, 1fr)); margin-bottom: 20px; }
.admin-billing-stats > div { background: #fff; border: 1px solid #d9e2e9; border-radius: 9px; padding: 18px; }
.admin-billing-stats span { color: #778696; display: block; font-size: .8rem; font-weight: 700; margin-bottom: 8px; }
.admin-billing-stats strong { color: #17334e; font-size: 1.55rem; }
.admin-section-heading { align-items: flex-start; display: flex; justify-content: space-between; margin-bottom: 20px; }
.admin-section-heading h2, .admin-billing-page .card > h2 { color: #17334e; margin: 0 0 6px; }
.admin-section-heading p { color: #718092; margin: 0; max-width: 760px; }
.admin-plan-grid { display: grid; gap: 14px; grid-template-columns: repeat(4, minmax(0, 1fr)); }
.admin-plan-field { background: #f7f9fb; border: 1px solid #dce4ea; border-radius: 8px; padding: 15px; }
.admin-plan-field > div { display: flex; flex-direction: column; margin-bottom: 13px; }
.admin-plan-field small { color: #748393; }
.admin-plan-field label:not(.admin-check), .admin-config-grid label, .admin-inline-label { color: #405267; display: flex; flex-direction: column; font-size: .82rem; font-weight: 800; gap: 6px; }
.admin-plan-field input[type=text], .admin-plan-field input:not([type]), .admin-config-grid input, .admin-config-grid select, .admin-inline-label select { background: #fff; border: 1px solid #c8d4de; border-radius: 5px; font: inherit; min-height: 42px; padding: 9px 10px; width: 100%; }
.admin-check { align-items: center; display: flex; font-size: .82rem; gap: 7px; margin-top: 12px; }
.admin-remote-id { display: block; margin-top: 10px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.admin-inline-label { margin-top: 18px; max-width: 280px; }
.admin-config-grid { display: grid; gap: 16px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
.admin-config-grid .full { grid-column: 1 / -1; }
.admin-copy-row { display: flex; gap: 8px; }
.admin-copy-row input { background: #f7f9fb; border: 1px solid #cad5de; border-radius: 6px; flex: 1; min-width: 0; padding: 10px; }
.admin-copy-row button, .admin-secondary-actions button { background: #e7edf2; border: 1px solid #c8d4de; border-radius: 6px; color: #25415a; cursor: pointer; font-weight: 800; padding: 10px 14px; }
.admin-help { color: #718092; font-size: .85rem; line-height: 1.5; }
.admin-activation-card { align-items: center; display: flex; gap: 20px; justify-content: space-between; }
.admin-switch { align-items: flex-start; display: flex; gap: 10px; }
.admin-switch input { margin-top: 5px; }
.admin-switch span { display: flex; flex-direction: column; gap: 4px; }
.admin-switch small { color: #718092; }
.admin-primary-button { background: #174e78; border: 0; border-radius: 6px; color: #fff; cursor: pointer; font-weight: 800; padding: 12px 19px; }
.admin-secondary-actions { display: flex; gap: 10px; margin: -8px 0 20px; }
.admin-secondary-actions .is-danger { color: #9a3039; }
.admin-table-wrap { overflow-x: auto; }
.admin-billing-page td small { color: #7a8998; display: block; margin-top: 3px; }
.admin-transaction-status { background: #edf1f4; border-radius: 99px; font-size: .76rem; font-weight: 800; padding: 5px 9px; }

@media (max-width: 1050px) {
    .billing-plans, .admin-plan-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .billing-plan.is-featured { transform: none; }
    .admin-billing-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 760px) {
    .billing-shell { padding: 34px 15px 55px; }
    .billing-plans, .billing-trust, .billing-profile-layout, .admin-config-grid, .admin-plan-grid, .admin-billing-stats { grid-template-columns: 1fr; }
    .billing-plan { min-height: 0; }
    .billing-trust { gap: 18px; }
    .billing-form-panel { padding: 24px 18px; }
    .billing-form { grid-template-columns: 1fr; }
    .billing-field.full, .billing-consent.full, .billing-form-actions.full { grid-column: auto; }
    .billing-form-actions { align-items: stretch; flex-direction: column-reverse; }
    .billing-form-actions .billing-button { width: 100%; }
    .billing-summary { position: static; }
    .billing-steps small { display: none; }
    .billing-status-panel { padding: 35px 20px; }
    .admin-page-heading, .admin-activation-card { align-items: stretch; flex-direction: column; }
    .admin-config-grid .full { grid-column: auto; }
    .admin-copy-row, .admin-secondary-actions { flex-direction: column; }
}

/* Perfil do aluno */
.student-profile-page { margin: 0 auto; max-width: 1120px; padding: 42px 20px 70px; }
.student-profile-heading { align-items: flex-end; display: flex; gap: 20px; justify-content: space-between; margin-bottom: 24px; }
.student-profile-heading span { color: #a56720; font-size: .72rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.student-profile-heading h1 { color: #123653; font-family: Georgia,'Times New Roman',serif; font-size: clamp(2rem,4vw,3rem); margin: 4px 0 7px; }
.student-profile-heading p { color: #68798a; margin: 0; }
.student-profile-heading > a { background: #123f68; border-radius: 9px; color: #fff; font-size: .78rem; font-weight: 800; padding: 11px 14px; text-decoration: none; }
.student-profile-alert { border-radius: 10px; font-size: .86rem; font-weight: 750; margin-bottom: 18px; padding: 13px 15px; }
.student-profile-alert.is-error { background: #fff0f1; border: 1px solid #efbcc1; color: #912d36; }
.student-profile-alert.is-success { background: #eaf7f0; border: 1px solid #b9dfca; color: #17603d; }
.student-profile-form { align-items: start; display: grid; gap: 22px; grid-template-columns: 270px minmax(0,1fr); }
.student-profile-photo-card, .student-profile-fields > section { background: #fff; border: 1px solid #dce5ec; border-radius: 16px; box-shadow: 0 14px 36px rgba(15,45,70,.07); }
.student-profile-photo-card { align-items: center; display: flex; flex-direction: column; padding: 28px 22px; position: sticky; text-align: center; top: 100px; }
.student-profile-photo { align-items: center; background: #173d62; border: 5px solid #e7b54b; border-radius: 50%; color: #fff; display: flex; font-size: 2.2rem; font-weight: 900; height: 132px; justify-content: center; overflow: hidden; width: 132px; }
.student-profile-photo img { height: 100%; object-fit: cover; width: 100%; }
.student-profile-photo-card h2 { color: #17354f; margin: 18px 0 3px; }
.student-profile-photo-card p, .student-profile-photo-card small { color: #748496; font-size: .75rem; line-height: 1.45; }
.student-profile-photo-card > label:not(.student-profile-remove) { background: #e9f0f6; border-radius: 8px; color: #174e78; cursor: pointer; font-size: .78rem; font-weight: 850; margin: 13px 0 7px; padding: 10px 13px; }
.student-profile-photo-card > input[type=file] { height: 1px; opacity: 0; overflow: hidden; position: absolute; width: 1px; }
.student-profile-remove { align-items: center; color: #8f3840; display: flex; font-size: .75rem; gap: 7px; margin-top: 14px; }
.student-profile-fields { display: grid; gap: 16px; }
.student-profile-fields > section { padding: 25px; }
.student-profile-fields > section > div:first-child span { color: #a56720; font-size: .66rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.student-profile-fields h2 { color: #17354f; margin: 3px 0 20px; }
.student-profile-grid { display: grid; gap: 16px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.student-profile-grid > label:not(.student-profile-check) { color: #405268; display: flex; flex-direction: column; font-size: .8rem; font-weight: 800; gap: 7px; }
.student-profile-grid .full { grid-column: 1/-1; }
.student-profile-grid input[type=text], .student-profile-grid input[type=email], .student-profile-grid input[type=tel], .student-profile-grid textarea { background: #fbfcfd; border: 1px solid #cbd6df; border-radius: 8px; color: #21364b; font: inherit; padding: 11px 12px; }
.student-profile-grid input:focus, .student-profile-grid textarea:focus { border-color: #2c709f; box-shadow: 0 0 0 3px rgba(44,112,159,.13); outline: 0; }
.student-profile-check { align-items: center; color: #52657a; display: flex; font-size: .82rem; gap: 9px; }
.student-profile-actions { align-items: center; display: flex; gap: 14px; justify-content: flex-end; }
.student-profile-actions a { color: #52657a; font-weight: 750; text-decoration: none; }
.student-profile-actions button { background: #174e78; border: 0; border-radius: 9px; color: #fff; cursor: pointer; font: inherit; font-weight: 850; padding: 12px 17px; }
@media (max-width: 760px) { .student-profile-heading { align-items: flex-start; flex-direction: column; } .student-profile-form { grid-template-columns: 1fr; } .student-profile-photo-card { position: static; } .student-profile-grid { grid-template-columns: 1fr; } .student-profile-grid .full { grid-column: auto; } }

/* Trilha guiada de hebraico bíblico */
.guided-trail { margin: 0 auto; max-width: 1280px; padding: 34px 20px 72px; }
.guided-trail-hero { align-items: center; background: radial-gradient(circle at 85% 15%,rgba(229,189,98,.2),transparent 28%),linear-gradient(125deg,#071c3e,#0e4c76); border-radius: 22px; color: #fff; display: grid; gap: 38px; grid-template-columns: minmax(0,1fr) 230px; overflow: hidden; padding: 38px; }
.guided-trail-hero > div > span { color: #f0c76c; font-size: .7rem; font-weight: 900; letter-spacing: .12em; text-transform: uppercase; }
.guided-trail-hero h1 { font-family: Georgia,'Times New Roman',serif; font-size: clamp(2rem,4vw,3.4rem); letter-spacing: -.035em; line-height: 1.06; margin: 8px 0 14px; }
.guided-trail-hero p { color: #d6e4ef; line-height: 1.65; margin: 0; max-width: 72ch; }
.guided-trail-hero > div > div { display: flex; gap: 9px; margin-top: 22px; }
.guided-trail-hero a { border: 1px solid rgba(255,255,255,.3); border-radius: 9px; color: #fff; font-size: .78rem; font-weight: 850; padding: 11px 14px; text-decoration: none; }
.guided-trail-hero a:first-child { background: #f0c76c; border-color: #f0c76c; color: #17354f; }
.guided-trail-hero aside { background: rgba(255,255,255,.1); border: 1px solid rgba(255,255,255,.15); border-radius: 17px; display: flex; flex-direction: column; padding: 23px; text-align: center; }
.guided-trail-hero aside strong { color: #f0c76c; font-size: 2.5rem; }
.guided-trail-hero aside span { font-size: .72rem; font-weight: 800; }
.guided-trail-hero aside i { background: rgba(255,255,255,.16); border-radius: 99px; height: 7px; margin: 15px 0 8px; overflow: hidden; }
.guided-trail-hero aside i b { background: #f0c76c; display: block; height: 100%; }
.guided-trail-hero aside small { color: #bdccda; font-size: .65rem; }
.guided-trail-layout { align-items: start; display: grid; gap: 20px; grid-template-columns: 280px minmax(0,1fr); margin-top: 22px; }
.guided-trail-map { background: #fff; border: 1px solid #dfe7ed; border-radius: 16px; padding: 18px; position: sticky; top: 95px; }
.guided-trail-map > div { border-bottom: 1px solid #e5ebf0; margin-bottom: 10px; padding: 3px 4px 14px; }
.guided-trail-map > div span { color: #a56b1e; font-size: .61rem; font-weight: 900; letter-spacing: .08em; text-transform: uppercase; }
.guided-trail-map h2 { color: #17354f; margin: 3px 0 0; }
.guided-trail-map > a { align-items: center; border-radius: 11px; color: inherit; display: grid; gap: 10px; grid-template-columns: 40px 1fr; margin-top: 5px; padding: 10px; text-decoration: none; }
.guided-trail-map > a:hover,.guided-trail-map > a.is-current { background: #eef5f8; }
.guided-trail-map > a > span { align-items: center; background: #e4edf3; border-radius: 50%; color: #0f5f91; display: flex; height: 38px; justify-content: center; width: 38px; }
.guided-trail-map > a.is-complete > span { background: #dcefe5; color: #23704a; }
.guided-trail-map > a.is-locked { opacity: .47; }
.guided-trail-map a small,.guided-trail-map a strong,.guided-trail-map a em { display: block; }
.guided-trail-map a small { color: #9b6a24; font-size: .57rem; font-weight: 850; text-transform: uppercase; }
.guided-trail-map a strong { color: #263f56; font-size: .78rem; }
.guided-trail-map a em { color: #8290a0; font-size: .58rem; font-style: normal; }
.guided-trail-lessons { display: grid; gap: 17px; }
.guided-lesson { background: #fff; border: 1px solid #dfe7ed; border-radius: 17px; box-shadow: 0 12px 30px rgba(15,42,67,.06); overflow: hidden; scroll-margin-top: 100px; }
.guided-lesson-heading { align-items: center; background: #f7f9fb; border-bottom: 1px solid #e2e8ed; display: grid; gap: 14px; grid-template-columns: 52px 1fr auto; padding: 18px 21px; }
.guided-lesson-heading > span { align-items: center; background: #0f4f7d; border-radius: 13px; color: #fff; display: flex; font-size: 1.15rem; height: 48px; justify-content: center; width: 48px; }
.guided-lesson-heading small { color: #a56b1e; font-size: .61rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.guided-lesson-heading h2 { color: #17354f; font-size: 1.2rem; margin: 2px 0; }
.guided-lesson-heading p { color: #718096; font-size: .7rem; margin: 0; }
.guided-lesson-heading > b { color: #23704a; font-size: .68rem; }
.guided-teaching-note { align-items: flex-start; background: #fff8e8; border: 1px solid #ecd496; border-radius: 10px; color: #6f5420; display: flex; gap: 11px; margin: 20px; padding: 13px 15px; }
.guided-teaching-note > i { color: #b87c20; margin-top: 3px; }
.guided-teaching-note p { font-size: .76rem; line-height: 1.5; margin: 0; }
.guided-verse-card { border: 1px solid #dfe7ed; border-radius: 13px; margin: 14px 20px; padding: 19px; }
.guided-verse-card > small { color: #9a681f; display: block; font-size: .65rem; font-weight: 900; margin-bottom: 10px; text-transform: uppercase; }
.guided-verse-card > strong { color: #122f49; display: block; font-family:'SBL Hebrew','Ezra SIL',serif; font-size: 1.8rem; line-height: 1.8; text-align: right; }
.guided-verse-card > em { color: #356c92; display: block; font-size: .78rem; font-style: italic; line-height: 1.5; text-align: right; }
.guided-verse-card > p,.guided-vocabulary-grid p { border-top: 1px dashed #d7e0e7; color: #40556a; line-height: 1.55; margin: 13px 0 0; padding-top: 11px; }
.guided-verse-card > p span,.guided-vocabulary-grid p span { color: #9a681f; display: block; font-size: .58rem; font-weight: 900; text-transform: uppercase; }
.guided-writing-grid,.guided-vocabulary-grid { display: grid; gap: 11px; grid-template-columns: repeat(2,minmax(0,1fr)); padding: 0 20px 14px; }
.guided-writing-card,.guided-vocabulary-grid > section { border: 1px solid #dfe7ed; border-radius: 11px; display: flex; flex-direction: column; padding: 14px; }
.guided-writing-card > strong,.guided-vocabulary-grid strong { color: #17354f; font-family:'SBL Hebrew','Ezra SIL',serif; font-size: 1.55rem; text-align: right; }
.guided-writing-card > span { color: #40556a; font-size: .75rem; }
.guided-writing-card > small { color: #718096; font-size: .65rem; }
.guided-writing-card input { border: 1px solid #cbd6df; border-radius: 7px; font-family:'SBL Hebrew','Ezra SIL',serif; font-size: 1.2rem; margin-top: 10px; padding: 9px; }
.guided-writing-card input.is-correct { border-color: #3d9567; background: #eff9f3; }
.guided-writing-card input.is-wrong { border-color: #c85b64; background: #fff4f4; }
.guided-writing-card > em { color: #718096; font-size: .6rem; font-style: normal; margin-top: 5px; }
.guided-check-button { background: #e7eef4; border: 0; border-radius: 8px; color: #174e78; cursor: pointer; font-weight: 850; margin: 0 20px 15px; padding: 10px 13px; }
.guided-listening-list { display: grid; gap: 11px; padding: 0 20px 14px; }
.guided-listening-list > section { align-items: center; border: 1px solid #dfe7ed; border-radius: 11px; display: grid; gap: 12px; grid-template-columns: 150px 1fr; padding: 13px; }
.guided-listening-list > section > button { background: #0f4f7d; border: 0; border-radius: 8px; color: #fff; cursor: pointer; font-weight: 800; padding: 10px; }
.guided-listening-list > section > button.is-playing { background: #a66a1c; }
.guided-listening-list > section > div { display: flex; flex-wrap: wrap; gap: 7px; }
.guided-listening-list [data-listening-option] { background: #f7f9fb; border: 1px solid #ced9e2; border-radius: 8px; color: #40556a; cursor: pointer; padding: 8px 10px; }
.guided-listening-list [data-listening-option].is-correct { background: #e8f7ef; border-color: #69aa83; color: #17603d; }
.guided-listening-list [data-listening-option].is-wrong { background: #fff0f1; border-color: #d88990; color: #922e37; }
.guided-listening-list > section > p { grid-column: 1/-1; margin: 0; text-align: center; }
.guided-listening-list > section > p strong { display: block; font-family:'SBL Hebrew','Ezra SIL',serif; font-size: 1.5rem; }
.guided-listening-list > section > p span { color: #52657a; font-size: .72rem; }
.guided-vocabulary-grid > section { display: grid; gap: 3px; grid-template-columns: 34px 1fr; }
.guided-vocabulary-grid button { background: #e7eff5; border: 0; border-radius: 50%; color: #0f5f91; cursor: pointer; height: 32px; width: 32px; }
.guided-vocabulary-grid strong,.guided-vocabulary-grid em,.guided-vocabulary-grid p { grid-column: 2; }
.guided-vocabulary-grid em { color: #356c92; font-size: .68rem; }
.guided-vocabulary-grid p { font-size: .72rem; }
.guided-lesson-footer { align-items: center; border-top: 1px solid #e5ebef; display: flex; justify-content: space-between; margin-top: 18px; padding: 15px 20px; }
.guided-lesson-footer > span { color: #9a681f; font-size: .68rem; font-weight: 850; }
.guided-lesson-footer button { background: #174e78; border: 0; border-radius: 8px; color: #fff; cursor: pointer; font-weight: 850; padding: 10px 14px; }
.guided-lesson-footer button:disabled { background: #a7b3bd; cursor: not-allowed; }
.guided-lesson-lock { color: #718096; padding: 35px; text-align: center; }
.guided-lesson-lock i { color: #9aa7b5; font-size: 1.4rem; }
.guided-conversation { padding: 0 20px 4px; }
.guided-conversation-tabs { display: grid; gap: 9px; grid-template-columns: repeat(3,minmax(0,1fr)); margin-bottom: 16px; }
.guided-conversation-tabs button { align-items: center; background: #f5f8fa; border: 1px solid #d9e3ea; border-radius: 11px; color: #496076; cursor: pointer; display: grid; gap: 3px; grid-template-columns: 34px 1fr; padding: 11px 12px; text-align: left; }
.guided-conversation-tabs button > i { align-items: center; background: #e6eef4; border-radius: 9px; display: flex; grid-row: 1/3; height: 34px; justify-content: center; width: 34px; }
.guided-conversation-tabs button span { color: #24435e; font-size: .72rem; font-weight: 900; }
.guided-conversation-tabs button small { color: #7b8b9a; font-size: .62rem; }
.guided-conversation-tabs button[aria-selected="true"] { background: #174e78; border-color: #174e78; box-shadow: 0 7px 18px rgba(23,78,120,.18); color: #fff; }
.guided-conversation-tabs button[aria-selected="true"] > i { background: rgba(255,255,255,.14); }
.guided-conversation-tabs button[aria-selected="true"] span,.guided-conversation-tabs button[aria-selected="true"] small { color: #fff; }
.guided-conversation-panel[hidden],.guided-conversation-translation[hidden] { display: none; }
.guided-conversation-panel > header { align-items: center; background: #eef5f8; border: 1px solid #d9e6ec; border-radius: 12px; display: grid; gap: 11px; grid-template-columns: 45px 1fr auto; margin-bottom: 12px; padding: 13px; }
.guided-conversation-panel > header > span { align-items: center; background: #d8e8f0; border-radius: 50%; color: #174e78; display: flex; font-size: .65rem; font-weight: 900; height: 43px; justify-content: center; width: 43px; }
.guided-conversation-panel > header h3 { color: #17354f; font-size: .95rem; margin: 0 0 2px; }
.guided-conversation-panel > header p { color: #687b8d; font-size: .66rem; margin: 0; }
.guided-conversation-panel > header > strong { color: #9a681f; font-size: .66rem; white-space: nowrap; }
.guided-conversation-grid { display: grid; gap: 11px; grid-template-columns: repeat(2,minmax(0,1fr)); }
.guided-conversation-card { border: 1px solid #dde6ec; border-radius: 13px; display: flex; flex-direction: column; min-width: 0; padding: 15px; }
.guided-conversation-meta { align-items: center; display: flex; justify-content: space-between; }
.guided-conversation-meta span { color: #9a681f; font-size: .57rem; font-weight: 900; letter-spacing: .06em; text-transform: uppercase; }
.guided-conversation-meta strong { color: #61758a; font-size: .63rem; }
.guided-conversation-hebrew { color: #17354f; font-family:'SBL Hebrew','Ezra SIL',serif; font-size: 1.65rem; line-height: 1.65; margin: 13px 0 2px; text-align: right; }
.guided-conversation-transliteration { color: #356c92; font-size: .69rem; font-style: italic; line-height: 1.5; margin: 0 0 12px; text-align: right; }
.guided-conversation-reveal { align-items: center; align-self: flex-start; background: #edf3f7; border: 0; border-radius: 7px; color: #174e78; cursor: pointer; display: inline-flex; font-size: .64rem; font-weight: 850; gap: 6px; padding: 8px 10px; }
.guided-conversation-audio { align-items: center; align-self: flex-start; background: #174e78; border: 0; border-radius: 7px; color: #fff; cursor: pointer; display: inline-flex; font-size: .64rem; font-weight: 850; gap: 7px; margin-bottom: 7px; padding: 8px 11px; }
.guided-conversation-audio:hover,.guided-conversation-audio:focus-visible { background: #0e668f; outline: 3px solid rgba(23,78,120,.16); }
.guided-conversation-audio.is-playing { background: #a54b3e; }
.guided-conversation-translation { background: #fff8e7; border: 1px solid #ecd699; border-radius: 9px; margin-top: 10px; padding: 11px; }
.guided-conversation-translation small { color: #98661b; display: block; font-size: .55rem; font-weight: 900; text-transform: uppercase; }
.guided-conversation-translation strong { color: #3e4f5e; display: block; font-size: .76rem; line-height: 1.5; margin-top: 3px; }
.guided-conversation-translation p { color: #728090; font-size: .63rem; line-height: 1.45; margin: 7px 0 0; }
.guided-conversation-card > footer { border-top: 1px solid #e6ecef; display: flex; justify-content: space-between; margin-top: auto; padding-top: 11px; }
.guided-conversation-card > footer span { color: #7a8997; font-size: .58rem; }
@media (max-width:900px) { .guided-trail-hero { grid-template-columns: 1fr; } .guided-trail-layout { grid-template-columns: 1fr; } .guided-trail-map { position: static; } }
@media (max-width:620px) { .guided-trail { padding-left: 10px; padding-right: 10px; } .guided-trail-hero { border-radius: 15px; padding: 25px 19px; } .guided-trail-hero > div > div { align-items: stretch; flex-direction: column; } .guided-lesson-heading { grid-template-columns: 44px 1fr; } .guided-lesson-heading > b { grid-column: 2; } .guided-writing-grid,.guided-vocabulary-grid,.guided-conversation-grid { grid-template-columns: 1fr; } .guided-listening-list > section { grid-template-columns: 1fr; } .guided-conversation { padding-left: 12px; padding-right: 12px; } .guided-conversation-tabs { grid-template-columns: 1fr; } .guided-conversation-panel > header { grid-template-columns: 43px 1fr; } .guided-conversation-panel > header > strong { grid-column: 2; } }

/* Celebração de progresso exibida após o login do aluno */
body.login-progress-open { overflow: hidden; }
.login-progress-modal { align-items: center; display: flex; inset: 0; justify-content: center; opacity: 0; padding: 20px; position: fixed; transition: opacity .28s ease; z-index: 10000; }
.login-progress-modal.is-open { opacity: 1; }
.login-progress-backdrop { background: radial-gradient(circle at 50% 30%,rgba(20,83,120,.82),rgba(3,18,39,.96)); inset: 0; position: absolute; }
.login-progress-fireworks { height: 100%; inset: 0; pointer-events: none; position: absolute; width: 100%; z-index: 1; }
.login-progress-card { background: radial-gradient(circle at 100% 0,rgba(241,197,96,.2),transparent 35%),#fff; border: 1px solid rgba(241,197,96,.85); border-radius: 26px; box-shadow: 0 35px 100px rgba(0,0,0,.46),0 0 45px rgba(241,197,96,.18); max-width: 650px; opacity: 0; overflow: hidden; padding: 38px 38px 32px; position: relative; text-align: center; transform: translateY(28px) scale(.9); transition: opacity .4s ease .08s,transform .5s cubic-bezier(.18,.89,.32,1.28) .08s; width: 100%; z-index: 2; }
.login-progress-modal.is-open .login-progress-card { opacity: 1; transform: none; }
.login-progress-close { align-items: center; background: #edf2f6; border: 0; border-radius: 50%; color: #52657a; cursor: pointer; display: flex; height: 36px; justify-content: center; position: absolute; right: 18px; top: 18px; width: 36px; }
.login-progress-close:hover,.login-progress-close:focus-visible { background: #dfe9f0; color: #17354f; outline: 3px solid rgba(23,78,120,.2); }
.login-progress-medal { align-items: center; animation: login-medal-pulse 1.8s ease-in-out infinite; background: linear-gradient(145deg,#fff4bf,#e8a92e); border: 7px solid #fff8da; border-radius: 50%; box-shadow: 0 9px 30px rgba(196,128,21,.3); color: #76420c; display: flex; font-size: 1.9rem; height: 78px; justify-content: center; margin: 0 auto 17px; width: 78px; }
.login-progress-eyebrow { color: #a46916; display: block; font-size: .72rem; font-weight: 900; letter-spacing: .1em; text-transform: uppercase; }
.login-progress-card h2 { color: #17354f; font-family: Georgia,'Times New Roman',serif; font-size: clamp(1.8rem,5vw,2.65rem); letter-spacing: -.03em; line-height: 1.08; margin: 8px 0 10px; }
.login-progress-card > p { color: #5c6f82; line-height: 1.6; margin: 0 auto 24px; max-width: 53ch; }
.login-progress-stats { display: grid; gap: 10px; grid-template-columns: repeat(3,minmax(0,1fr)); }
.login-progress-stats article { background: #f5f8fa; border: 1px solid #e0e8ee; border-radius: 14px; display: flex; flex-direction: column; min-width: 0; padding: 15px 8px; }
.login-progress-stats article.is-featured { background: #fff8e7; border-color: #ecd08a; }
.login-progress-stats i { color: #b7781d; font-size: 1rem; margin-bottom: 5px; }
.login-progress-stats strong { color: #17354f; font-size: 1.65rem; line-height: 1; }
.login-progress-stats span { color: #40556a; font-size: .72rem; font-weight: 850; margin-top: 4px; }
.login-progress-stats small { color: #8090a0; font-size: .61rem; margin-top: 4px; }
.login-progress-track { margin: 18px 0; }
.login-progress-track > span { background: #e5edf2; border-radius: 99px; display: block; height: 8px; overflow: hidden; }
.login-progress-track b { background: linear-gradient(90deg,#c98925,#f2ce70); border-radius: inherit; display: block; height: 100%; transition: width .8s ease .45s; }
.login-progress-action { background: linear-gradient(135deg,#174e78,#0e668f); border-radius: 11px; box-shadow: 0 9px 20px rgba(15,79,125,.2); color: #fff; display: inline-flex; font-size: .82rem; font-weight: 900; gap: 9px; justify-content: center; padding: 13px 19px; text-decoration: none; }
.login-progress-action:hover,.login-progress-action:focus-visible { color: #fff; transform: translateY(-1px); }
@keyframes login-medal-pulse { 0%,100% { transform: scale(1) rotate(-2deg); } 50% { transform: scale(1.07) rotate(2deg); } }
@media (max-width:600px) { .login-progress-modal { padding: 10px; } .login-progress-card { border-radius: 20px; padding: 29px 16px 22px; } .login-progress-medal { height: 64px; width: 64px; } .login-progress-stats { gap: 6px; } .login-progress-stats article { padding: 12px 4px; } .login-progress-stats strong { font-size: 1.35rem; } .login-progress-card > p { font-size: .82rem; } }
@media (prefers-reduced-motion: reduce) { .login-progress-modal,.login-progress-card,.login-progress-track b { transition: none; } .login-progress-medal { animation: none; } .login-progress-fireworks { display: none; } }
/* Games hub and Biblical word search */
.word-search-feedback button{background:transparent;border:0;color:inherit;cursor:pointer;font:inherit;font-weight:900;text-decoration:underline}
.games-home,.word-search-game{--game-blue:#082f73;--game-deep:#061b48;--game-gold:#f1b81b;--game-cyan:#25c6da;max-width:1220px;margin:0 auto;padding:34px 22px 72px}.games-hero{align-items:center;background:radial-gradient(circle at 88% 25%,rgba(37,198,218,.24),transparent 28%),linear-gradient(135deg,#061b48,#0b4a9e);border-radius:30px;box-shadow:0 22px 55px rgba(6,31,79,.22);color:#fff;display:flex;justify-content:space-between;min-height:330px;overflow:hidden;padding:46px 56px;position:relative}.games-hero-copy{max-width:690px;position:relative;z-index:2}.games-eyebrow,.mission-kicker{color:#ffd65d;font-size:.76rem;font-weight:900;letter-spacing:.14em;text-transform:uppercase}.games-eyebrow i{margin-right:8px}.games-hero h1{font-size:clamp(2.5rem,6vw,4.8rem);letter-spacing:-.045em;line-height:.95;margin:14px 0 18px}.games-hero p{color:rgba(255,255,255,.82);font-size:1.08rem;line-height:1.7;margin:0;max-width:620px}.games-summary{display:flex;gap:12px;margin-top:28px}.games-summary span{background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.16);border-radius:16px;display:grid;min-width:120px;padding:13px 17px}.games-summary b{font-size:1.35rem}.games-summary small{color:rgba(255,255,255,.65);font-size:.72rem}.games-login-cta{background:var(--game-gold);border-radius:14px;color:#312000;display:inline-flex;font-weight:900;margin-top:25px;padding:14px 20px;text-decoration:none}.games-hero-orbit{height:250px;min-width:290px;position:relative}.games-hero-orbit span,.games-hero-orbit i{align-items:center;animation:gameFloat 4s ease-in-out infinite;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.2);border-radius:24px;display:flex;font-size:3rem;height:92px;justify-content:center;position:absolute;width:92px}.games-hero-orbit span:nth-child(1){left:12px;top:48px}.games-hero-orbit span:nth-child(2){animation-delay:-1.2s;right:22px;top:4px}.games-hero-orbit span:nth-child(3){animation-delay:-2.1s;bottom:5px;right:62px}.games-hero-orbit i{animation-delay:-.7s;background:var(--game-gold);color:#594000;font-size:2rem;height:58px;left:105px;top:100px;width:58px}.games-library{display:grid;gap:22px;grid-template-columns:minmax(0,2fr) minmax(260px,1fr);margin-top:30px}.game-card{background:#fff;border:1px solid #e3e9f3;border-radius:26px;box-shadow:0 14px 40px rgba(19,47,90,.09);overflow:hidden}.game-card-word-search{display:grid;grid-template-columns:minmax(280px,.92fr) 1.08fr}.game-card-preview{align-content:center;background:linear-gradient(145deg,#eaf8fb,#dbeafd);display:grid;gap:9px;grid-template-columns:repeat(4,54px);justify-content:center;min-height:390px;padding:28px}.game-card-preview span{align-items:center;background:#fff;border:1px solid #cddced;border-radius:12px;box-shadow:0 5px 12px rgba(8,47,115,.08);color:#173d71;display:flex;font-family:'Times New Roman',serif;font-size:1.65rem;height:54px;justify-content:center}.game-card-preview span.is-lit{animation:gamePulse 1.8s ease-in-out infinite;background:var(--game-gold);border-color:#e3a700;color:#372500}.game-card-copy{padding:38px}.game-card-status{background:#e8f8ee;border-radius:999px;color:#178344;font-size:.72rem;font-weight:900;padding:7px 11px;text-transform:uppercase}.game-card h2{color:#102b57;font-size:1.7rem;margin:17px 0 10px}.game-card p{color:#65728a;line-height:1.65}.game-card ul{display:grid;gap:9px;list-style:none;margin:20px 0 24px;padding:0}.game-card li{color:#34445e;font-size:.9rem}.game-card li i{color:#d29a00;margin-right:8px;width:18px}.game-card-copy>a{align-items:center;background:var(--game-blue);border-radius:13px;color:#fff;display:inline-flex;font-weight:900;gap:10px;padding:13px 18px;text-decoration:none}.game-card-coming{align-items:center;background:linear-gradient(145deg,#fbfaf6,#f5f0df);display:flex;gap:19px;padding:30px}.game-card-coming>span{align-items:center;background:#e7ddbd;border-radius:18px;color:#8a7433;display:flex;font-size:1.4rem;height:62px;justify-content:center;min-width:62px}.game-card-coming small{color:#9b7920;font-weight:900;text-transform:uppercase}.game-card-coming h2{margin:5px 0}.game-card-coming p{margin:0}.word-search-game{max-width:1280px}.word-search-topbar{align-items:center;background:linear-gradient(135deg,var(--game-deep),#0a4698);border-radius:24px;color:#fff;display:grid;grid-template-columns:56px 1fr auto;padding:18px 24px}.word-search-topbar>a{align-items:center;background:rgba(255,255,255,.12);border-radius:14px;color:#fff;display:flex;height:44px;justify-content:center;width:44px}.word-search-topbar span{color:#9edceb;font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.word-search-topbar h1{font-size:1.55rem;margin:3px 0 0}.word-search-score{align-items:center;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.15);border-radius:15px;display:grid;gap:0 7px;grid-template-columns:auto auto;padding:9px 15px}.word-search-score i{color:var(--game-gold);grid-row:1/3}.word-search-score strong{font-size:1.2rem}.word-search-score small{color:#b7c7df;font-size:.62rem}.word-search-progress{align-items:center;display:flex;gap:18px;padding:15px 10px}.word-search-progress>span{background:#e5ebf4;border-radius:999px;display:block;flex:1;height:8px;overflow:hidden}.word-search-progress>span i{background:linear-gradient(90deg,var(--game-cyan),var(--game-gold));border-radius:inherit;display:block;height:100%;transition:width .5s}.word-search-progress p{color:#68758b;font-size:.77rem;margin:0;white-space:nowrap}.word-search-layout{display:grid;gap:24px;grid-template-columns:330px minmax(0,1fr)}.word-search-mission,.word-search-board-panel{background:#fff;border:1px solid #e2e8f1;border-radius:24px;box-shadow:0 14px 38px rgba(17,46,89,.08)}.word-search-mission{padding:28px}.mission-kicker{color:#b68400}.word-search-mission h2{color:#102d5b;font-size:1.5rem;margin:7px 0 8px}.word-search-mission>p{color:#728097;font-size:.9rem;line-height:1.55}.word-search-targets{display:grid;gap:10px;margin-top:22px}.word-search-targets article{align-items:center;background:#f6f8fc;border:1px solid #e1e7f0;border-radius:15px;display:grid;gap:10px;grid-template-columns:auto 1fr auto;padding:12px;position:relative;transition:.25s}.word-search-targets article>i{color:#9aa8bb}.word-search-targets article small{color:#53627a;display:block;font-size:.74rem}.word-search-targets article b{color:#173e75;display:block;font-family:'Times New Roman',serif;font-size:1.25rem;margin-top:2px}.word-search-targets article>span{color:#a17400;font-size:.7rem;font-weight:900}.word-search-targets article.is-found{background:#e9f9ef;border-color:#7bd69b;transform:scale(1.015)}.word-search-targets article.is-found>i{color:#20a052}.word-search-targets article.is-found b{text-decoration:line-through}.word-search-stage-reward{align-items:center;background:#fff6d8;border:1px solid #f0d675;border-radius:14px;color:#775b09;display:flex;gap:11px;margin-top:18px;padding:12px}.word-search-stage-reward i{color:#d69c00}.word-search-board-panel{align-items:center;display:flex;flex-direction:column;min-width:0;padding:20px}.word-search-feedback{background:#eef6ff;border-radius:999px;color:#214d84;font-size:.88rem;font-weight:800;margin-bottom:15px;min-height:20px;padding:8px 16px;text-align:center;transition:.2s}.word-search-feedback.is-success{background:#dcf8e6;color:#168347;transform:scale(1.06)}.word-search-feedback.is-error{background:#ffe5e5;color:#a52222}.word-search-board{--grid-size:12;aspect-ratio:1;background:linear-gradient(145deg,#eaf1fb,#f8fbff);border:1px solid #cfdced;border-radius:20px;display:grid;gap:clamp(2px,.35vw,5px);grid-template-columns:repeat(var(--grid-size),1fr);max-width:690px;padding:clamp(7px,1vw,13px);touch-action:none;width:min(100%,690px)}.word-search-cell{align-items:center;aspect-ratio:1;background:#fff;border:1px solid #dce6f2;border-radius:clamp(4px,.55vw,9px);color:#193d70;cursor:pointer;display:flex;font-family:'Times New Roman',serif;font-size:clamp(.72rem,2.1vw,1.45rem);font-weight:700;justify-content:center;min-width:0;padding:0;transition:background .12s,transform .12s,box-shadow .12s}.word-search-cell:hover{background:#eff8ff;transform:translateY(-1px)}.word-search-cell.is-selecting{background:#9ce9f1;border-color:#25b8c9;box-shadow:0 0 0 2px rgba(37,198,218,.15);color:#07394f;transform:scale(1.06)}.word-search-cell.is-found{animation:foundPop .42s ease;background:var(--game-gold);border-color:#d89d00;box-shadow:0 3px 9px rgba(211,154,0,.25);color:#3b2a00}.word-search-cell.is-wrong{animation:gameShake .35s;background:#ffdede;border-color:#ec7777}.word-search-tip{color:#7c899c;font-size:.78rem;margin:14px 0 0}.word-search-finished{align-items:center;color:#173e75;display:flex;flex-direction:column;grid-column:1/-1;justify-content:center;padding:50px;text-align:center}.word-search-finished i{color:var(--game-gold);font-size:3rem}.word-search-celebration[hidden]{display:none}.word-search-celebration{align-items:center;background:rgba(2,17,47,.72);display:flex;inset:0;justify-content:center;padding:20px;position:fixed;z-index:2100}.word-search-celebration-card{animation:celebrationIn .48s cubic-bezier(.2,.9,.25,1.2);background:#fff;border-radius:28px;box-shadow:0 30px 90px rgba(0,0,0,.35);max-width:410px;padding:34px;position:relative;text-align:center;z-index:2}.celebration-trophy{align-items:center;background:linear-gradient(145deg,#ffe889,#efad00);border-radius:50%;color:#6b4700;display:flex;font-size:2rem;height:78px;justify-content:center;margin:-70px auto 18px;width:78px}.word-search-celebration-card>small{color:#9a7207;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.word-search-celebration-card h2{color:#102e5c;font-size:2.1rem;margin:7px 0}.word-search-celebration-card p{color:#67758b;line-height:1.6}.word-search-celebration-card button{background:var(--game-blue);border:0;border-radius:13px;color:#fff;cursor:pointer;font:inherit;font-weight:900;padding:13px 19px}.word-search-confetti{inset:0;overflow:hidden;pointer-events:none;position:absolute}.word-search-confetti i{animation:confettiFall 2.4s var(--delay) ease-in both;background:hsl(var(--hue),85%,58%);height:13px;left:var(--x);position:absolute;top:-20px;transform:rotate(25deg);width:7px}.word-search-spark{inset:50%;pointer-events:none;position:absolute}.word-search-spark i{animation:sparkOut .75s ease-out both;background:var(--game-gold);border-radius:50%;height:7px;position:absolute;width:7px}.word-search-spark i:nth-child(1){--sx:45px;--sy:0}.word-search-spark i:nth-child(2){--sx:-45px;--sy:0}.word-search-spark i:nth-child(3){--sx:25px;--sy:35px}.word-search-spark i:nth-child(4){--sx:-25px;--sy:35px}.word-search-spark i:nth-child(5){--sx:25px;--sy:-35px}.word-search-spark i:nth-child(6){--sx:-25px;--sy:-35px}@keyframes gameFloat{50%{transform:translateY(-12px) rotate(3deg)}}@keyframes gamePulse{50%{box-shadow:0 0 0 8px rgba(241,184,27,.16);transform:scale(1.06)}}@keyframes foundPop{50%{transform:scale(1.18)}}@keyframes gameShake{25%{transform:translateX(-3px)}75%{transform:translateX(3px)}}@keyframes celebrationIn{from{opacity:0;transform:translateY(30px) scale(.88)}}@keyframes confettiFall{to{top:110%;transform:rotate(680deg) translateX(35px)}}@keyframes sparkOut{to{opacity:0;transform:translate(var(--sx),var(--sy)) scale(0)}}
@media(max-width:900px){.games-hero{padding:38px}.games-hero-orbit{display:none}.games-library,.word-search-layout{grid-template-columns:1fr}.game-card-word-search{grid-template-columns:1fr}.game-card-preview{min-height:300px}.word-search-mission{order:2}.word-search-board-panel{order:1}}@media(max-width:620px){.games-home,.word-search-game{padding:20px 12px 52px}.games-hero{border-radius:22px;padding:30px 23px}.games-summary{display:grid;grid-template-columns:repeat(3,1fr)}.games-summary span{min-width:0;padding:10px}.games-summary b{font-size:1.05rem}.game-card-preview{grid-template-columns:repeat(4,46px);min-height:250px}.game-card-preview span{font-size:1.35rem;height:46px}.game-card-copy{padding:26px}.word-search-topbar{grid-template-columns:46px 1fr auto;padding:14px}.word-search-topbar h1{font-size:1.22rem}.word-search-topbar>div:nth-child(2)>span{display:none}.word-search-score{padding:7px 10px}.word-search-progress{align-items:flex-start;flex-direction:column;gap:7px}.word-search-progress>span{flex:none;width:100%}.word-search-board-panel{padding:10px}.word-search-board{border-radius:15px}.word-search-cell{font-size:clamp(.62rem,4vw,1rem)}.word-search-mission{padding:22px}}
.word-search-cell.is-found.word-color-1{background:#ffd166;border-color:#dcae35;box-shadow:0 3px 9px rgba(220,174,53,.28);color:#493500}.word-search-cell.is-found.word-color-2{background:#72d6a0;border-color:#35a96a;box-shadow:0 3px 9px rgba(53,169,106,.25);color:#073b24}.word-search-cell.is-found.word-color-3{background:#a9a0f5;border-color:#776cda;box-shadow:0 3px 9px rgba(119,108,218,.25);color:#241b68}.word-search-cell.is-found.word-color-4{background:#ff9f8f;border-color:#df6f5d;box-shadow:0 3px 9px rgba(223,111,93,.25);color:#5b170c}.word-search-cell.is-found.word-color-5{background:#70d8e4;border-color:#31aab8;box-shadow:0 3px 9px rgba(49,170,184,.25);color:#073c43}.word-search-cell.is-found.word-color-6{background:#f3a6d4;border-color:#d16ca9;box-shadow:0 3px 9px rgba(209,108,169,.25);color:#58133c}.word-search-targets article.is-found.word-color-1{background:#fff5d8;border-color:#e8bc49}.word-search-targets article.is-found.word-color-2{background:#e3f8ec;border-color:#63c78d}.word-search-targets article.is-found.word-color-3{background:#eeecff;border-color:#968dea}.word-search-targets article.is-found.word-color-4{background:#ffebe7;border-color:#ee8c7c}.word-search-targets article.is-found.word-color-5{background:#e1f8fb;border-color:#55c2cf}.word-search-targets article.is-found.word-color-6{background:#fce8f4;border-color:#df8cbd}.word-search-targets article.is-found.word-color-1>i{color:#b47d00}.word-search-targets article.is-found.word-color-2>i{color:#16844a}.word-search-targets article.is-found.word-color-3>i{color:#5b50bd}.word-search-targets article.is-found.word-color-4>i{color:#bd4f3e}.word-search-targets article.is-found.word-color-5>i{color:#168b98}.word-search-targets article.is-found.word-color-6>i{color:#b34c8a}
.game-card-alphabet{background:linear-gradient(145deg,#fffaf0,#f1f7ff);display:flex;flex-direction:column;justify-content:center;padding:28px}.game-card-alphabet>div:last-child>small{color:#917000;font-size:.72rem;font-weight:900;letter-spacing:.08em;text-transform:uppercase}.alphabet-card-symbols{display:flex;gap:9px;margin-bottom:4px}.alphabet-card-symbols span{align-items:center;background:#fff;border:1px solid #d9dfeb;border-radius:14px;box-shadow:0 6px 16px rgba(20,49,90,.08);color:#173e75;display:flex;font-family:'Times New Roman',serif;font-size:2rem;height:58px;justify-content:center;width:58px}.alphabet-card-symbols span:nth-child(2){background:#e8f8ee;color:#167645}.alphabet-card-symbols span:nth-child(3){background:#fff0c7;color:#765600}.game-card-alphabet a{align-items:center;background:#7a4eb0;border-radius:13px;color:#fff;display:inline-flex;font-size:.88rem;font-weight:900;gap:8px;padding:12px 15px;text-decoration:none}.alphabet-card-progress{color:#6c5687!important;font-size:.82rem}.alphabet-game{--alphabet-purple:#59318c;--alphabet-deep:#24133f;max-width:1120px;margin:0 auto;padding:34px 22px 72px}.alphabet-game-topbar{align-items:center;background:linear-gradient(135deg,var(--alphabet-deep),#653a9b);border-radius:24px;color:#fff;display:grid;grid-template-columns:56px 1fr auto;padding:18px 24px}.alphabet-game-topbar>a{align-items:center;background:rgba(255,255,255,.12);border-radius:14px;color:#fff;display:flex;height:44px;justify-content:center;width:44px}.alphabet-game-topbar span{color:#dec8ff;font-size:.72rem;font-weight:900;letter-spacing:.12em;text-transform:uppercase}.alphabet-game-topbar h1{font-size:1.55rem;margin:3px 0 0}.alphabet-game-score{align-items:center;background:rgba(255,255,255,.11);border:1px solid rgba(255,255,255,.16);border-radius:15px;display:grid;gap:0 7px;grid-template-columns:auto auto;padding:9px 15px}.alphabet-game-score i{color:#ffd166;grid-row:1/3}.alphabet-game-score strong{font-size:1.2rem}.alphabet-game-score small{color:#d8cae9;font-size:.62rem}.alphabet-game-status{align-items:center;display:grid;gap:18px;grid-template-columns:auto 1fr auto;padding:16px 10px}.alphabet-game-status>div:not(.alphabet-game-progress){display:grid}.alphabet-game-status span{color:#7a6c8c;font-size:.7rem}.alphabet-game-status b{color:#402366;font-size:.85rem}.alphabet-game-progress{align-items:center;display:flex;gap:10px}.alphabet-game-progress>span{background:#e8e1f1;border-radius:999px;display:block;flex:1;height:9px;overflow:hidden}.alphabet-game-progress>span i{background:linear-gradient(90deg,#8053ba,#25c6da);border-radius:inherit;display:block;height:100%;transition:width .35s}.alphabet-game-progress small{color:#796d87;white-space:nowrap}.alphabet-game-arena{background:radial-gradient(circle at 10% 20%,rgba(128,83,186,.16),transparent 25%),radial-gradient(circle at 88% 85%,rgba(37,198,218,.16),transparent 25%),linear-gradient(145deg,#f8f4fc,#edf7fb);border:1px solid #ded4e9;border-radius:28px;min-height:590px;overflow:hidden;padding:38px;position:relative}.alphabet-game-orbit span{color:rgba(89,49,140,.11);font-family:'Times New Roman',serif;font-size:7rem;position:absolute}.alphabet-game-orbit span:nth-child(1){left:4%;top:7%}.alphabet-game-orbit span:nth-child(2){right:4%;top:12%}.alphabet-game-orbit span:nth-child(3){bottom:3%;left:8%}.alphabet-question-card{background:#fff;border:1px solid #e0d7e9;border-radius:26px;box-shadow:0 22px 55px rgba(51,30,80,.13);margin:0 auto;max-width:670px;padding:34px;position:relative;text-align:center;z-index:2}.alphabet-question-kind{background:#eee5f8;border-radius:999px;color:#653a97;font-size:.72rem;font-weight:900;letter-spacing:.08em;padding:7px 12px;text-transform:uppercase}.alphabet-question-card>p{color:#7d708d;margin:25px 0 4px}.alphabet-question-card h2{color:#2c1749;font-size:2.25rem;margin:0}.alphabet-sound-clue{align-items:center;background:#f4f9ff;border:1px solid #dceaf7;border-radius:17px;display:flex;gap:14px;margin:20px auto;max-width:420px;padding:14px 18px;text-align:left}.alphabet-sound-clue>i{align-items:center;background:#dff2f6;border-radius:50%;color:#188b9a;display:flex;height:42px;justify-content:center;min-width:42px}.alphabet-sound-clue b{color:#244c72;display:block}.alphabet-sound-clue small{color:#71849a;display:block;margin-top:2px}.alphabet-options{display:grid;gap:14px;grid-template-columns:repeat(3,1fr);margin-top:26px}.alphabet-options button{background:#fff;border:2px solid #e1d9e9;border-radius:20px;color:#321c51;cursor:pointer;min-height:150px;padding:15px;transition:.2s}.alphabet-options button:hover:not(:disabled){border-color:#8b63bd;box-shadow:0 10px 25px rgba(89,49,140,.14);transform:translateY(-4px)}.alphabet-options button span{display:block;font-family:'Times New Roman',serif;font-size:4rem;line-height:1.1}.alphabet-options button small{color:#78678d;display:block;font-weight:800;margin-top:8px}.alphabet-options button.is-correct{animation:foundPop .42s;background:#dff8e9;border-color:#49bd78;color:#0b6634}.alphabet-options button.is-wrong{animation:gameShake .35s;background:#ffe5e5;border-color:#df7676;color:#8a2020}.alphabet-feedback{border-radius:14px;color:#6f6280;font-size:.88rem;font-weight:800;margin-top:20px;min-height:22px;padding:9px}.alphabet-feedback.is-correct{background:#e6f8ed;color:#157842}.alphabet-feedback.is-wrong{background:#ffeaea;color:#9a2d2d}.alphabet-feedback button{background:transparent;border:0;color:inherit;cursor:pointer;font:inherit;font-weight:900;text-decoration:underline}.alphabet-next{background:var(--alphabet-purple);border:0;border-radius:13px;color:#fff;cursor:pointer;font:inherit;font-weight:900;margin-top:12px;padding:13px 18px}.alphabet-next[hidden]{display:none}.alphabet-celebration[hidden]{display:none}.alphabet-celebration{align-items:center;background:rgba(28,13,49,.78);display:flex;inset:0;justify-content:center;padding:20px;position:fixed;z-index:2100}.alphabet-celebration-card{animation:celebrationIn .48s cubic-bezier(.2,.9,.25,1.2);background:#fff;border-radius:28px;box-shadow:0 30px 90px rgba(0,0,0,.35);max-width:430px;padding:36px;text-align:center;z-index:2}.alphabet-celebration-icon{align-items:center;background:linear-gradient(145deg,#ffe889,#efad00);border-radius:50%;color:#644300;display:flex;font-size:1.9rem;height:78px;justify-content:center;margin:-73px auto 18px;width:78px}.alphabet-celebration-card>small{color:#79509f;font-weight:900;letter-spacing:.1em;text-transform:uppercase}.alphabet-celebration-card h2{color:#321b51;font-size:2rem;margin:8px 0}.alphabet-celebration-card p{color:#71657f;line-height:1.6}.alphabet-celebration-card button{background:var(--alphabet-purple);border:0;border-radius:13px;color:#fff;cursor:pointer;font:inherit;font-weight:900;padding:13px 19px}.alphabet-celebration .word-search-confetti{inset:0;position:absolute}@media(max-width:700px){.alphabet-game{padding:20px 12px 52px}.alphabet-game-topbar{grid-template-columns:46px 1fr auto;padding:14px}.alphabet-game-topbar>div:nth-child(2)>span{display:none}.alphabet-game-status{grid-template-columns:1fr 1fr}.alphabet-game-progress{grid-column:1/-1;grid-row:2}.alphabet-game-arena{min-height:520px;padding:18px 10px}.alphabet-question-card{padding:27px 15px}.alphabet-options{gap:8px}.alphabet-options button{border-radius:15px;min-height:120px;padding:9px}.alphabet-options button span{font-size:3rem}.alphabet-options button small{font-size:.66rem}}
/* Leitor bíblico interlinear e ferramentas públicas de estudo */
.bible-student-ranking.is-collapsed #bible-ranking-content {
    display: none;
}

.bible-ranking-heading-actions {
    display: flex;
    align-items: center;
    gap: 10px;
}

.bible-ranking-heading-actions button {
    border: 1px solid rgba(255, 255, 255, .4);
    background: rgba(255, 255, 255, .12);
    color: inherit;
    border-radius: 999px;
    padding: 8px 12px;
    cursor: pointer;
}

.bible-student-ranking:not(.is-collapsed) .bible-ranking-heading-actions button i {
    transform: rotate(180deg);
}

.reader-study-toolbar {
    margin: 14px 0 18px;
    padding: 16px;
    border: 1px solid #dce7e3;
    border-radius: 16px;
    background: linear-gradient(135deg, #f8fcfa, #f5f8ff);
    box-shadow: 0 8px 28px rgba(23, 64, 52, .06);
}

.reader-word-hint {
    display: flex;
    align-items: center;
    gap: 12px;
    color: #284c42;
    margin-bottom: 14px;
}

.reader-word-hint > i {
    display: grid;
    place-items: center;
    width: 38px;
    height: 38px;
    flex: 0 0 38px;
    border-radius: 50%;
    background: #dff3e9;
    color: #15704f;
}

.reader-study-controls,
.reader-mode-switcher {
    display: flex;
    align-items: end;
    flex-wrap: wrap;
    gap: 10px;
}

.reader-study-controls label:not(.reader-check) {
    display: grid;
    gap: 5px;
    min-width: 155px;
}

.reader-study-controls label > span {
    font-size: .78rem;
    font-weight: 700;
    color: #52615d;
}

.reader-study-controls select,
.reader-tool-button {
    min-height: 40px;
    border: 1px solid #cddbd6;
    border-radius: 10px;
    background: #fff;
    padding: 8px 11px;
    color: #263d36;
}

.reader-check {
    display: flex;
    align-items: center;
    gap: 7px;
    min-height: 40px;
    padding: 0 4px;
}

.reader-tool-button {
    cursor: pointer;
}

.reader-tool-button.is-active {
    background: #175f49;
    border-color: #175f49;
    color: #fff;
}

.reader-mode-switcher {
    margin-top: 13px;
    padding-top: 13px;
    border-top: 1px solid #dce7e3;
}

.reader-mode-switcher button {
    border: 1px solid #cbd8d4;
    border-radius: 999px;
    padding: 8px 12px;
    background: #fff;
    color: #35534a;
    cursor: pointer;
}

.reader-mode-switcher button.is-active {
    border-color: #176b50;
    background: #176b50;
    color: #fff;
}

.reader-grammar-legend {
    display: none;
    gap: 8px;
    flex-wrap: wrap;
    margin-top: 12px;
    font-size: .76rem;
}

.reader-study-toolbar:has(#reader-grammar-colors:checked) .reader-grammar-legend {
    display: flex;
}

.reader-grammar-legend span {
    padding: 4px 8px;
    border-radius: 999px;
}

.reader-grammar-legend .is-verb { background: #ffe1df; color: #9a3028; }
.reader-grammar-legend .is-noun { background: #dcecff; color: #225992; }
.reader-grammar-legend .is-adjective { background: #eee3ff; color: #68409b; }
.reader-grammar-legend .is-particle { background: #fff0c9; color: #785600; }

.reader-progress {
    position: sticky;
    top: 8px;
    z-index: 25;
    display: grid;
    grid-template-columns: 38px minmax(0, 1fr) 38px;
    align-items: center;
    gap: 10px;
    max-width: 570px;
    margin: 0 auto 14px;
    padding: 9px 12px;
    border: 1px solid #d8e4df;
    border-radius: 14px;
    background: rgba(255, 255, 255, .95);
    box-shadow: 0 7px 22px rgba(24, 58, 48, .12);
    backdrop-filter: blur(10px);
}

.reader-progress[hidden] {
    display: none;
}

.reader-progress button {
    width: 36px;
    height: 36px;
    border: 0;
    border-radius: 50%;
    color: #185f49;
    background: #e8f3ef;
    cursor: pointer;
}

.reader-progress button:disabled {
    opacity: .35;
}

.reader-progress > div {
    display: grid;
    gap: 6px;
    text-align: center;
}

.reader-progress > div > span {
    height: 4px;
    overflow: hidden;
    border-radius: 99px;
    background: #e3ebe8;
}

.reader-progress-fill,
#reader-progress-fill {
    display: block;
    width: 0;
    height: 100%;
    border-radius: inherit;
    background: #1b8a65;
    transition: width .2s ease;
}

#bible-content .verse-container,
#bible-content .hebrew-verse-body,
#bible-content .words-container {
    min-width: 0;
    max-width: 100%;
}

#bible-content .hebrew-verse-body {
    flex: 1 1 auto;
}

#bible-content .word-pair {
    position: relative;
}

#bible-content .hebrew-word {
    border-radius: 8px;
    transition: color .15s, background .15s, box-shadow .15s;
}

#bible-content .hebrew-word:hover,
#bible-content .hebrew-word:focus-visible {
    background: #ecf7f2;
    box-shadow: 0 0 0 4px #ecf7f2;
    color: #096847;
}

#bible-content.reader-mode-hebrew .translit-word,
#bible-content.reader-mode-hebrew .hebrew-verse-portuguese,
#bible-content.reader-mode-hebrew-translit .hebrew-verse-portuguese,
#bible-content.reader-mode-hebrew-portuguese .translit-word,
#bible-content.reader-mode-portuguese .words-container,
#bible-content.reader-mode-portuguese .hebrew-verse-play-btn {
    display: none !important;
}

#bible-content .reader-translation-hidden .hebrew-verse-portuguese {
    display: none !important;
}

#bible-content.learning-level-intermediario .translit-word {
    filter: blur(4px);
    cursor: help;
    transition: filter .2s;
}

#bible-content.learning-level-intermediario .word-pair:hover .translit-word,
#bible-content.learning-level-intermediario .word-pair:focus-within .translit-word {
    filter: none;
}

#bible-content.learning-level-avancado .translit-word {
    display: none;
}

#bible-content.learning-grammar-colors .word-pair[data-grammar="verb"] .hebrew-word { color: #a9322a; background: #fff0ef; }
#bible-content.learning-grammar-colors .word-pair[data-grammar="noun"] .hebrew-word { color: #245d9a; background: #edf5ff; }
#bible-content.learning-grammar-colors .word-pair[data-grammar="adjective"] .hebrew-word { color: #7044a1; background: #f5efff; }
#bible-content.learning-grammar-colors .word-pair[data-grammar="particle"] .hebrew-word { color: #7d5900; background: #fff8e2; }

.verse-reader-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin-top: 9px;
}

.verse-reader-actions button {
    border: 0;
    border-radius: 8px;
    padding: 6px 9px;
    background: #edf3f1;
    color: #466059;
    font-size: .78rem;
    cursor: pointer;
}

.verse-reader-actions button[data-focus-verse].is-active {
    background: #173e34;
    color: #fff;
}

#bible-content.reader-focus-mode .verse:not(.is-focus-current),
#bible-content.reader-focus-mode .reader-practice-break {
    display: none !important;
}

#bible-content.reader-focus-mode .verse.is-focus-current {
    padding: 16px;
    border: 1px solid #bcdacd;
    border-radius: 16px;
    background: #fff;
    box-shadow: 0 12px 35px rgba(23, 78, 61, .09);
}

.reader-practice-break {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 14px;
    margin: 12px 0;
    padding: 13px 15px;
    border: 1px dashed #9fc9b8;
    border-radius: 14px;
    background: #f2faf6;
}

.reader-practice-break > div {
    display: flex;
    align-items: center;
    gap: 11px;
}

.reader-practice-break span {
    display: grid;
}

.reader-practice-break small {
    color: #60726b;
}

.reader-practice-break button,
.chapter-practice-button {
    border: 0;
    border-radius: 10px;
    padding: 9px 13px;
    background: #176b50;
    color: #fff;
    cursor: pointer;
}

.chapter-vocabulary {
    margin: 18px 0;
    border: 1px solid #d9e5e0;
    border-radius: 18px;
    background: #fff;
    overflow: hidden;
}

.chapter-vocabulary[hidden],
.chapter-completion[hidden] {
    display: none;
}

.chapter-vocabulary-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 16px 18px 12px;
}

.chapter-vocabulary-heading span,
.reader-practice-kicker,
.chapter-completion small {
    color: #17704f;
    font-size: .73rem;
    font-weight: 800;
    text-transform: uppercase;
    letter-spacing: .08em;
}

.chapter-vocabulary-heading h2,
.chapter-completion h2 {
    margin: 3px 0 0;
    font-size: 1.25rem;
}

.chapter-vocabulary-heading button {
    border: 0;
    background: none;
    color: #176b50;
    cursor: pointer;
}

.chapter-vocabulary.is-collapsed .chapter-vocabulary-body {
    display: none;
}

.chapter-vocabulary-body {
    padding: 0 18px 18px;
}

.chapter-vocabulary-stats {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 13px;
}

.chapter-vocabulary-stats span {
    display: grid;
    padding: 10px;
    border-radius: 10px;
    background: #f3f7f5;
    color: #60716b;
    font-size: .75rem;
}

.chapter-vocabulary-stats strong {
    color: #213d34;
    font-size: 1.15rem;
}

.chapter-vocabulary-list {
    display: grid;
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 8px;
    margin-bottom: 13px;
}

.chapter-vocabulary-list button {
    display: grid;
    grid-template-columns: 1fr auto;
    text-align: left;
    gap: 1px 8px;
    min-width: 0;
    padding: 9px;
    border: 1px solid #e0e8e5;
    border-radius: 10px;
    background: #fff;
    cursor: pointer;
}

.chapter-vocabulary-list strong {
    grid-column: 1;
    font-size: 1.25rem;
}

.chapter-vocabulary-list span {
    grid-column: 1;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    color: #687871;
    font-size: .72rem;
}

.chapter-vocabulary-list small {
    grid-column: 2;
    grid-row: 1 / span 2;
    align-self: center;
    color: #16805b;
}

.chapter-completion {
    margin: 22px 0;
    padding: 20px;
    border-radius: 18px;
    background: linear-gradient(135deg, #ecf8f2, #f1f5ff);
    border: 1px solid #cfe2da;
}

.chapter-completion > div:first-child {
    display: flex;
    align-items: center;
    gap: 14px;
}

.chapter-completion > div:first-child > span {
    display: grid;
    place-items: center;
    width: 48px;
    height: 48px;
    flex: 0 0 48px;
    border-radius: 50%;
    background: #176b50;
    color: #fff;
}

.chapter-completion p {
    margin: 5px 0 0;
    color: #5c6b66;
}

.chapter-completion-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 8px;
    margin-top: 16px;
}

.chapter-completion-actions button {
    border: 1px solid #bdd1ca;
    border-radius: 10px;
    padding: 9px 12px;
    background: #fff;
    color: #284a3e;
    cursor: pointer;
}

.chapter-completion-actions button.is-primary {
    margin-left: auto;
    border-color: #176b50;
    background: #176b50;
    color: #fff;
}

.chapter-completion-actions button.is-saved {
    color: #176b50;
    border-color: #82b9a5;
}

.reader-practice-modal {
    position: fixed;
    inset: 0;
    z-index: 10000;
    display: grid;
    place-items: center;
    padding: 20px;
    background: rgba(8, 24, 19, .62);
}

.reader-practice-modal[hidden] {
    display: none;
}

.reader-practice-dialog {
    position: relative;
    width: min(520px, 100%);
    max-height: min(700px, 92vh);
    overflow: auto;
    padding: 26px;
    border-radius: 20px;
    background: #fff;
    box-shadow: 0 28px 80px rgba(0, 0, 0, .3);
}

.reader-practice-close {
    position: absolute;
    top: 12px;
    right: 12px;
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 50%;
    background: #edf2f0;
    cursor: pointer;
}

.reader-practice-word {
    margin: 20px 0;
    text-align: center;
    font-size: 3rem;
    color: #173d31;
}

.reader-practice-options {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 9px;
}

.reader-practice-options button,
.reader-practice-primary {
    min-height: 46px;
    border: 1px solid #cad9d4;
    border-radius: 11px;
    background: #fff;
    color: #29473e;
    cursor: pointer;
}

.reader-practice-options button.is-correct {
    border-color: #38a274;
    background: #def6e9;
}

.reader-practice-options button.is-wrong {
    border-color: #d45b55;
    background: #ffebe9;
}

.reader-practice-primary {
    padding: 10px 15px;
    border-color: #176b50;
    background: #176b50;
    color: #fff;
}

.reader-practice-feedback {
    min-height: 24px;
    color: #35534a;
    font-weight: 700;
}

.learning-word-guest {
    display: flex;
    align-items: center;
    gap: 10px;
    margin-top: 14px;
    padding: 12px;
    border-radius: 12px;
    background: #f0f7f4;
}

.learning-word-guest p {
    flex: 1;
    margin: 0;
    font-size: .83rem;
}

.learning-word-guest a {
    white-space: nowrap;
    color: #176b50;
    font-weight: 700;
}

@media (max-width: 700px) {
    html,
    body {
        max-width: 100%;
        overflow-x: hidden;
    }

    .bible-controls,
    .bible-controls .control-group {
        display: flex;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        flex-wrap: wrap;
        gap: 8px;
    }

    .bible-controls .control-group:first-child {
        display: grid;
        grid-template-columns: minmax(0, 1fr) minmax(86px, .45fr) auto;
    }

    .bible-controls select,
    .bible-controls button {
        min-width: 0;
        max-width: 100%;
    }

    .bible-ranking-heading {
        align-items: center;
    }

    .bible-ranking-heading-actions a {
        display: none;
    }

    .bible-ranking-heading-actions button span {
        display: none;
    }

    .reader-study-toolbar {
        padding: 13px;
    }

    .reader-study-controls {
        display: grid;
        grid-template-columns: 1fr 1fr;
        align-items: end;
    }

    .reader-study-controls label:not(.reader-check) {
        min-width: 0;
    }

    .reader-check,
    .reader-tool-button {
        width: 100%;
    }

    .reader-mode-switcher {
        flex-wrap: nowrap;
        max-width: 100%;
        overflow-x: auto;
        padding-bottom: 5px;
    }

    .reader-mode-switcher button {
        flex: 0 0 auto;
        white-space: nowrap;
    }

    .reader-progress {
        top: 4px;
        width: calc(100% - 8px);
    }

    #bible-content .verse-container {
        width: 100%;
    }

    #bible-content .word-pair {
        margin: 0 2px 9px !important;
    }

    #bible-content .words-container {
        gap: 1px;
    }

    .verse-reader-actions button {
        font-size: .72rem;
    }

    .reader-practice-break {
        align-items: flex-start;
        flex-direction: column;
    }

    .chapter-vocabulary-stats {
        grid-template-columns: 1fr 1fr;
    }

    .chapter-vocabulary-list {
        grid-template-columns: 1fr 1fr;
    }

    .chapter-completion-actions {
        display: grid;
        grid-template-columns: 1fr 1fr;
    }

    .chapter-completion-actions button.is-primary {
        margin-left: 0;
    }

    .reader-practice-dialog {
        padding: 22px 16px;
    }

    .reader-practice-options {
        grid-template-columns: 1fr;
    }

    .learning-word-guest {
        align-items: flex-start;
        flex-wrap: wrap;
    }
}