:root {
    --bg: #0b1220;
    --bg-soft: #101b2c;
    --panel: #142136;
    --panel-light: #192941;
    --panel-hover: #20334d;
    --gold: #d8b56d;
    --gold-light: #f0d69c;
    --mint: #79d9bd;
    --blue: #7ea9e8;
    --purple: #b39ae8;
    --text: #f3f5f8;
    --muted: #9ba9bc;
    --border: rgba(255,255,255,.08);
    --danger: #e58b8b;
    --success: #79d9bd;
    --sidebar-width: 255px;
    --radius: 18px;
    --shadow: 0 18px 50px rgba(0,0,0,.22);
}

/* =========================================================
   ECE PREMIUM - YENİ MODAL VE KAYDIRMA DÜZELTMELERİ
========================================================= */
.ece-lesson-modal {
    background: #142136;
    padding: 25px;
    border-radius: 18px;
    width: min(680px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    position: relative;
    border: 1px solid rgba(216,181,109,0.22);
    box-shadow: 0 25px 80px rgba(0,0,0,.45);
}

.ece-modal-close {
    position: absolute;
    top: 15px;
    right: 15px;
    background: transparent;
    border: 0;
    color: white;
    font-size: 28px;
    cursor: pointer;
}


* {
    box-sizing: border-box;
    margin: 0;
    padding: 0;
}

html {
    scroll-behavior: smooth;
}

body {
    min-height: 100vh;
    background:
        radial-gradient(circle at 80% 5%, rgba(216,181,109,.07), transparent 27%),
        radial-gradient(circle at 10% 80%, rgba(121,217,189,.04), transparent 25%),
        var(--bg);
    color: var(--text);
    font-family: "DM Sans", sans-serif;
    font-size: 14px;
}

button,
input,
select {
    font: inherit;
}

button {
    cursor: pointer;
}

button:focus-visible,
input:focus-visible,
select:focus-visible {
    outline: 2px solid var(--gold);
    outline-offset: 3px;
}

.app-shell {
    min-height: 100vh;
}

/* SIDEBAR */

.sidebar {
    position: fixed;
    inset: 0 auto 0 0;
    z-index: 100;
    width: var(--sidebar-width);
    display: flex;
    flex-direction: column;
    padding: 27px 18px 18px;
    background: rgba(12,21,35,.97);
    border-right: 1px solid var(--border);
    transition: transform .3s ease;
}

.brand {
    display: flex;
    align-items: center;
    gap: 12px;
    padding: 0 9px 32px;
}

.brand-icon {
    width: 43px;
    height: 43px;
    display: grid;
    place-items: center;
    border-radius: 13px;
    background: linear-gradient(145deg, var(--gold-light), #a77c38);
    color: #182131;
    font-family: "Playfair Display", serif;
    font-size: 25px;
    font-weight: 800;
    box-shadow: 0 7px 24px rgba(216,181,109,.2);
}

.brand-name {
    font-family: "Playfair Display", serif;
    font-size: 21px;
    font-weight: 800;
    letter-spacing: 2px;
}

.brand-subtitle {
    margin-top: 3px;
    color: var(--gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.7px;
}

.sidebar-label {
    padding: 0 12px;
    margin: 8px 0 12px;
    color: #64758c;
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1.8px;
}

.navigation {
    display: flex;
    flex-direction: column;
    gap: 6px;
}

.nav-button {
    width: 100%;
    display: flex;
    align-items: center;
    gap: 13px;
    padding: 12px 13px;
    border: 1px solid transparent;
    border-radius: 11px;
    background: transparent;
    color: #aab7c9;
    text-align: left;
    font-size: 12px;
    font-weight: 600;
    transition: .2s ease;
}

.nav-button:hover {
    background: rgba(255,255,255,.045);
    color: white;
}

.nav-button.active {
    border-color: rgba(216,181,109,.16);
    background: linear-gradient(90deg, rgba(216,181,109,.15), rgba(216,181,109,.035));
    color: var(--gold-light);
}

.nav-icon {
    width: 20px;
    text-align: center;
    font-size: 19px;
}

.sidebar-bottom {
    margin-top: auto;
}

.sidebar-profile {
    display: flex;
    align-items: center;
    gap: 11px;
    margin-top: 23px;
    padding: 14px 9px 5px;
    border-top: 1px solid var(--border);
}

.profile-avatar,
.topbar-avatar {
    display: grid;
    place-items: center;
    width: 37px;
    height: 37px;
    border-radius: 50%;
    background: linear-gradient(145deg, #e9c77f, #a77b39);
    color: #152033;
    font-family: "Playfair Display", serif;
    font-size: 18px;
    font-weight: 800;
}

.sidebar-profile strong {
    display: block;
    font-size: 12px;
    letter-spacing: 1px;
}

.sidebar-profile small {
    display: block;
    margin-top: 4px;
    color: var(--muted);
    font-size: 10px;
}

.profile-status {
    width: 8px;
    height: 8px;
    margin-left: auto;
    border-radius: 50%;
    background: var(--mint);
    box-shadow: 0 0 10px rgba(121,217,189,.6);
}

/* MAIN CONTENT */

.main-content {
    min-height: 100vh;
    margin-left: var(--sidebar-width);
    padding: 0 38px 45px;
}

.topbar {
    min-height: 76px;
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-bottom: 1px solid var(--border);
}

.breadcrumb {
    display: flex;
    align-items: center;
    gap: 10px;
    color: var(--muted);
    font-size: 11px;
}

.breadcrumb strong {
    color: var(--text);
    font-weight: 700;
}

.breadcrumb-separator {
    color: #53637a;
}

.topbar-right {
    display: flex;
    align-items: center;
    gap: 16px;
}

.level-badge {
    display: inline-flex;
    align-items: center;
    gap: 8px;
    padding: 8px 12px;
    border: 1px solid rgba(216,181,109,.2);
    border-radius: 30px;
    background: rgba(216,181,109,.07);
    color: var(--gold-light);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 1px;
}

.level-dot {
    width: 6px;
    height: 6px;
    border-radius: 50%;
    background: var(--mint);
}

.topbar-avatar {
    width: 34px;
    height: 34px;
    font-size: 15px;
}

.menu-toggle {
    display: none;
    border: 0;
    background: transparent;
    color: white;
    font-size: 22px;
}

/* PAGES */

.page {
    display: none;
    padding-top: 32px;
    animation: pageEnter .35s ease;
}

.page.active {
    display: block;
}

@keyframes pageEnter {
    from {
        opacity: 0;
        transform: translateY(8px);
    }
    to {
        opacity: 1;
        transform: translateY(0);
    }
}

.welcome-section {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 20px;
    margin-bottom: 24px;
}

.eyebrow {
    margin-bottom: 9px;
    color: var(--gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;
}

.welcome-section h1,
.page-heading h1 {
    font-family: "Playfair Display", serif;
    font-size: clamp(27px, 3vw, 36px);
    font-weight: 700;
    letter-spacing: -.7px;
}

.welcome-section h1 span {
    color: var(--gold-light);
}

.welcome-section p,
.page-heading p {
    margin-top: 8px;
    color: var(--muted);
    font-size: 12px;
}

.welcome-date {
    color: var(--muted);
    font-size: 11px;
    white-space: nowrap;
}

.page-heading {
    margin-bottom: 26px;
}

.page-heading h1 {
    font-size: 31px;
}

/* HERO */

.hero-card {
    position: relative;
    min-height: 255px;
    display: flex;
    align-items: center;
    overflow: hidden;
    margin-bottom: 22px;
    padding: 35px 40px;
    border: 1px solid rgba(216,181,109,.2);
    border-radius: 22px;
    background:
        linear-gradient(100deg, rgba(17,31,49,.98) 0%, rgba(20,39,57,.94) 58%, rgba(39,54,65,.78) 100%);
    box-shadow: var(--shadow);
}

.hero-content {
    position: relative;
    z-index: 2;
    max-width: 490px;
}

.hero-tag {
    margin-bottom: 15px;
    color: var(--gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;
}

.hero-card h2 {
    font-family: "Playfair Display", serif;
    font-size: clamp(28px, 3.5vw, 42px);
    line-height: 1.16;
}

.hero-card h2 span {
    color: var(--gold-light);
}

.hero-card p {
    max-width: 420px;
    margin: 13px 0 21px;
    color: #aab8c8;
    font-size: 12px;
    line-height: 1.8;
}

.primary-button {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    padding: 12px 19px;
    border: 0;
    border-radius: 9px;
    background: linear-gradient(135deg, #e8cb8d, #c49b54);
    color: #172235;
    font-size: 11px;
    font-weight: 800;
    box-shadow: 0 7px 20px rgba(216,181,109,.16);
    transition: transform .2s ease, box-shadow .2s ease;
}

.primary-button:hover {
    transform: translateY(-2px);
    box-shadow: 0 10px 25px rgba(216,181,109,.25);
}

.primary-button span {
    font-size: 17px;
}

.hero-decoration {
    position: absolute;
    inset: 0 0 0 auto;
    width: 43%;
    pointer-events: none;
}

.hero-circle {
    position: absolute;
    top: 50%;
    left: 50%;
    border: 1px solid rgba(216,181,109,.16);
    border-radius: 50%;
    transform: translate(-50%, -50%);
}

.circle-one {
    width: 220px;
    height: 220px;
}

.circle-two {
    width: 310px;
    height: 310px;
}

.hero-globe {
    position: absolute;
    top: 50%;
    left: 50%;
    font-size: 104px;
    opacity: .8;
    transform: translate(-50%, -50%);
    filter: drop-shadow(0 12px 22px rgba(0,0,0,.25));
}

.hero-plane {
    position: absolute;
    top: 22%;
    left: 23%;
    color: var(--gold-light);
    font-size: 28px;
    transform: rotate(-20deg);
}

/* STATS */

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

.stat-card {
    min-width: 0;
    padding: 18px;
    border: 1px solid var(--border);
    border-radius: 15px;
    background: linear-gradient(145deg, var(--panel), #111d30);
    transition: transform .2s ease, border-color .2s ease;
}

.stat-card:hover {
    transform: translateY(-3px);
    border-color: rgba(216,181,109,.2);
}

.stat-icon {
    width: 31px;
    height: 31px;
    display: grid;
    place-items: center;
    margin-bottom: 14px;
    border-radius: 9px;
    font-size: 17px;
}

.stat-icon.gold {
    background: rgba(216,181,109,.13);
    color: var(--gold);
}

.stat-icon.mint {
    background: rgba(121,217,189,.12);
    color: var(--mint);
}

.stat-icon.blue {
    background: rgba(126,169,232,.12);
    color: var(--blue);
}

.stat-icon.purple {
    background: rgba(179,154,232,.12);
    color: var(--purple);
}

.stat-label {
    color: #8999ad;
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.1px;
}

.stat-value {
    margin-top: 7px;
    font-family: "Playfair Display", serif;
    font-size: 30px;
    font-weight: 700;
}

.stat-description {
    margin-top: 4px;
    color: #77869a;
    font-size: 10px;
}

/* CONTENT CARDS */

.dashboard-grid {
    display: grid;
    grid-template-columns: 1.2fr 1fr;
    gap: 16px;
    margin-bottom: 22px;
}

.content-card {
    margin-bottom: 20px;
    padding: 22px;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: linear-gradient(145deg, rgba(21,34,54,.96), rgba(16,28,45,.96));
}

.section-heading {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    margin-bottom: 20px;
}

.section-heading .eyebrow {
    margin-bottom: 6px;
}

.section-heading h3,
.content-card h3 {
    font-family: "Playfair Display", serif;
    font-size: 18px;
}

.small-badge {
    padding: 6px 9px;
    border-radius: 20px;
    background: rgba(121,217,189,.09);
    color: var(--mint);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1px;
}

.goal-content {
    display: flex;
    align-items: center;
    gap: 22px;
}

.goal-ring {
    --progress: 0%;
    flex: 0 0 112px;
    width: 112px;
    height: 112px;
    display: grid;
    place-items: center;
    border-radius: 50%;
    background: conic-gradient(var(--gold) var(--progress), #2a3a50 0);
    transition: background .3s ease;
}

.goal-ring-inner {
    width: 91px;
    height: 91px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background: #142136;
}

.goal-ring-inner strong {
    font-family: "Playfair Display", serif;
    font-size: 24px;
}

.goal-ring-inner small {
    margin-top: 3px;
    color: var(--muted);
    font-size: 7px;
    font-weight: 800;
    letter-spacing: .8px;
}

.goal-info h4 {
    font-size: 13px;
}

.goal-info p {
    margin: 7px 0 12px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.7;
}

.text-button {
    border: 0;
    background: transparent;
    color: var(--gold-light);
    font-size: 10px;
    font-weight: 800;
}

.text-button:hover {
    color: white;
}

.quick-actions {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 9px;
}

.quick-actions button {
    min-width: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 7px;
    padding: 15px 7px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255,255,255,.025);
    color: var(--text);
    transition: .2s ease;
}

.quick-actions button:hover {
    border-color: rgba(216,181,109,.3);
    background: rgba(216,181,109,.07);
    transform: translateY(-2px);
}

.quick-actions button span {
    font-size: 22px;
}

.quick-actions button strong {
    font-size: 10px;
}

.quick-actions button small {
    color: var(--muted);
    font-size: 8px;
}

/* SCENARIO GRID */

.scenario-grid,
.destination-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 14px;
}

.scenario-item {
    padding: 15px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: rgba(255,255,255,.025);
    cursor: pointer;
    transition: .2s ease;
}

.scenario-item:hover {
    border-color: rgba(216,181,109,.3);
    background: rgba(216,181,109,.05);
    transform: translateY(-2px);
}

.scenario-item h4 {
    margin-bottom: 6px;
    font-size: 12px;
}

.scenario-item p {
    color: var(--muted);
    font-size: 10px;
    line-height: 1.5;
}

.scenario-progress {
    height: 4px;
    overflow: hidden;
    margin-top: 12px;
    border-radius: 5px;
    background: #29384b;
}

.scenario-progress span {
    display: block;
    height: 100%;
    border-radius: inherit;
    background: var(--mint);
}

/* DESTINATIONS */

.destination-card {
    overflow: hidden;
    border: 1px solid var(--border);
    border-radius: 16px;
    background: var(--panel);
    cursor: pointer;
    transition: transform .25s ease, border-color .25s ease;
}

.destination-card:hover {
    transform: translateY(-5px);
    border-color: rgba(216,181,109,.35);
}

.destination-image {
    position: relative;
    height: 145px;
    display: grid;
    place-items: center;
    overflow: hidden;
    background: linear-gradient(135deg, #20364e, #142136);
}

.destination-image::before,
.destination-image::after {
    position: absolute;
    content: "";
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 50%;
}

.destination-image::before {
    width: 180px;
    height: 180px;
}

.destination-image::after {
    width: 125px;
    height: 125px;
}

.destination-image > span {
    position: relative;
    z-index: 1;
    font-size: 51px;
    filter: drop-shadow(0 8px 12px rgba(0,0,0,.3));
}

.destination-image small {
    position: absolute;
    top: 13px;
    right: 14px;
    color: rgba(255,255,255,.5);
    font-size: 10px;
    font-weight: 800;
}

.hotel-image {
    background: linear-gradient(135deg, #38465c, #172b3c);
}

.restaurant-image {
    background: linear-gradient(135deg, #4a3b36, #202b3b);
}

.transport-image {
    background: linear-gradient(135deg, #314d59, #14283a);
}

.shopping-image {
    background: linear-gradient(135deg, #51435c, #1d2a42);
}

.emergency-image {
    background: linear-gradient(135deg, #583c45, #202b3b);
}

.destination-info {
    padding: 16px;
}

.destination-category {
    color: var(--gold);
    font-size: 8px;
    font-weight: 800;
    letter-spacing: 1.3px;
}

.destination-info h3 {
    margin: 7px 0 5px;
    font-family: "Playfair Display", serif;
    font-size: 19px;
}

.destination-info p {
    min-height: 31px;
    color: var(--muted);
    font-size: 10px;
    line-height: 1.6;
}

.destination-footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: 13px;
    padding-top: 11px;
    border-top: 1px solid var(--border);
    color: var(--gold-light);
    font-size: 10px;
    font-weight: 700;
}

/* SEARCH & VOCABULARY */

.search-box {
    display: flex;
    align-items: center;
    gap: 12px;
    margin-bottom: 20px;
    padding: 13px 15px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(0,0,0,.12);
    color: var(--gold);
}

.search-box span {
    font-size: 21px;
}

.search-box input {
    width: 100%;
    border: 0;
    outline: 0;
    background: transparent;
    color: var(--text);
    font-size: 12px;
}

.search-box input::placeholder {
    color: #718198;
}

.vocabulary-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
}

.vocabulary-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    padding: 14px;
    border: 1px solid var(--border);
    border-radius: 11px;
    background: rgba(255,255,255,.025);
}

.vocabulary-item strong {
    display: block;
    font-size: 12px;
}

.vocabulary-item small {
    display: block;
    margin-top: 5px;
    color: var(--muted);
    font-size: 10px;
}

.vocabulary-item button {
    width: 32px;
    height: 32px;
    flex: 0 0 32px;
    border: 1px solid rgba(216,181,109,.2);
    border-radius: 50%;
    background: rgba(216,181,109,.08);
    color: var(--gold-light);
}

/* SPEAKING */

.practice-card,
.listening-card {
    max-width: 760px;
    margin: 0 auto;
    padding: 35px;
    border: 1px solid rgba(216,181,109,.18);
    border-radius: 20px;
    background: linear-gradient(145deg, #182a40, #111e31);
    text-align: center;
    box-shadow: var(--shadow);
}

.practice-label {
    color: var(--gold);
    font-size: 9px;
    font-weight: 800;
    letter-spacing: 2px;
}

.practice-counter {
    margin-top: 10px;
    color: var(--muted);
    font-size: 10px;
}

.practice-quote {
    height: 54px;
    margin-top: 24px;
    color: var(--gold);
    font-family: "Playfair Display", serif;
    font-size: 80px;
    line-height: 1;
}

.practice-card h2 {
    margin-top: 12px;
    font-family: "Playfair Display", serif;
    font-size: clamp(23px, 4vw, 35px);
}

.practice-card > p {
    margin-top: 12px;
    color: var(--muted);
    font-size: 13px;
}

.practice-controls {
    display: flex;
    align-items: center;
    justify-content: center;
    gap: 14px;
    margin-top: 28px;
}

.round-button {
    width: 45px;
    height: 45px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: rgba(255,255,255,.05);
    color: var(--text);
    font-size: 17px;
}

.microphone-button {
    min-width: 135px;
    padding: 13px 20px;
    border: 0;
    border-radius: 30px;
    background: linear-gradient(135deg, var(--gold-light), #bd914c);
    color: #172235;
    font-size: 11px;
    font-weight: 800;
}

.speech-result {
    margin-top: 23px;
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 10px;
    color: var(--muted);
    font-size: 11px;
    line-height: 1.6;
}

/* LISTENING */

.listening-icon {
    margin: 22px 0 12px;
    font-size: 48px;
}

.listening-card h2 {
    font-family: "Playfair Display", serif;
    font-size: 26px;
}

.listening-card > p {
    margin-top: 8px;
    color: var(--muted);
    font-size: 11px;
}

.listen-button {
    margin: 22px 0;
    padding: 12px 20px;
    border: 1px solid rgba(121,217,189,.25);
    border-radius: 30px;
    background: rgba(121,217,189,.08);
    color: var(--mint);
    font-size: 11px;
    font-weight: 800;
}

.listening-question {
    margin: 8px 0 18px;
    padding: 15px;
    border-radius: 10px;
    background: rgba(255,255,255,.035);
    font-family: "Playfair Display", serif;
    font-size: 18px;
}

.answer-options {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-bottom: 17px;
}

.answer-option {
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255,255,255,.035);
    color: var(--text);
    font-size: 11px;
    transition: .2s ease;
}

.answer-option:hover {
    border-color: var(--gold);
}

.answer-option.correct {
    border-color: var(--mint);
    background: rgba(121,217,189,.1);
}

.answer-option.incorrect {
    border-color: var(--danger);
    background: rgba(229,139,139,.1);
}

.listening-feedback {
    min-height: 25px;
    margin-bottom: 12px;
    color: var(--mint);
    font-size: 11px;
}

/* PROGRESS & SETTINGS */

.completed-list {
    display: grid;
    gap: 9px;
}

.completed-item,
.review-item {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    padding: 13px;
    border: 1px solid var(--border);
    border-radius: 10px;
    background: rgba(255,255,255,.025);
    font-size: 11px;
}

.completed-item span:last-child {
    color: var(--mint);
}

.review-actions {
    display: flex;
    flex-wrap: wrap;
    gap: 10px;
    margin-bottom: 15px;
}

.secondary-button {
    padding: 10px 14px;
    border: 1px solid rgba(216,181,109,.22);
    border-radius: 9px;
    background: rgba(216,181,109,.07);
    color: var(--gold-light);
    font-size: 10px;
    font-weight: 700;
}

.secondary-button:hover {
    background: rgba(216,181,109,.14);
}

.review-item {
    margin-top: 8px;
}

.review-item button {
    padding: 7px 10px;
    border: 1px solid var(--border);
    border-radius: 7px;
    background: rgba(121,217,189,.08);
    color: var(--mint);
    font-size: 9px;
}

.settings-card h3 {
    margin-bottom: 10px;
}

.setting-row {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 15px;
    padding: 17px 0;
    border-bottom: 1px solid var(--border);
}

.setting-row:last-child {
    border-bottom: 0;
}

.setting-row strong {
    font-size: 12px;
}

.setting-row p {
    margin-top: 5px;
    color: var(--muted);
    font-size: 10px;
}

.setting-button,
.setting-select {
    padding: 9px 13px;
    border: 1px solid rgba(216,181,109,.2);
    border-radius: 8px;
    background: rgba(216,181,109,.07);
    color: var(--gold-light);
    font-size: 10px;
}

.setting-select option {
    background: var(--panel);
    color: white;
}

/* MODAL */

.modal {
    position: fixed;
    inset: 0;
    z-index: 300;
    display: none;
    align-items: center;
    justify-content: center;
    overflow-y: auto;
    padding: 22px;
    background: rgba(2,8,16,.78);
    backdrop-filter: blur(9px);
}

.modal.show {
    display: flex;
}

.modal-panel {
    width: min(680px, 100%);
    max-height: 90vh;
    overflow-y: auto;
    border: 1px solid rgba(216,181,109,.22);
    border-radius: 18px;
    background: #142136;
    box-shadow: 0 25px 80px rgba(0,0,0,.45);
    animation: modalEnter .25s ease;
}

@keyframes modalEnter {
    from {
        opacity: 0;
        transform: translateY(12px) scale(.98);
    }
    to {
        opacity: 1;
        transform: translateY(0) scale(1);
    }
}

.modal-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 20px 23px;
    border-bottom: 1px solid var(--border);
}

.modal-header .eyebrow {
    margin-bottom: 5px;
}

.modal-header h2 {
    font-family: "Playfair Display", serif;
    font-size: 21px;
}

.modal-close {
    width: 34px;
    height: 34px;
    border: 1px solid var(--border);
    border-radius: 50%;
    background: rgba(255,255,255,.04);
    color: white;
    font-size: 21px;
}

.modal-body {
    padding: 22px;
}

.modal-body h3 {
    margin: 16px 0 9px;
    font-family: "Playfair Display", serif;
}

.modal-body p {
    color: var(--muted);
    font-size: 12px;
    line-height: 1.7;
}

.modal-body button {
    margin: 7px 5px 0 0;
}

/* TOAST */

.toast {
    position: fixed;
    right: 25px;
    bottom: 25px;
    z-index: 500;
    max-width: min(360px, calc(100vw - 40px));
    padding: 13px 17px;
    border: 1px solid rgba(121,217,189,.25);
    border-radius: 10px;
    background: #1a3540;
    color: #d7fff0;
    font-size: 11px;
    box-shadow: var(--shadow);
    opacity: 0;
    pointer-events: none;
    transform: translateY(10px);
    transition: .25s ease;
}

.toast.show {
    opacity: 1;
    transform: translateY(0);
}

/* EMPTY STATES */

.empty-state {
    padding: 25px;
    color: var(--muted);
    text-align: center;
    font-size: 11px;
    line-height: 1.7;
}

/* RESPONSIVE */

@media (max-width: 1100px) {
    :root {
        --sidebar-width: 220px;
    }

    .main-content {
        padding-right: 25px;
        padding-left: 25px;
    }

    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }

    .scenario-grid,
    .destination-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 760px) {
    :root {
        --sidebar-width: 255px;
    }

    .sidebar {
        transform: translateX(-100%);
    }

    .sidebar.open {
        transform: translateX(0);
    }

    .main-content {
        margin-left: 0;
        padding: 0 17px 30px;
    }

    .topbar {
        min-height: 65px;
        gap: 12px;
    }

    .menu-toggle {
        display: block;
    }

    .breadcrumb {
        flex: 1;
        font-size: 10px;
    }

    .topbar-right {
        gap: 8px;
    }

    .topbar-right .level-badge {
        padding: 7px 9px;
        font-size: 8px;
    }

    .welcome-section {
        align-items: flex-start;
        flex-direction: column;
    }

    .hero-card {
        min-height: 260px;
        padding: 25px;
    }

    .hero-decoration {
        width: 42%;
        opacity: .55;
    }

    .hero-globe {
        font-size: 70px;
    }

    .dashboard-grid {
        grid-template-columns: 1fr;
    }

    .goal-content {
        flex-wrap: wrap;
    }

    .page {
        padding-top: 24px;
    }
}

@media (max-width: 480px) {
    .main-content {
        padding-right: 12px;
        padding-left: 12px;
    }

    .stats-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 9px;
    }

    .stat-card {
        padding: 13px;
    }

    .stat-value {
        font-size: 25px;
    }

    .scenario-grid,
    .destination-grid,
    .vocabulary-list {
        grid-template-columns: 1fr;
    }

    .destination-image {
        height: 125px;
    }

    .practice-card,
    .listening-card {
        padding: 24px 15px;
    }

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

    .hero-decoration {
        opacity: .25;
    }

    .hero-content {
        max-width: 100%;
    }

    .setting-row {
        align-items: flex-start;
        flex-direction: column;
    }

    .welcome-section h1 {
        font-size: 29px;
    }

    .content-card {
        padding: 16px;
    }
}

/* GODDO stability and quiz feedback */
.answer-options button { cursor: pointer; }
.answer-options button:disabled { cursor: default; opacity: .92; }
.answer-options button.correct { border-color: var(--mint, #79d9bd); color: var(--mint, #79d9bd); }
.answer-options button.incorrect { border-color: var(--danger, #e58b8b); color: var(--danger, #e58b8b); }
.scenario-item[role="button"] { cursor: pointer; }


/* =========================================================
   GODDO LEVEL-UP — missions, streaks, spaced repetition
========================================================= */
.upgrade-dashboard-grid{display:grid;grid-template-columns:1.1fr .9fr;gap:22px;margin-top:22px}
.upgrade-card{min-width:0}
.upgrade-chip{display:inline-flex;align-items:center;padding:7px 11px;border-radius:999px;background:rgba(216,181,109,.12);border:1px solid rgba(216,181,109,.22);color:var(--gold-light);font-size:11px;font-weight:800;letter-spacing:.04em;white-space:nowrap}
.mission-list{display:grid;gap:11px;margin:18px 0}
.mission-item{display:flex;align-items:center;gap:13px;padding:14px 15px;border:1px solid var(--border);border-radius:14px;background:rgba(255,255,255,.025);transition:.2s}
.mission-item.done{border-color:rgba(121,217,189,.28);background:rgba(121,217,189,.07)}
.mission-check{width:34px;height:34px;flex:0 0 34px;border-radius:11px;display:grid;place-items:center;background:rgba(255,255,255,.06);color:var(--muted);font-weight:900}
.mission-item.done .mission-check{background:rgba(121,217,189,.16);color:var(--mint)}
.mission-copy{min-width:0;flex:1}.mission-copy strong{display:block;color:var(--text);font-size:13px}.mission-copy small{display:block;color:var(--muted);margin-top:4px;font-size:11px}
.mission-reward{color:var(--gold-light);font-size:11px;font-weight:800;white-space:nowrap}
.mission-list-large{gap:14px}.mission-list-large .mission-item{padding:18px}.mission-list-large .mission-copy strong{font-size:15px}
.weekly-activity{height:132px;display:grid;grid-template-columns:repeat(7,1fr);gap:10px;align-items:end;margin:22px 0 12px}
.week-day{display:flex;flex-direction:column;align-items:center;justify-content:end;gap:9px;height:100%}.week-bar-wrap{height:92px;width:100%;display:flex;align-items:end;justify-content:center}.week-bar{width:min(28px,70%);min-height:5px;border-radius:8px 8px 4px 4px;background:linear-gradient(180deg,var(--gold-light),var(--gold));opacity:.28;transition:height .3s}.week-bar.active{opacity:1;box-shadow:0 5px 18px rgba(216,181,109,.18)}.week-day small{color:var(--muted);font-size:10px}.upgrade-footnote{color:var(--muted);font-size:11px}
.challenge-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;padding:30px 34px;margin-bottom:22px;border:1px solid rgba(216,181,109,.2);border-radius:22px;background:radial-gradient(circle at 82% 30%,rgba(216,181,109,.16),transparent 34%),linear-gradient(120deg,#17283e,#111d30);box-shadow:var(--shadow)}
.challenge-kicker{color:var(--gold);font-size:10px;font-weight:800;letter-spacing:.18em}.challenge-hero h2{font-family:'Playfair Display',serif;font-size:clamp(25px,4vw,38px);line-height:1.15;margin:10px 0}.challenge-hero h2 em{font-style:normal;color:var(--gold-light)}.challenge-hero p{color:var(--muted);font-size:12px}.challenge-score{width:112px;height:112px;flex:0 0 112px;border-radius:50%;display:flex;flex-direction:column;align-items:center;justify-content:center;border:7px solid rgba(216,181,109,.24);box-shadow:inset 0 0 0 1px rgba(216,181,109,.15)}.challenge-score strong{font-size:27px;color:var(--gold-light)}.challenge-score span{font-size:8px;letter-spacing:.1em;color:var(--muted);font-weight:800}
.level-panel{padding:20px;border:1px solid var(--border);border-radius:16px;background:rgba(255,255,255,.025)}.level-panel-head{display:flex;justify-content:space-between;gap:12px;align-items:center;margin-bottom:14px}.level-panel-head strong{color:var(--gold-light);font-size:18px}.level-panel-head span{font-size:11px;color:var(--muted)}.level-track{height:10px;border-radius:20px;background:rgba(255,255,255,.08);overflow:hidden}.level-track span{display:block;height:100%;border-radius:20px;background:linear-gradient(90deg,var(--gold),var(--mint));transition:width .3s}.level-caption{display:flex;justify-content:space-between;margin-top:9px;color:var(--muted);font-size:11px}
.review-overview{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;margin-bottom:22px}.review-metric{padding:22px;border-radius:16px;border:1px solid var(--border);background:var(--panel);display:flex;flex-direction:column;gap:6px}.review-metric strong{font-size:28px;color:var(--gold-light)}.review-metric span{font-size:12px;color:var(--muted)}.smart-review-list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:13px}.smart-word-card{padding:18px;border:1px solid var(--border);border-radius:15px;background:rgba(255,255,255,.025);display:flex;flex-direction:column;gap:13px}.smart-word-top{display:flex;justify-content:space-between;gap:12px;align-items:flex-start}.smart-word-top strong{font-size:18px;color:var(--text)}.smart-word-top small{display:block;color:var(--muted);margin-top:5px}.smart-word-actions{display:flex;gap:8px}.smart-word-actions button{flex:1;border-radius:10px;padding:10px 8px;font-size:11px;font-weight:800;cursor:pointer;border:1px solid var(--border);background:rgba(255,255,255,.04);color:var(--text)}.smart-word-actions .remember-btn{background:rgba(121,217,189,.1);border-color:rgba(121,217,189,.25);color:var(--mint)}.smart-word-actions .hard-btn{color:var(--gold-light)}.empty-review{padding:28px;text-align:center;color:var(--muted);border:1px dashed var(--border);border-radius:14px;grid-column:1/-1}
.backup-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap}.file-pick{display:inline-flex;align-items:center;cursor:pointer}
@media(max-width:900px){.upgrade-dashboard-grid{grid-template-columns:1fr}.smart-review-list{grid-template-columns:1fr}}
@media(max-width:560px){.challenge-hero{padding:23px 20px}.challenge-score{width:88px;height:88px;flex-basis:88px;border-width:5px}.challenge-score strong{font-size:22px}.review-overview{gap:8px}.review-metric{padding:15px 11px}.review-metric strong{font-size:23px}.review-metric span{font-size:10px}.mission-item{padding:12px}.mission-reward{font-size:10px}}


/* Restored full lesson content */
.lesson-intro{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px;padding:14px 16px;border:1px solid rgba(213,177,111,.18);border-radius:14px;background:rgba(213,177,111,.06)}
.lesson-intro p{margin:0;color:var(--muted,#aab3c2)}
.lesson-step-label{font-size:11px;letter-spacing:1.2px;color:var(--gold,#d9b477);font-weight:800}
.lesson-section-note{margin:-6px 0 14px;color:var(--muted,#aab3c2);font-size:13px}
.lesson-dialogue{display:grid;gap:9px;margin:12px 0 20px}
.dialogue-line{display:grid;grid-template-columns:88px minmax(0,1fr) 38px;align-items:center;gap:12px;padding:13px 14px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.025)}
.dialogue-speaker{font-size:11px;font-weight:800;letter-spacing:.5px;color:var(--gold,#d9b477);text-transform:uppercase}
.dialogue-copy{display:grid;gap:5px;min-width:0}
.dialogue-copy strong{font-size:14px;color:var(--text,#f2f4f8);line-height:1.45}
.dialogue-copy small{font-size:12px;color:var(--muted,#aab3c2);line-height:1.4}
.dialogue-line button{border:1px solid rgba(213,177,111,.25);border-radius:10px;background:rgba(213,177,111,.08);color:var(--gold,#d9b477);height:36px;cursor:pointer}
@media(max-width:520px){.dialogue-line{grid-template-columns:1fr 38px;gap:7px}.dialogue-speaker{grid-column:1/-1}.dialogue-copy strong{font-size:13px}}


/* Restored full lesson content */
.lesson-intro{display:flex;justify-content:space-between;align-items:center;gap:12px;flex-wrap:wrap;margin:0 0 18px;padding:14px 16px;border:1px solid rgba(213,177,111,.18);border-radius:14px;background:rgba(213,177,111,.06)}
.lesson-intro p{margin:0;color:var(--muted,#aab3c2)}
.lesson-step-label{font-size:11px;letter-spacing:1.2px;color:var(--gold,#d9b477);font-weight:800}
.lesson-section-note{margin:-6px 0 14px;color:var(--muted,#aab3c2);font-size:13px}
.lesson-dialogue{display:grid;gap:9px;margin:12px 0 20px}
.dialogue-line{display:grid;grid-template-columns:88px minmax(0,1fr) 38px;align-items:center;gap:12px;padding:13px 14px;border:1px solid rgba(255,255,255,.07);border-radius:12px;background:rgba(255,255,255,.025)}
.dialogue-speaker{font-size:11px;font-weight:800;letter-spacing:.5px;color:var(--gold,#d9b477);text-transform:uppercase}
.dialogue-copy{display:grid;gap:5px;min-width:0}
.dialogue-copy strong{font-size:14px;color:var(--text,#f2f4f8);line-height:1.45}
.dialogue-copy small{font-size:12px;color:var(--muted,#aab3c2);line-height:1.4}
.dialogue-line button{border:1px solid rgba(213,177,111,.25);border-radius:10px;background:rgba(213,177,111,.08);color:var(--gold,#d9b477);height:36px;cursor:pointer}
@media(max-width:520px){.dialogue-line{grid-template-columns:1fr 38px;gap:7px}.dialogue-speaker{grid-column:1/-1}.dialogue-copy strong{font-size:13px}}


/* GODDO A1 expansion and visual question practice */
.a1-level-tag{display:inline-block!important;margin-top:5px;padding:3px 7px;border-radius:5px;background:rgba(216,181,109,.1);color:var(--gold-light)!important;font-size:9px!important;font-weight:800;letter-spacing:.06em}
.a1-vocab-footer{display:flex;justify-content:space-between;align-items:center;gap:14px;flex-wrap:wrap;padding:18px 4px 2px;color:var(--muted);font-size:12px}
.a1-review-panel{margin-top:20px}.a1-review-top{display:flex;justify-content:space-between;color:var(--gold-light);font-size:11px;font-weight:800;letter-spacing:.1em}.a1-review-prompt{font-size:clamp(20px,3vw,28px);font-weight:800;text-align:center;padding:28px 10px 22px;color:var(--text)}.a1-review-options{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}.a1-review-options button,.visual-answer{border:1px solid var(--border);border-radius:12px;background:rgba(255,255,255,.035);color:var(--text);padding:14px;text-align:left;font-weight:700;cursor:pointer;transition:.2s}.a1-review-options button:hover,.visual-answer:hover{border-color:var(--gold);background:rgba(216,181,109,.08)}.a1-review-options button:disabled{cursor:default;opacity:.75}.a1-review-options button.right,.visual-answer.right{border-color:var(--mint);background:rgba(121,217,189,.12);color:var(--mint)}.a1-review-feedback{min-height:24px;margin-top:16px;text-align:center;color:var(--muted);font-weight:700}.a1-review-feedback.good{color:var(--mint)}.a1-review-feedback.bad{color:#f0a18d}.a1-review-result{text-align:center;padding:30px 10px}.a1-result-icon{font-size:48px}.a1-review-result h2{color:var(--gold-light)}
.visual-practice-card{max-width:760px;margin:0 auto 22px;padding:24px;border:1px solid rgba(216,181,109,.22);border-radius:22px;background:linear-gradient(145deg,#17263a,#101b2c);box-shadow:var(--shadow);text-align:center}.visual-progress{display:flex;justify-content:space-between;color:var(--gold-light);font-size:11px;font-weight:800;letter-spacing:.08em}.visual-art{height:230px;margin:22px auto 20px;border-radius:18px;display:flex;align-items:center;justify-content:center;background:radial-gradient(circle at 50% 45%,rgba(255,255,255,.12),rgba(255,255,255,.025) 62%),linear-gradient(135deg,#263d54,#1a2b40);border:1px solid rgba(255,255,255,.09);overflow:hidden}.visual-art span{font-size:clamp(100px,18vw,150px);filter:drop-shadow(0 12px 12px rgba(0,0,0,.28));line-height:1}.visual-question-label{font-size:10px;letter-spacing:.2em;color:var(--gold);font-weight:900}.visual-practice-card h2{font-size:clamp(24px,4vw,34px);margin:8px 0;color:var(--text)}.visual-practice-card>p{color:var(--muted);margin:0 0 18px}.visual-answers{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin:18px 0}.visual-answer{text-align:center;min-height:64px}.visual-answer:disabled{cursor:default}.visual-answer.wrong{border-color:#e18c78;background:rgba(225,140,120,.1);color:#f0a18d}.visual-speech-row{display:flex;justify-content:center;gap:10px;flex-wrap:wrap;margin:16px 0}.visual-feedback{min-height:25px;color:var(--mint);font-size:13px;font-weight:700;margin:12px 0}.visual-tip{max-width:760px;margin:0 auto;color:var(--muted);font-size:13px}.visual-tip strong{color:var(--gold-light)}
@media(max-width:620px){.a1-review-options{grid-template-columns:1fr}.visual-practice-card{padding:17px}.visual-art{height:185px}.visual-answers{grid-template-columns:1fr}.a1-vocab-footer{align-items:flex-start}.visual-progress{font-size:10px}}


/* GODDO AI conversation partner */
.ai-layout{display:grid;grid-template-columns:285px minmax(0,1fr);gap:20px;align-items:stretch}.ai-side{align-self:start;padding:24px}.ai-avatar{width:66px;height:66px;border-radius:20px;background:linear-gradient(135deg,#d6b56e,#92713b);display:grid;place-items:center;color:#17212b;font-size:34px;font-weight:900;margin:0 auto 12px;box-shadow:0 8px 24px #0002}.ai-avatar.small{width:44px;height:44px;border-radius:14px;font-size:23px;margin:0 auto}.ai-side h3,.ai-side>.ai-muted{text-align:center}.ai-muted,.ai-privacy,.ai-hint{color:var(--muted,#87919d);font-size:12px;line-height:1.55}.ai-side label{display:block;margin:18px 0 7px;font-size:12px;font-weight:800;color:var(--muted,#87919d)}.ai-side select{width:100%;padding:11px;border-radius:10px;border:1px solid var(--border,#34404b);background:var(--panel,#17212b);color:inherit}.ai-side-actions{display:grid;gap:10px;margin-top:20px}.ai-chat{padding:0;min-height:680px;display:flex;flex-direction:column;overflow:hidden}.ai-chat-head{padding:18px 22px;border-bottom:1px solid var(--border,#34404b);display:flex;justify-content:space-between;align-items:center}.ai-chat-head strong,.ai-chat-head small{display:block}.ai-chat-head small{font-size:12px;color:var(--muted,#87919d);margin-top:4px}.ai-live-dot{width:10px;height:10px;border-radius:50%;background:#46c99a;box-shadow:0 0 0 5px #46c99a22}.ai-messages{padding:22px;display:flex;flex-direction:column;gap:14px;flex:1;min-height:420px;max-height:600px;overflow:auto}.ai-welcome{text-align:center;margin:auto;max-width:440px}.ai-welcome h2{font-size:22px;margin:16px 0 8px}.ai-welcome p{color:var(--muted,#87919d)}.ai-welcome small{color:var(--muted,#87919d)}.ai-message{max-width:min(82%,650px);padding:13px 16px;border-radius:16px;line-height:1.55;white-space:pre-wrap;overflow-wrap:anywhere}.ai-message.user{align-self:flex-end;background:#c9a75f;color:#17212b;border-bottom-right-radius:5px}.ai-message.assistant{align-self:flex-start;background:var(--panel-soft,#202d38);border:1px solid var(--border,#34404b);border-bottom-left-radius:5px}.ai-message .ai-role{display:block;font-size:10px;font-weight:900;letter-spacing:.08em;opacity:.65;margin-bottom:5px}.ai-message .ai-correction{display:block;margin-top:9px;padding-top:8px;border-top:1px solid #87919d55;font-size:12px}.ai-typing{padding:0 22px 10px;color:var(--muted,#87919d);font-size:12px}.ai-compose{padding:16px 18px;border-top:1px solid var(--border,#34404b)}.ai-compose textarea{width:100%;resize:vertical;min-height:58px;border:1px solid var(--border,#34404b);border-radius:12px;padding:13px;background:var(--panel,#17212b);color:inherit;font:inherit;outline:none}.ai-compose-actions{display:flex;gap:10px;justify-content:flex-end;flex-wrap:wrap;margin-top:10px}.ai-hint{padding:0 18px 15px}.ai-compose button:disabled{opacity:.5;cursor:not-allowed}@media(max-width:900px){.ai-layout{grid-template-columns:1fr}.ai-side{order:2}.ai-chat{order:1;min-height:620px}.ai-messages{max-height:500px}}@media(max-width:560px){.ai-message{max-width:94%}.ai-compose-actions>*{flex:1}.ai-chat{min-height:600px}}


/* GODDO MOBILE / PWA LAYOUT */
.mobile-bottom-nav{display:none}
@media(max-width:760px){
  body{min-height:100dvh;overflow-x:hidden;padding-bottom:calc(76px + env(safe-area-inset-bottom))}
  .app-shell{min-height:100dvh}
  .sidebar{z-index:300;padding-bottom:env(safe-area-inset-bottom);box-shadow:18px 0 55px #0008}
  .main-content{padding-bottom:calc(28px + env(safe-area-inset-bottom));min-width:0}
  .mobile-bottom-nav{position:fixed;z-index:250;left:0;right:0;bottom:0;display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:2px;padding:7px 8px calc(7px + env(safe-area-inset-bottom));background:rgba(12,20,33,.96);border-top:1px solid rgba(216,181,109,.2);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}
  .mobile-nav-button{min-width:0;min-height:53px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:3px;border:0;border-radius:12px;background:transparent;color:#9ba9bc;padding:5px 2px}
  .mobile-nav-button span{font-size:20px;line-height:1.1}
  .mobile-nav-button small{font-size:9px;font-weight:700;white-space:nowrap}
  .mobile-nav-button.active{color:var(--gold-light);background:rgba(216,181,109,.10)}
  .mobile-nav-button.active span{filter:drop-shadow(0 0 7px rgba(216,181,109,.35))}
  .topbar{position:sticky;top:0;z-index:80;background:rgba(11,18,32,.92);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px);margin:0 -17px;padding:0 17px}
  .page{min-width:0;overflow-wrap:anywhere}
  .ai-layout{grid-template-columns:minmax(0,1fr)!important;gap:12px}
  .ai-chat{min-height:calc(100dvh - 230px)!important;min-height:520px!important}
  .ai-messages{min-height:260px;max-height:calc(100dvh - 390px);padding:14px}
  .ai-compose{padding:12px}
  .ai-compose textarea{font-size:16px;min-height:54px;resize:none}
  .ai-side{padding:17px}
  .modal{width:calc(100vw - 20px);max-height:calc(100dvh - 30px);overflow:auto}
  input,select,textarea{font-size:16px!important}
}
@media(max-width:420px){
  .main-content{padding-left:10px;padding-right:10px}
  .topbar{margin-left:-10px;margin-right:-10px;padding-left:10px;padding-right:10px}
  .breadcrumb{font-size:9px}
  .topbar-right .level-badge{font-size:7px;padding:6px}
  .topbar-avatar{width:30px;height:30px}
  .hero-card{padding:20px 17px;min-height:230px}
  .welcome-section h1{font-size:26px}
  .mobile-nav-button small{font-size:8px}
}
@media(hover:none) and (pointer:coarse){button,.nav-button,.scenario-item{touch-action:manipulation}button{ -webkit-tap-highlight-color:transparent }}

/* GODDO gerçek fotoğraf kartları */
.goddo-photo-word{display:flex!important;align-items:center;gap:14px;min-height:94px}
.goddo-word-photo{width:104px;height:82px;object-fit:cover;flex-shrink:0;border-radius:12px;box-shadow:0 3px 12px #0002}
.goddo-photo-word>div:nth-child(2){flex:1;min-width:0}
.goddo-visual-photo{display:block;width:100%;height:100%;max-height:330px;object-fit:cover;border-radius:18px}
.airport-image{background-image:url('https://images.unsplash.com/photo-1436491865332-7a61a109cc05?auto=format&fit=crop&w=900&q=80')!important}
.hotel-image{background-image:url('https://images.unsplash.com/photo-1566073771259-6a8506099945?auto=format&fit=crop&w=900&q=80')!important}
.restaurant-image{background-image:url('https://images.unsplash.com/photo-1517248135467-4c7edcad34c4?auto=format&fit=crop&w=900&q=80')!important}
.transport-image{background-image:url('https://images.unsplash.com/photo-1570125909232-eb263c188f7e?auto=format&fit=crop&w=900&q=80')!important}
.shopping-image{background-image:url('https://images.unsplash.com/photo-1441986300917-64674bd600d8?auto=format&fit=crop&w=900&q=80')!important}
.emergency-image{background-image:url('https://images.unsplash.com/photo-1538108149393-fbbd81895907?auto=format&fit=crop&w=900&q=80')!important}
.destination-image{background-size:cover!important;background-position:center!important}
@media(max-width:480px){.goddo-word-photo{width:80px;height:72px}.goddo-photo-word{gap:9px}}

/* Photo learning mode */
.goddo-study-toolbar{display:flex;align-items:center;gap:14px;flex-wrap:wrap;margin:14px 0 20px}.goddo-study-toolbar span{opacity:.8;font-size:13px}.goddo-study-overlay{position:fixed;inset:0;z-index:99999;background:rgba(5,14,22,.92);display:flex;justify-content:center;align-items:center;padding:16px;overflow:auto}.goddo-study-card{width:min(100%,520px);background:#17272d;color:#f5f7f8;border:1px solid #b69c66;border-radius:20px;padding:20px;text-align:center;box-shadow:0 25px 70px #0008}.goddo-study-head{display:flex;justify-content:space-between;align-items:center;margin-bottom:14px}.goddo-study-head button,.goddo-study-actions button,.goddo-study-sound{background:#263b40;color:#fff;border:1px solid #6d807e;border-radius:10px;padding:12px;cursor:pointer}.goddo-study-photo{height:260px;display:flex;align-items:center;justify-content:center;background:#25373a;border-radius:15px;overflow:hidden}.goddo-study-img{width:100%;height:100%;object-fit:cover}.goddo-no-photo{display:flex;align-items:center;justify-content:center;text-align:center;color:#d6ddd9;padding:15px;min-height:50px}.goddo-study-card h2{font-size:34px;margin:14px 0 8px}.goddo-study-meaning{font-size:20px;font-weight:700;min-height:62px;padding:18px 5px;color:#e3c487}.goddo-study-actions{display:flex;gap:8px;flex-wrap:wrap;justify-content:center}.goddo-study-actions button:last-child{background:#247966}.goddo-study-actions button:disabled{opacity:.5;cursor:default}@media(max-width:480px){.goddo-study-photo{height:210px}.goddo-study-card{padding:13px}.goddo-study-actions button{flex:1 1 42%}}

/* GODDO COURSE ACADEMY */
.goddo-course-level{margin:22px 0;padding:18px;border:1px solid rgba(170,190,210,.25);border-radius:16px;background:rgba(255,255,255,.035)}.goddo-course-level h3{display:flex;justify-content:space-between;gap:12px;align-items:center}.goddo-course-level small{font-size:12px;opacity:.7}.goddo-course-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(195px,1fr));gap:10px}.goddo-course-tile,.goddo-course-choice{cursor:pointer;text-align:left;border:1px solid rgba(180,200,220,.25);border-radius:12px;padding:16px;background:rgba(120,160,190,.1);color:inherit}.goddo-course-tile strong,.goddo-course-tile span{display:block}.goddo-course-tile span{font-size:12px;margin-top:8px;opacity:.7}.goddo-course-tile:hover,.goddo-course-choice:hover{border-color:#74d3bb}.goddo-course-example{padding:14px;margin:10px 0;border:1px solid rgba(180,200,220,.2);border-radius:12px}.goddo-course-example p{margin:7px 0}.goddo-course-example button{cursor:pointer;padding:8px 12px;border-radius:8px}.goddo-course-choices{display:flex;gap:10px;flex-wrap:wrap}.goddo-course-choice{min-width:130px}#goddoCourseFeedback{margin:14px 0}#goddoCourseDetail[hidden],#goddoCourseList[hidden]{display:none!important}

/* GODDO MOBILE PREMIUM V4 */
.goddo-intro{position:fixed;inset:0;z-index:999999;display:flex;align-items:center;justify-content:center;overflow:hidden;background:radial-gradient(ellipse at 75% 15%,#204c5a 0%,transparent 40%),radial-gradient(ellipse at 15% 80%,#263b4d 0%,transparent 43%),#07121e;color:#fff;isolation:isolate;padding:env(safe-area-inset-top) 20px env(safe-area-inset-bottom);transition:opacity .55s ease,visibility .55s ease}
.goddo-intro.intro-hidden{opacity:0;visibility:hidden;pointer-events:none}
.intro-stars{position:absolute;inset:0;opacity:.65;background-image:radial-gradient(#f3d9a3 1px,transparent 1px),radial-gradient(#b2e8e5 1px,transparent 1px);background-size:79px 101px,137px 157px;background-position:11px 15px,56px 75px;animation:introStars 35s linear infinite}
.intro-orbit{position:absolute;width:min(125vw,620px);aspect-ratio:1;border:1px solid #c9a66533;border-radius:50%;transform:rotate(-26deg) scaleY(.65);box-shadow:0 0 65px #64c8c80b;animation:introOrbit 22s linear infinite}
.orbit-two{width:min(160vw,800px);transform:rotate(38deg) scaleY(.72);border-color:#71c6be22;animation-duration:30s;animation-direction:reverse}
.intro-content{position:relative;text-align:center;display:flex;flex-direction:column;align-items:center;max-width:470px;width:100%;padding:28px 0}
.intro-kicker{font-size:10px;letter-spacing:.28em;color:#e0c58d;font-weight:800;display:flex;align-items:center;gap:10px}.intro-dot{width:7px;height:7px;border-radius:50%;background:#80dfcf;box-shadow:0 0 13px #80dfcf}
.intro-emblem{margin:38px 0 17px;width:116px;height:116px;display:grid;place-items:center;position:relative;border-radius:30px;background:linear-gradient(145deg,#f3d9a0,#b68b4a 65%,#f3d9a0);box-shadow:0 24px 75px #d7b46b3b,inset 0 1px 1px #fff9;transform:rotate(-7deg)}
.intro-emblem>span{font:900 78px/1 Georgia,serif;color:#10222d;transform:rotate(7deg)}.intro-emblem-ring{position:absolute;inset:-14px;border:1px solid #e5c78688;border-radius:38px;animation:introPulse 3s ease-in-out infinite}
.intro-content h1{font-size:clamp(58px,15vw,94px);line-height:1;letter-spacing:.14em;margin:5px 0 8px;padding-left:.14em;font-weight:900;color:#f5e5bd;text-shadow:0 5px 38px #e1ba6755}
.intro-subtitle{font-size:10px;letter-spacing:.32em;color:#d5dce1;font-weight:800;margin:0}.intro-rule{width:54px;height:2px;background:linear-gradient(90deg,transparent,#f0c77e,transparent);margin:32px auto 23px}
.intro-content h2{font-size:clamp(29px,7.7vw,43px);line-height:1.24;letter-spacing:-.03em;margin:0;font-weight:800}.intro-content h2 em{font-style:normal;color:#e8c17e}.intro-description{font-size:14px;line-height:1.75;color:#aabecb;max-width:300px;margin:18px auto 29px}
.intro-enter{width:min(100%,350px);min-height:60px;border:0;border-radius:16px;background:linear-gradient(105deg,#f3d59a,#cda259);color:#10202a;font-size:13px;font-weight:900;letter-spacing:.11em;box-shadow:0 14px 38px #d8a95435;display:flex;align-items:center;justify-content:center;gap:22px;cursor:pointer}.intro-enter span{font-size:24px}.intro-enter:focus-visible{outline:3px solid #fff;outline-offset:4px}.intro-footnote{font-size:10px;letter-spacing:.14em;color:#8ba7af;margin-top:23px;font-weight:700}
@keyframes introStars{to{background-position:90px 116px,193px 232px}}@keyframes introOrbit{to{rotate:360deg}}@keyframes introPulse{50%{opacity:.4;transform:scale(1.08)}}
@media(max-width:760px){.mobile-bottom-nav{grid-template-columns:repeat(4,minmax(0,1fr))!important}.mobile-nav-button{min-height:56px}.main-content,.page{max-width:100%;min-width:0}.goddo-study-overlay{padding:12px 10px calc(12px + env(safe-area-inset-bottom))}.goddo-study-card{max-height:92dvh;overflow:auto}.goddo-study-photo{height:min(32dvh,220px)}.goddo-study-actions button{min-height:46px}.modal-panel{max-height:90dvh;overflow:auto}button{touch-action:manipulation}}
@media(max-height:680px){.intro-emblem{width:78px;height:78px;margin:20px 0 12px;border-radius:22px}.intro-emblem>span{font-size:52px}.intro-content h1{font-size:53px}.intro-rule{margin:16px auto}.intro-description{margin:10px auto 18px}.intro-content h2{font-size:27px}.intro-enter{min-height:52px}}
@media(prefers-reduced-motion:reduce){.intro-stars,.intro-orbit,.intro-emblem-ring{animation:none}.goddo-intro{transition:none}}

/* GODDO V7 — Cinematic mobile welcome & level selection */
.goddo-intro{background:radial-gradient(ellipse at 50% 65%,#153b62 0%,#071627 48%,#020914 100%)!important;overflow:hidden}
.goddo-intro::before{content:"";position:absolute;inset:0;background-image:radial-gradient(#fff8 1px,transparent 1.5px);background-size:29px 37px;opacity:.24;animation:goddoStars 35s linear infinite;pointer-events:none}
@keyframes goddoStars{to{transform:translateY(65px)}}
.goddo-planet-scene{position:relative;height:clamp(160px,27vh,270px);width:min(85vw,380px);margin:5px auto -12px;display:grid;place-items:center;perspective:600px}
.goddo-planet{width:min(55vw,225px);height:min(55vw,225px);border-radius:50%;background:radial-gradient(circle at 25% 24%,#e3b86e 0%,#3488a1 9%,#14536d 25%,#0c294d 45%,#04132c 70%),repeating-linear-gradient(90deg,transparent 0 14px,#e9bc72 15px 17px);box-shadow:inset -26px -14px 37px #010713,0 0 45px #e8ad5b55,0 0 100px #0879ac40;animation:goddoGlobe 14s ease-in-out infinite alternate}
@keyframes goddoGlobe{from{transform:rotate(-12deg) rotateY(-18deg)}to{transform:rotate(10deg) rotateY(22deg)}}
.goddo-planet-ring{position:absolute;width:95%;height:45%;border:2px solid #e5b963;border-radius:50%;transform:rotate(-24deg);box-shadow:0 0 22px #e8b85d77;animation:goddoOrbit 9s linear infinite}
@keyframes goddoOrbit{50%{transform:rotate(155deg)}}
.goddo-plane{position:absolute;right:6%;top:9%;font-size:40px;color:#f7d98b;filter:drop-shadow(0 0 10px #e8ba61);animation:goddoFlight 5s ease-in-out infinite alternate}
@keyframes goddoFlight{to{transform:translate(-45px,40px) rotate(-14deg)}}
.goddo-spark{position:absolute;left:12%;bottom:17%;color:#f7d58a;font-size:26px;animation:goddoTwinkle 2s infinite alternate}
@keyframes goddoTwinkle{to{opacity:.2;transform:scale(.6)}}
.goddo-level-gate[hidden]{display:none!important}.goddo-level-gate{position:fixed;inset:0;z-index:100000;background:radial-gradient(ellipse at top,#14395a,#061522 50%,#030a14);color:#fff;overflow:auto;padding:env(safe-area-inset-top) 18px env(safe-area-inset-bottom);font-family:inherit}
.goddo-gate-inner{max-width:510px;margin:auto;padding:35px 0 32px}.goddo-gate-kicker{font-size:10px;letter-spacing:3px;color:#dfb86b;text-align:center;font-weight:800}.goddo-gate-inner h2{text-align:center;font-size:clamp(30px,7vw,46px);line-height:1.14;margin:20px 0 12px;color:#fff}.goddo-gate-inner h2 em{font-family:Georgia,serif;color:#edc674;font-weight:400}.goddo-gate-inner>p{text-align:center;color:#aebfcf;font-size:14px;margin-bottom:23px}
.goddo-level-choices{display:grid;gap:10px}.goddo-level-option{width:100%;display:flex;align-items:center;text-align:left;gap:14px;padding:15px;border:1px solid #ffffff2c;border-radius:17px;background:linear-gradient(115deg,#173047,#0c1c30);color:white;cursor:pointer;transition:.2s;min-height:82px}.goddo-level-option:nth-child(2){background:linear-gradient(115deg,#12394b,#0c1c30)}.goddo-level-option:nth-child(3){background:linear-gradient(115deg,#49351a,#0c1c30)}.goddo-level-option:nth-child(4){background:linear-gradient(115deg,#30204b,#0c1c30)}.goddo-level-option:nth-child(5){background:linear-gradient(115deg,#4b1d28,#0c1c30)}.goddo-level-option:nth-child(6){background:linear-gradient(115deg,#1c3b3b,#0c1c30)}.goddo-level-option.selected{border:2px solid #e8c272;box-shadow:0 0 0 2px #e8c27225,0 0 20px #e8c27222;transform:scale(1.015)}.goddo-level-symbol{font-size:28px;width:42px;text-align:center}.goddo-level-name{flex:1}.goddo-level-name strong{display:block;font-size:21px}.goddo-level-name strong span{font-size:16px;font-weight:600;margin-left:9px}.goddo-level-name small{display:block;color:#bdc9d5;font-size:12px;margin-top:3px}.goddo-level-arrow{font-size:27px;color:#e9c477}
.goddo-gate-continue{width:100%;margin-top:21px;padding:18px;border-radius:15px;border:0;font-weight:900;font-size:16px;background:linear-gradient(100deg,#dca94d,#ffe49b,#c9913d);color:#1b1b20;box-shadow:0 8px 30px #dbac4d45;cursor:pointer}.goddo-gate-continue:disabled{opacity:.45;cursor:not-allowed}.goddo-gate-back{display:block;margin:16px auto 0;background:transparent;color:#b7c8d4;border:0;padding:10px;cursor:pointer}.goddo-level-change{margin:12px 0 18px;padding:13px 18px;border:1px solid #d4a85a;border-radius:12px;background:#152b37;color:#f1d18b;font-weight:700;cursor:pointer}
@media(max-width:600px){.goddo-gate-inner{padding-top:23px}.goddo-level-option{min-height:75px;padding:12px}.goddo-planet-scene{height:22vh;min-height:145px}.intro-content{padding-top:8px!important}}
@media(prefers-reduced-motion:reduce){.goddo-planet,.goddo-planet-ring,.goddo-plane,.goddo-spark,.goddo-intro::before{animation:none!important}}

/* GODDO V8 – premium mobile overview */
#dashboard{--gd-gold:#edc477;color:#f6f7fa}#dashboard .goddo-dash-top{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 16px}.goddo-dash-brand{font-weight:900;letter-spacing:.17em;color:#efc67d;font-size:19px}.goddo-dash-brand small{display:block;color:#94acb8;font-size:8px;letter-spacing:.21em;margin:2px 0 0 23px}.goddo-dash-live{font-size:9px;letter-spacing:.09em;color:#89ddc2;border:1px solid #4d9e8777;border-radius:30px;padding:8px 10px;white-space:nowrap}.goddo-premium-hero{position:relative;min-height:365px;overflow:hidden;border:1px solid #e7c47b66;border-radius:25px;background:#0b2030 url('https://images.unsplash.com/photo-1488646953014-85cb44e25828?w=1300&q=85') center 44%/cover no-repeat;box-shadow:0 20px 55px #0005}.goddo-premium-shade{position:absolute;inset:0;background:linear-gradient(90deg,#071725ef 0%,#081a2bba 56%,#0717254d 100%),linear-gradient(0deg,#051321ee,transparent 42%)}.goddo-premium-copy{position:relative;z-index:1;padding:43px 34px 65px;max-width:570px}.goddo-premium-kicker,.goddo-overline{font-size:10px;letter-spacing:.18em;font-weight:850;color:#e9c77d}.goddo-premium-copy h1{font-size:clamp(35px,5.3vw,65px);line-height:1.09;letter-spacing:-.035em;margin:20px 0 14px;color:#fff}.goddo-premium-copy h1 em{font-family:Georgia,serif;font-weight:400;color:#f2c77a}.goddo-premium-copy p{font-size:14px;color:#e1e8ec;max-width:380px;line-height:1.8}.goddo-hero-actions{display:flex;gap:10px;flex-wrap:wrap;margin-top:24px}.goddo-gold-cta,.goddo-ghost-cta{border:0;border-radius:13px;min-height:49px;padding:0 20px;font-size:13px;font-weight:850;cursor:pointer}.goddo-gold-cta{background:linear-gradient(115deg,#f8e1a4,#d5a24d);color:#13212b;box-shadow:0 8px 24px #b98a3555}.goddo-gold-cta span{margin-left:12px;font-size:18px}.goddo-ghost-cta{background:#ffffff17;border:1px solid #ffffff55;color:white;backdrop-filter:blur(6px)}.goddo-hero-bottom{position:absolute;bottom:0;left:0;right:0;display:flex;justify-content:space-between;gap:8px;padding:17px 32px;border-top:1px solid #ffffff28;color:#e4c48b;font-size:10px;letter-spacing:.09em;font-weight:700}.goddo-dashboard-intro{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:31px 0 17px}.goddo-dashboard-intro h2{font-size:clamp(22px,4vw,31px);margin:6px 0;color:#fff}.goddo-dashboard-intro p{color:#a8b9c7;font-size:12px;margin:0}.goddo-level-pill{flex-shrink:0;border:1px solid #d6af67aa;border-radius:14px;padding:12px 15px;background:#1b3440;color:#f5d28c;font-weight:800;cursor:pointer}.goddo-level-pill b{margin-left:8px}.goddo-feature-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin-bottom:30px}.goddo-feature{position:relative;min-height:162px;padding:22px 17px;text-align:left;display:flex;flex-direction:column;align-items:flex-start;gap:10px;border:1px solid #ffffff24;border-radius:18px;color:#fff;cursor:pointer;overflow:hidden;transition:transform .2s,filter .2s}.goddo-feature:hover{transform:translateY(-3px);filter:brightness(1.12)}.goddo-feature-grammar{background:linear-gradient(145deg,#135b76,#0b283e)}.goddo-feature-travel{background:linear-gradient(145deg,#145b57,#0b292f)}.goddo-feature-words{background:linear-gradient(145deg,#73501f,#322414)}.goddo-feature-speak{background:linear-gradient(145deg,#5c3a77,#241c3e)}.goddo-feature-icon{font-size:31px;color:#f4d18b}.goddo-feature strong{font-size:15px;line-height:1.25}.goddo-feature small{font-size:11px;color:#d2dce2;line-height:1.4}.goddo-feature-arrow{position:absolute;right:15px;top:15px;color:#fff9;font-size:19px}.goddo-progress-heading{margin:6px 0 14px}.goddo-progress-heading h3{margin:6px 0;font-size:22px;color:#fff}#dashboard .stat-card{border:1px solid #e3c47c24;border-radius:17px;background:linear-gradient(155deg,#19303c,#101e2a);box-shadow:0 10px 25px #0002}#dashboard .content-card{border-radius:20px;border-color:#d5b36b33}#dashboard .stats-grid{margin-bottom:25px}@media(max-width:900px){.goddo-feature-grid{grid-template-columns:repeat(2,minmax(0,1fr))}}@media(max-width:600px){.goddo-premium-hero{min-height:385px;border-radius:21px;background-position:57% center}.goddo-premium-copy{padding:39px 22px 65px}.goddo-premium-copy h1{font-size:39px}.goddo-premium-copy p{font-size:13px}.goddo-hero-bottom{padding:15px 19px;font-size:9px}.goddo-feature-grid{gap:9px}.goddo-feature{padding:16px 13px;min-height:145px}.goddo-feature strong{font-size:13px}.goddo-feature small{font-size:10px}.goddo-dashboard-intro{align-items:flex-end}.goddo-dashboard-intro p{max-width:215px}.goddo-level-pill{padding:10px;font-size:12px}}
/* GODDO V9 - Placement */
.goddo-placement[hidden]{display:none!important}.goddo-placement{position:fixed;inset:0;z-index:99999;background:rgba(1,9,19,.94);display:flex;align-items:center;justify-content:center;padding:16px;overflow:auto}.goddo-placement-panel{position:relative;width:min(100%,480px);border:1px solid rgba(230,187,101,.48);border-radius:24px;padding:30px 22px;background:linear-gradient(145deg,#102a40,#061321);color:#f5f6f8;box-shadow:0 25px 80px #0009}.goddo-placement-panel h2{font-size:clamp(23px,6vw,33px);margin:20px 0}.goddo-placement-panel p{line-height:1.6;color:#c5d1dc}.goddo-placement-kicker{color:#f0c977!important;letter-spacing:2px;font-size:11px;font-weight:700}.goddo-placement-close{position:absolute;right:16px;top:12px;background:transparent;border:0;color:white;font-size:23px;cursor:pointer}.goddo-placement-progress{height:7px;border-radius:9px;background:#344454;overflow:hidden}.goddo-placement-progress span{display:block;height:100%;background:#edc471;transition:width .2s}.goddo-placement-answers{display:grid;gap:12px}.goddo-placement-answers button,.goddo-placement-primary,.goddo-placement-secondary,.goddo-placement-dashboard{cursor:pointer;border-radius:13px;padding:15px;font:inherit}.goddo-placement-answers button{border:1px solid #526578;color:white;background:#17354b;text-align:left}.goddo-placement-answers button:active{background:#c69c4c;color:#091421}.goddo-placement-primary{background:linear-gradient(90deg,#e0af51,#ffe49b);color:#0d1c27;border:0;font-weight:800;width:100%;margin:12px 0}.goddo-placement-secondary{background:#132f42;color:#f5d38c;border:1px solid #ac8a4c;width:100%;margin-top:12px}.goddo-placement-dashboard{display:block;margin:22px auto;width:min(94%,540px);background:#102b40;color:#f4d58e;border:1px solid #b08b4a}.goddo-placement-note{font-size:12px}

/* V12 travel assessment */
.goddo-exam{padding:8px 0 18px}.goddo-exam-meta{color:#d6b779;font-weight:700;margin-bottom:12px}.goddo-exam-track{height:7px;border-radius:20px;background:#243c49;overflow:hidden;margin-bottom:20px}.goddo-exam-track span{display:block;height:100%;background:#d6b779;transition:width .25s}.goddo-exam-options{display:grid;gap:10px;margin:20px 0}.goddo-exam-option{border:1px solid #607482;border-radius:13px;background:#142936;color:#fff;text-align:left;padding:15px;font-size:16px;min-height:52px;cursor:pointer}.goddo-exam-option.correct{border-color:#4ecf91;background:#154c3b}.goddo-exam-option.incorrect{border-color:#f17b7b;background:#5a2d35}.goddo-exam-result{text-align:center;padding:24px 5px}.goddo-exam-result strong{font-size:28px;color:#e8c17e}.goddo-exam-medal{font-size:56px;color:#e8c17e}.goddo-exam-result button{margin:8px}

/* GODDO V13 mobile practice */
.goddo-speech-tools,.goddo-listening-tools{display:flex;gap:10px;flex-wrap:wrap;justify-content:center;margin:16px 0}.goddo-speech-tools button,.goddo-listening-tools button{min-height:44px;flex:1 1 135px}.goddo-speech-feedback{font-size:14px;line-height:1.6;color:#e8c17e;text-align:center;min-height:24px;margin:12px 0}#listeningQuestion[aria-hidden="true"]{visibility:hidden}@media(max-width:480px){.goddo-speech-tools,.goddo-listening-tools{gap:8px}}
/* GODDO V14 mobile readiness */
.goddo-v14-panel{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:20px 22px;margin:0 0 22px;background:linear-gradient(115deg,#0b2631,#133f46 55%,#273d37);border:1px solid rgba(226,192,116,.42);border-radius:22px;box-shadow:0 12px 35px rgba(0,0,0,.18);color:#f9f5e9}
.goddo-v14-panel h3{font-size:20px;margin:5px 0}.goddo-v14-panel p{font-size:13px;color:#b9d5d4;margin:0}.goddo-v14-kicker{font-size:10px;letter-spacing:2px;color:#e8c17e;font-weight:800}.goddo-v14-panel button{flex-shrink:0;padding:12px 15px;border:0;border-radius:12px;background:#e8c17e;color:#15252a;font-weight:800;cursor:pointer}.goddo-v14-check{display:flex;justify-content:space-between;padding:9px 0;border-bottom:1px solid rgba(127,127,127,.2)}.goddo-v14-check .good{color:#36aa7c}.goddo-v14-check .bad{color:#d96b6b}
@media(max-width:600px){.goddo-v14-panel{flex-direction:column;align-items:stretch;padding:18px}.goddo-v14-panel button{width:100%;min-height:44px}}

/* V15 photo frames: image fills the area, graceful offline placeholder. */
.goddo-photo-frame{display:inline-flex;align-items:center;justify-content:center;position:relative;overflow:hidden;flex-shrink:0;background:linear-gradient(145deg,#193b49,#294f53);border-radius:14px;min-width:64px;min-height:64px}
.goddo-photo-frame img{width:100%;height:100%;object-fit:cover;position:absolute;inset:0}
.goddo-photo-placeholder{width:100%;height:100%;min-height:64px;align-items:center;justify-content:center;font-size:38px}
.goddo-study-photo .goddo-photo-frame{width:100%;height:100%;min-height:210px}
.goddo-study-photo .goddo-photo-placeholder{font-size:94px}
.goddo-study-upload{display:block;margin:10px auto;padding:10px 16px;border:1px solid #c5a769;border-radius:10px;color:#f6dfa6;background:#263d43;cursor:pointer}

/* V16: Photo cache controls */
.goddo-photo-cache-tools{display:flex;flex-wrap:wrap;align-items:center;gap:12px;margin:14px 0;padding:12px;border:1px solid rgba(215,181,109,.25);border-radius:12px;background:rgba(21,45,51,.7)}
.goddo-photo-cache-tools button{padding:10px 14px;background:#d7b56d;color:#15262b;border:0;border-radius:10px;font-weight:750;cursor:pointer}
.goddo-photo-cache-tools button:disabled{opacity:.55;cursor:wait}
.goddo-photo-cache-tools small{color:#d2dede;line-height:1.5}

.goddo-photo-import{display:flex;gap:10px;align-items:center;flex-wrap:wrap;margin:12px 0 18px}.goddo-photo-import button{padding:12px 16px;background:#254e51;color:#fff;border:1px solid #c9ad70;border-radius:12px;cursor:pointer}.goddo-photo-import small{color:#c8d6d4;flex:1 1 220px}

/* V19: visible, accessible offline photo fallback */
.goddo-photo-placeholder{flex-direction:column!important;align-items:center;justify-content:center;gap:4px;text-align:center;padding:6px;font-size:clamp(20px,3vw,38px)}
.goddo-photo-placeholder small{font-size:10px;line-height:1.25;color:#e7d7b0;font-weight:600;letter-spacing:.01em}
.goddo-study-photo .goddo-photo-placeholder small{font-size:13px}
.goddo-photo-frame img{width:100%;height:100%;object-fit:cover}

/* GODDO V23 – VIDEO AKADEMISI */
.gva-intro{display:flex;justify-content:space-between;gap:12px;flex-wrap:wrap;background:linear-gradient(110deg,#183342,#172229);padding:18px;border:1px solid #bda16a66;border-radius:16px;margin:18px 0;color:#f6e4b9}.gva-intro span{color:#cad6da}
.gva-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:12px;margin:18px 0}.gva-tile{position:relative;display:flex;flex-direction:column;gap:9px;align-items:flex-start;text-align:left;padding:20px 16px;border:1px solid #c5a76d55;border-radius:16px;background:linear-gradient(145deg,#192d37,#111b24);color:#f4f5f4;min-height:175px;cursor:pointer}.gva-tile.selected,.gva-tile:hover{border-color:#d6b46f;box-shadow:0 8px 24px #0004}.gva-emoji{font-size:35px}.gva-level{position:absolute;right:12px;top:12px;color:#f6d690;background:#3b3425;border-radius:12px;padding:4px 10px}.gva-tile small{color:#bbd4d5}.gva-player{border:1px solid #bda16a66;border-radius:18px;overflow:hidden;margin:20px 0;background:#17232b}.gva-screen{aspect-ratio:16/9;min-height:260px;background:radial-gradient(ellipse at 40% 25%,#415b6c,#1c2e3a 55%,#0b121c);display:flex;flex-direction:column;justify-content:space-between;padding:20px;color:white}.gva-film-top{display:flex;justify-content:space-between;font-size:11px;letter-spacing:2px;color:#e8c98c}.gva-character{text-align:center;font-size:clamp(54px,12vw,100px);filter:drop-shadow(0 10px 15px #0006)}.gva-dialog{text-align:center;background:#08131cbb;border-radius:12px;padding:12px}.gva-speaker{font-size:11px;color:#e5c37f;letter-spacing:2px}.gva-english{font-size:clamp(18px,3vw,28px);font-weight:700;line-height:1.4}.gva-turkish{font-size:15px;color:#e9dbb9;margin-top:7px}.gva-progress{height:5px;background:#ffffff2a;border-radius:5px}.gva-progress span{display:block;height:100%;background:#e7bc67}.gva-controls{display:flex;gap:8px;flex-wrap:wrap;padding:16px}.gva-controls button,.gva-test button{background:#2c4754;color:white;border:1px solid #c1a56e88;border-radius:9px;padding:10px 13px;cursor:pointer}.gva-controls button:hover,.gva-test button:hover{background:#446473}.gva-test{padding:0 16px 20px}.gva-test button{display:block;width:100%;text-align:left;margin:8px 0}.gva-external{padding:16px;background:#182b34;border-radius:15px;margin-top:20px}.gva-external a{display:inline-block;margin:6px;padding:9px 12px;border:1px solid #bda16a55;border-radius:8px;color:#f4d59d;text-decoration:none}@media(max-width:550px){.gva-screen{min-height:280px;aspect-ratio:auto}.gva-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.gva-tile{min-height:160px;padding:14px 10px}.gva-film-top{font-size:9px}}

/* GODDO V24 real HTML5 video player */
.gv24-layout{color:#edf4f4}.gv24-note,.gv24-panel,.gv24-practice{padding:18px;background:#152833;border:1px solid #c6a66b66;border-radius:16px;margin:16px 0}.gv24-note strong{color:#f3d38e}.gv24-note p,.gv24-help{color:#c6d3d7}.gv24-topics{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:8px}.gv24-topic,.gv24-tools button,.gv24-url button,.gv24-rate button,.gv24-upload{background:#264653;color:#fff;border:1px solid #c6a66b88;border-radius:9px;padding:11px;cursor:pointer}.gv24-topic.selected{background:#735b30;border-color:#f4d38e}.gv24-panel video{display:block;width:100%;aspect-ratio:16/9;background:#05090e;border-radius:12px;max-height:65vh}.gv24-tools,.gv24-rate,.gv24-url{display:flex;gap:10px;flex-wrap:wrap;align-items:center;margin:12px 0}.gv24-upload input{display:block;max-width:230px;margin-top:7px;color:#fff}.gv24-url label{width:100%}.gv24-url input{flex:1;min-width:180px;padding:12px;border-radius:9px;background:#091a23;color:#fff;border:1px solid #c6a66b88}.gv24-help{font-size:13px}.gv24-practice strong{color:#f4d38e}@media(max-width:600px){.gv24-topics{grid-template-columns:repeat(2,minmax(0,1fr))}.gv24-panel{padding:10px}}
/* GODDO V33 - diagnostic panel */
.goddo-v33-panel{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding:16px 20px;margin:14px 0;border:1px solid rgba(215,181,109,.3);border-radius:14px;background:rgba(16,32,43,.85);color:#f1f5f9}.goddo-v33-panel p{margin:5px 0 0;color:#c0cbd4;font-size:13px}.goddo-v33-panel button,.goddo-v33-report button{border:0;border-radius:10px;padding:11px 16px;background:#d7b56d;color:#17222a;font-weight:700;cursor:pointer}.goddo-v33-item{display:flex;justify-content:space-between;gap:12px;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.12)}.goddo-v33-item small{display:block;opacity:.7;font-size:11px}.goddo-v33-item .pass{color:#75d7a1}.goddo-v33-item .fail{color:#f3a4a4}.goddo-v33-warning{font-size:13px;opacity:.8}