﻿/* ==========================================================================
   personalised.css — Content interaction, shelf, quotes, resources,
   learning paths, journal, practice log, dashboard.
   ========================================================================== */

/* ---- Shelf button on book cards ------------------------------------------ */
.book-shelf-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.75rem;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: #fff;
    font-size: 0.75rem;
    font-weight: 600;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s, background 0.2s;
    white-space: nowrap;
    letter-spacing: 0.02em;
    position: relative;
}

.book-shelf-btn:hover {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: var(--theme-accent, var(--color-primary, #d4a574));
}

.book-shelf-btn[data-status="want-to-read"]  { border-color: var(--theme-accent, #d4a574); color: var(--theme-accent, #d4a574); background: #fdf6ec; }
.book-shelf-btn[data-status="reading"]        { border-color: #0ea5e9; color: #0369a1; background: #f0f9ff; }
.book-shelf-btn[data-status="completed"]      { border-color: #16a34a; color: #15803d; background: #f0fdf4; }
.book-shelf-btn[data-status="revisit"]        { border-color: #d97706; color: #b45309; background: #fffbeb; }

/* Shelf dropdown */
.book-shelf-dropdown {
    position: absolute;
    top: calc(100% + 4px);
    left: 0;
    z-index: 50;
    background: #fff;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    box-shadow: 0 6px 20px rgba(0,0,0,0.10);
    min-width: 165px;
    overflow: hidden;
    display: none;
}

.book-shelf-dropdown.is-open { display: block; }

.shelf-option {
    display: block;
    width: 100%;
    padding: 0.55rem 0.9rem;
    font-size: 0.83rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    background: none;
    border: none;
    text-align: left;
    cursor: pointer;
    transition: background 0.15s;
}

.shelf-option:hover { background: var(--color-bg-alt, #f9f7f4); }
.shelf-option[data-status="want-to-read"]:hover  { color: var(--theme-accent, #d4a574); }
.shelf-option[data-status="reading"]:hover        { color: #0369a1; }
.shelf-option[data-status="completed"]:hover      { color: #15803d; }
.shelf-option[data-status="revisit"]:hover        { color: #b45309; }
.shelf-option[data-status=""]:hover               { color: #b91c1c; }

/* Resonance selector (shown after book is completed) */
.book-resonance-row {
    display: none;
    align-items: center;
    gap: 0.4rem;
    margin-top: 0.4rem;
    flex-wrap: wrap;
}

.book-resonance-row.is-visible { display: flex; }

.resonance-label {
    font-size: 0.73rem;
    color: var(--color-text-light, #7a7268);
    font-style: italic;
}

.resonance-btn {
    padding: 0.2rem 0.6rem;
    border-radius: 50px;
    border: 1.5px solid var(--color-border, #e2ddd7);
    background: #fff;
    font-size: 0.73rem;
    font-weight: 600;
    cursor: pointer;
    transition: border-color 0.15s, background 0.15s, color 0.15s;
    color: var(--color-text-light, #7a7268);
}

.resonance-btn:hover                        { border-color: var(--theme-accent, var(--color-primary, #d4a574)); color: var(--theme-accent, var(--color-primary, #d4a574)); }
.resonance-btn[data-resonance="deeply"]     { border-color: #16a34a; color: #15803d; background: #f0fdf4; }
.resonance-btn[data-resonance="somewhat"]   { border-color: var(--theme-accent, #d4a574); color: var(--theme-accent, #d4a574); background: #fdf6ec; }
.resonance-btn[data-resonance="not-yet"]    { border-color: #d97706; color: #b45309; background: #fffbeb; }

/* ---- Quote save button ---------------------------------------------------- */
.quote-save-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.25rem 0.65rem;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: transparent;
    font-size: 0.73rem;
    font-weight: 600;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    transition: all 0.2s;
    letter-spacing: 0.02em;
}

.quote-save-btn:hover {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: var(--theme-accent, var(--color-primary, #d4a574));
}

.quote-save-btn.is-saved {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
}

/* ---- Resource bookmark button -------------------------------------------- */
.resource-bookmark-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.75rem;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: #fff;
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    transition: all 0.2s;
}

.resource-bookmark-btn:hover {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: var(--theme-accent, var(--color-primary, #d4a574));
}

.resource-bookmark-btn.is-saved {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: var(--theme-accent, var(--color-primary, #d4a574));
    background: #fdf6ec;
}

/* ---- My Account new tabs content ----------------------------------------- */
.shelf-section { margin-bottom: 2rem; }

.shelf-section__title {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin: 0 0 0.8rem;
    padding-bottom: 0.4rem;
    border-bottom: 1px solid var(--color-border, #e2ddd7);
}

.shelf-mini-grid {
    display: grid;
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
    gap: 0.75rem;
}

.shelf-mini-card {
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    display: block;
    transition: border-color 0.2s;
}

.shelf-mini-card:hover { border-color: var(--theme-accent, var(--color-primary, #d4a574)); }

.shelf-mini-card__cover {
    width: 100%;
    aspect-ratio: 2/3;
    object-fit: cover;
    display: block;
    background: var(--color-border, #e2ddd7);
}

.shelf-mini-card__title {
    font-size: 0.8rem;
    font-weight: 600;
    padding: 0.4rem 0.5rem 0.15rem;
    line-height: 1.3;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.shelf-mini-card__author {
    font-size: 0.72rem;
    color: var(--color-text-light, #7a7268);
    padding: 0 0.5rem 0.5rem;
}

/* Saved quotes in My Wisdom tab */
.saved-quote-item {
    padding: 1rem 1.2rem;
    border-left: 3px solid var(--theme-accent, var(--color-primary, #d4a574));
    background: var(--color-bg-alt, #f9f7f4);
    border-radius: 0 var(--radius-sm, 6px) var(--radius-sm, 6px) 0;
    margin-bottom: 0.85rem;
}

.saved-quote-item__text {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.1rem;
    font-style: italic;
    color: var(--color-text, #2d2a26);
    line-height: 1.5;
    margin: 0 0 0.4rem;
}

.saved-quote-item__author {
    font-size: 0.8rem;
    color: var(--color-text-light, #7a7268);
    font-weight: 600;
}

/* ---- Learning Paths archive & single ------------------------------------- */
.path-card {
    background: #fff;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-md, 8px);
    padding: 1.3rem 1.5rem;
    display: flex;
    flex-direction: column;
    gap: 0.6rem;
    transition: border-color 0.2s, box-shadow 0.2s;
}

.path-card:hover {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    box-shadow: 0 4px 14px rgba(212,165,116,0.12);
}

.path-card__badge {
    display: flex;
    gap: 0.4rem;
}

.path-badge {
    display: inline-block;
    padding: 0.15rem 0.55rem;
    border-radius: 50px;
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    background: var(--color-bg-alt, #f9f7f4);
    color: var(--color-text-light, #7a7268);
    border: 1px solid var(--color-border, #e2ddd7);
}

.path-badge--tradition { background: #fdf6ec; color: var(--theme-accent, #d4a574); border-color: #e8dcc4; }
.path-badge--stage     { background: #f0fdf4; color: #15803d; border-color: #bbf7d0; }

.path-card__title {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin: 0;
    line-height: 1.3;
}

.path-card__title a { text-decoration: none; color: inherit; }
.path-card__title a:hover { color: var(--theme-accent, var(--color-primary, #d4a574)); }

.path-card__meta {
    font-size: 0.8rem;
    color: var(--color-text-light, #7a7268);
}

.path-card__excerpt {
    font-size: 0.88rem;
    color: var(--color-text, #2d2a26);
    line-height: 1.55;
    margin: 0;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.path-enrol-btn {
    display: inline-block;
    padding: 0.5rem 1.2rem;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border-radius: 50px;
    font-size: 0.82rem;
    font-weight: 700;
    border: none;
    cursor: pointer;
    text-decoration: none;
    transition: background 0.2s;
    align-self: flex-start;
    margin-top: 0.2rem;
}

.path-enrol-btn:hover { background: var(--color-primary-dark, #9a6520); color: #fff; }

/* Progress bar on enrolled paths */
.path-progress-bar {
    height: 5px;
    background: var(--color-border, #e2ddd7);
    border-radius: 5px;
    overflow: hidden;
    margin: 0.3rem 0;
}

.path-progress-fill {
    height: 100%;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    border-radius: 5px;
    transition: width 0.4s ease;
}

/* Single path — step list */
.path-steps-list {
    list-style: none;
    padding: 0;
    margin: 1.5rem 0;
}

.path-step-item {
    display: flex;
    gap: 1rem;
    align-items: flex-start;
    padding: 0.9rem 1rem;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    margin-bottom: 0.6rem;
    background: #fff;
    transition: border-color 0.2s;
}

.path-step-item.is-current { border-color: var(--theme-accent, var(--color-primary, #d4a574)); background: #fdf6ec; }
.path-step-item.is-done    { opacity: 0.55; }

.path-step-num {
    width: 28px;
    height: 28px;
    border-radius: 50%;
    background: var(--color-border, #e2ddd7);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 0.8rem;
    font-weight: 700;
    flex-shrink: 0;
    color: var(--color-text-light, #7a7268);
}

.path-step-item.is-current .path-step-num { background: var(--theme-accent, var(--color-primary, #d4a574)); color: #fff; }
.path-step-item.is-done .path-step-num    { background: #16a34a; color: #fff; }

.path-step-content { flex: 1; }

.path-step-title {
    font-size: 0.92rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin: 0 0 0.2rem;
}

.path-step-prompt {
    font-size: 0.82rem;
    color: var(--color-text-light, #7a7268);
    font-style: italic;
    margin: 0;
}

/* ---- Journal page --------------------------------------------------------- */
.journal-layout {
    display: grid;
    grid-template-columns: 1fr 340px;
    gap: 2rem;
    padding: 2.5rem 0 4rem;
}

.journal-editor-wrap {
    background: #fff;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-md, 8px);
    overflow: hidden;
}

.journal-prompt-banner {
    background: linear-gradient(135deg, #fdf6ec 0%, #f5ede0 100%);
    border-bottom: 1px solid #e8dcc4;
    padding: 0.9rem 1.2rem;
    display: flex;
    gap: 0.8rem;
    align-items: flex-start;
}

.journal-prompt-icon { font-size: 1.2rem; flex-shrink: 0; margin-top: 0.1rem; }

.journal-prompt-text {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.05rem;
    font-style: italic;
    color: var(--color-text, #2d2a26);
    line-height: 1.5;
    flex: 1;
}

.journal-textarea {
    width: 100%;
    min-height: 260px;
    padding: 1.2rem;
    border: none;
    outline: none;
    resize: vertical;
    font-size: 0.95rem;
    font-family: inherit;
    color: var(--color-text, #2d2a26);
    line-height: 1.7;
    background: #fff;
    box-sizing: border-box;
}

.journal-editor-footer {
    padding: 0.7rem 1.2rem;
    border-top: 1px solid var(--color-border, #e2ddd7);
    display: flex;
    justify-content: flex-end;
    gap: 0.7rem;
    align-items: center;
}

.journal-save-btn {
    padding: 0.5rem 1.3rem;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border: none;
    border-radius: 50px;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}

.journal-save-btn:hover { background: var(--color-primary-dark, #9a6520); }

.journal-char-count {
    font-size: 0.75rem;
    color: var(--color-text-light, #7a7268);
}

/* Journal entries sidebar */
.journal-entries-sidebar { }

.journal-entries-title {
    font-size: 0.78rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin: 0 0 0.8rem;
}

.journal-entry-item {
    padding: 0.75rem 0.9rem;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    margin-bottom: 0.55rem;
    background: #fff;
    cursor: pointer;
    transition: border-color 0.15s;
    position: relative;
}

.journal-entry-item:hover { border-color: var(--theme-accent, var(--color-primary, #d4a574)); }

.journal-entry-item.is-active { border-color: var(--theme-accent, var(--color-primary, #d4a574)); background: #fdf6ec; }

.journal-entry-date {
    font-size: 0.7rem;
    color: var(--color-text-light, #7a7268);
    margin-bottom: 0.2rem;
}

.journal-entry-preview {
    font-size: 0.83rem;
    color: var(--color-text, #2d2a26);
    line-height: 1.4;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}

.journal-entry-delete {
    position: absolute;
    top: 0.5rem;
    right: 0.5rem;
    background: none;
    border: none;
    font-size: 0.75rem;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    opacity: 0;
    transition: opacity 0.15s;
}

.journal-entry-item:hover .journal-entry-delete { opacity: 1; }
.journal-entry-delete:hover { color: #b91c1c; }

/* Saved wisdom in journal sidebar */
.saved-wisdom-section { margin-top: 1.8rem; }

/* ---- Journal canvas extras ------------------------------------------------ */

/* Entry type toolbar */
.journal-type-bar {
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0.7rem 1rem;
    border-bottom: 1px solid var(--color-border, #e2ddd7);
    background: var(--color-bg-alt, #f9f7f4);
}

.journal-type-btn {
    padding: 0.28rem 0.75rem;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: #fff;
    font-size: 0.79rem;
    cursor: pointer;
    color: var(--color-text-light, #7a7268);
    transition: all 0.15s;
    white-space: nowrap;
}

.journal-type-btn:hover { border-color: var(--theme-accent, var(--color-primary, #d4a574)); color: var(--theme-accent, var(--color-primary, #d4a574)); }

.journal-type-btn.is-active {
    background: var(--theme-accent, var(--color-primary, #d4a574));
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
}

/* Linked resources strip */
.journal-tag-area {
    padding: 0.6rem 1rem 0.4rem;
    border-bottom: 1px solid var(--color-border, #e2ddd7);
    position: relative;
}

.journal-resource-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.35rem;
    margin-bottom: 0.4rem;
    min-height: 0;
}

/* Resource chip (canvas) */
.jnl-chip {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.22rem 0.55rem;
    background: #f5ede0;
    border: 1px solid #e8dcc4;
    border-radius: 50px;
    font-size: 0.77rem;
    color: #9a6520;
    white-space: nowrap;
    max-width: 220px;
}

.jnl-chip__type {
    font-size: 0.68rem;
    text-transform: capitalize;
    opacity: 0.7;
}

.jnl-chip__title {
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    max-width: 140px;
}

.jnl-chip__remove {
    background: none;
    border: none;
    cursor: pointer;
    font-size: 0.8rem;
    color: var(--theme-accent, #d4a574);
    padding: 0;
    line-height: 1;
    flex-shrink: 0;
}

.jnl-chip__remove:hover { color: #b91c1c; }

/* @mention input */
.journal-tag-input-wrap {
    display: flex;
    align-items: center;
    gap: 0.3rem;
}

.journal-tag-at {
    font-size: 0.88rem;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-weight: 700;
    flex-shrink: 0;
}

#journal-tag-input {
    border: none;
    outline: none;
    font-size: 0.83rem;
    color: var(--color-text, #2d2a26);
    background: transparent;
    width: 100%;
    font-family: inherit;
}

#journal-tag-input::placeholder { color: var(--color-text-light, #7a7268); font-style: italic; }

/* @mention dropdown */
.journal-tag-dropdown {
    position: absolute;
    left: 1rem;
    right: 1rem;
    top: calc(100% + 2px);
    background: #fff;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    box-shadow: 0 4px 16px rgba(0,0,0,0.10);
    z-index: 200;
    max-height: 240px;
    overflow-y: auto;
}

.jnl-drop-item {
    display: flex;
    align-items: center;
    gap: 0.55rem;
    padding: 0.5rem 0.85rem;
    cursor: pointer;
    transition: background 0.12s;
}

.jnl-drop-item:hover { background: #fdf6ec; }

.jnl-drop-item__type {
    font-size: 0.68rem;
    text-transform: capitalize;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-weight: 700;
    min-width: 56px;
    flex-shrink: 0;
}

.jnl-drop-item__title {
    font-size: 0.83rem;
    color: var(--color-text, #2d2a26);
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}

/* New entry button */
.journal-new-btn {
    background: none;
    border: none;
    font-size: 0.82rem;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    padding: 0.25rem 0.5rem;
}

.journal-new-btn:hover { color: var(--theme-accent, var(--color-primary, #d4a574)); }

/* Sidebar meta row */
.journal-entry-meta {
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 0.25rem;
}

.journal-entry-type-badge {
    font-size: 0.68rem;
    background: #fdf6ec;
    color: #9a6520;
    border-radius: 50px;
    padding: 0.1rem 0.5rem;
    font-weight: 600;
    white-space: nowrap;
}

/* Sidebar linked resource chips */
.journal-entry-chips {
    display: flex;
    flex-wrap: wrap;
    gap: 0.25rem;
    margin-top: 0.4rem;
}

.journal-entry-chip {
    font-size: 0.68rem;
    padding: 0.1rem 0.45rem;
    background: #f5ede0;
    border-radius: 50px;
    color: #9a6520;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 120px;
}

.journal-entry-chip--more {
    background: #fdf6ec;
    color: var(--theme-accent, #d4a574);
}

/* Misc helpers */
.journal-entries-count { font-weight: 400; color: var(--color-text-light, #7a7268); }
.journal-empty-hint { font-size: 0.84rem; color: var(--color-text-light, #7a7268); font-style: italic; line-height: 1.55; }
.journal-more-wisdom { font-size: 0.78rem; color: var(--color-text-light, #7a7268); text-align: center; margin-top: 0.5rem; }

/* ── Reflect-in-journal CTA on single pages ── */
.reflect-journal-cta {
    display: flex;
    align-items: center;
    gap: 0.75rem;
    padding: 1rem 1.25rem;
    background: linear-gradient(135deg, #fdf6ec 0%, #f5ede0 100%);
    border: 1px solid #e8dcc4;
    border-radius: var(--radius-md, 8px);
    margin: 1.5rem 0 0;
}

.reflect-journal-cta__icon { font-size: 1.4rem; flex-shrink: 0; }

.reflect-journal-cta__body { flex: 1; }

.reflect-journal-cta__heading {
    font-size: 0.88rem;
    font-weight: 700;
    color: var(--color-text, #2d2a26);
    margin: 0 0 0.15rem;
}

.reflect-journal-cta__sub {
    font-size: 0.78rem;
    color: var(--color-text-light, #7a7268);
    margin: 0;
}

.reflect-journal-cta__btn {
    padding: 0.45rem 1.1rem;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border-radius: 50px;
    font-size: 0.8rem;
    font-weight: 700;
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
    transition: background 0.2s;
}

.reflect-journal-cta__btn:hover { background: var(--color-primary-dark, #9a6520); color: #fff; }

/* ── "Your notes on this resource" section on single pages ── */
.resource-journal-notes {
    padding: 1.5rem 0 2rem;
}

.resource-jnl-entry {
    padding: 0.8rem 1rem;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    margin-bottom: 0.6rem;
    background: #fff;
}

.resource-jnl-entry__meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.3rem;
}

.resource-jnl-entry__type {
    font-size: 0.7rem;
    background: #fdf6ec;
    color: #9a6520;
    border-radius: 50px;
    padding: 0.1rem 0.45rem;
    font-weight: 600;
}

.resource-jnl-entry__date {
    font-size: 0.72rem;
    color: var(--color-text-light, #7a7268);
}

.resource-jnl-entry__preview {
    font-size: 0.85rem;
    color: var(--color-text, #2d2a26);
    line-height: 1.55;
    margin: 0;
}

/* ── My Corner journal widget ── */
.mc-journal-widget { margin-bottom: 1.25rem; }

.mc-journal-last-entry {
    padding: 0.75rem 0;
}

.mc-journal-last-meta {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-bottom: 0.3rem;
}

.mc-journal-last-preview {
    font-size: 0.84rem;
    color: var(--color-text, #2d2a26);
    line-height: 1.5;
    margin: 0;
    font-style: italic;
}

.mc-journal-prompt-cta {
    font-size: 0.85rem;
    font-style: italic;
    color: var(--color-text-light, #7a7268);
    line-height: 1.55;
    margin: 0.5rem 0 0;
}

/* ── My Corner — Your Tradition widget ── */
.mc-tradition-widget {
    display: flex;
    align-items: center;
    gap: 0.85rem;
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px solid var(--color-border, #e2ddd7);
    border-left: 3px solid var(--theme-accent, var(--color-primary, #d4a574));
    border-radius: var(--radius-md, 8px);
    padding: 0.85rem 1.1rem;
    margin-bottom: 1.5rem;
}

.mc-tradition-widget__icon {
    font-size: 1.7rem;
    line-height: 1;
    flex-shrink: 0;
}

.mc-tradition-widget__body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.mc-tradition-widget__label {
    font-size: 0.72rem;
    font-weight: 600;
    text-transform: uppercase;
    letter-spacing: 0.05em;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    margin: 0;
}

.mc-tradition-widget__name {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.15rem;
    font-weight: 700;
    color: var(--color-text, #2d2a26);
    margin: 0;
}

.mc-tradition-widget__link {
    font-size: 0.8rem;
    font-weight: 600;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    white-space: nowrap;
    flex-shrink: 0;
    text-decoration: none;
    padding: 0.35rem 0.8rem;
    border: 1px solid var(--theme-accent, var(--color-primary, #d4a574));
    border-radius: 999px;
    transition: background 0.18s, color 0.18s;
}

.mc-tradition-widget__link:hover {
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
}

/* ---- Practice log --------------------------------------------------------- */
.practice-log-section { margin-bottom: 2rem; }

.practice-checkin {
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-md, 8px);
    padding: 1.2rem 1.4rem;
    margin-bottom: 1.2rem;
}

.practice-checkin__label {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.1rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin: 0 0 0.8rem;
}

.practice-minutes-row {
    display: flex;
    gap: 0.5rem;
    flex-wrap: wrap;
    margin-bottom: 0.8rem;
}

.practice-min-btn {
    padding: 0.4rem 0.9rem;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: #fff;
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: all 0.15s;
    color: var(--color-text, #2d2a26);
}

.practice-min-btn:hover,
.practice-min-btn.is-selected { border-color: var(--theme-accent, var(--color-primary, #d4a574)); color: var(--theme-accent, var(--color-primary, #d4a574)); background: #fdf6ec; }

.practice-log-btn {
    padding: 0.5rem 1.3rem;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border: none;
    border-radius: 50px;
    font-size: 0.82rem;
    font-weight: 700;
    cursor: pointer;
    transition: background 0.2s;
}

.practice-log-btn:hover { background: var(--color-primary-dark, #9a6520); }

.practice-streak-row {
    display: flex;
    gap: 1rem;
    margin-bottom: 1rem;
    flex-wrap: wrap;
}

.practice-streak-item {
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    padding: 0.7rem 1rem;
    text-align: center;
    min-width: 100px;
}

.practice-streak-num {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 2rem;
    font-weight: 600;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    line-height: 1;
    display: block;
}

.practice-streak-label {
    font-size: 0.72rem;
    color: var(--color-text-light, #7a7268);
    font-weight: 600;
    letter-spacing: 0.04em;
    text-transform: uppercase;
}

/* 90-day heatmap */
.practice-heatmap {
    display: flex;
    flex-wrap: wrap;
    gap: 3px;
    margin-top: 0.8rem;
}

.heatmap-day {
    width: 13px;
    height: 13px;
    border-radius: 2px;
    background: var(--color-border, #e2ddd7);
    position: relative;
    cursor: default;
}

.heatmap-day[data-min="0"]    { background: var(--color-border, #e2ddd7); }
.heatmap-day[data-level="1"]  { background: #fce4b0; }
.heatmap-day[data-level="2"]  { background: #e8c47a; }
.heatmap-day[data-level="3"]  { background: var(--theme-accent, #d4a574); }

/* ---- "For You" recommendations page -------------------------------------- */
.for-you-section { margin-bottom: 2.8rem; }

.for-you-section__header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 1.2rem;
    gap: 1rem;
}

.for-you-section__title {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.35rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin: 0;
}

.for-you-because {
    font-size: 0.8rem;
    color: var(--color-text-light, #7a7268);
    font-style: italic;
}

.for-you-see-all {
    font-size: 0.82rem;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    text-decoration: none;
    font-weight: 600;
    white-space: nowrap;
}

/* Daily Anchor section */
.daily-anchor {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
    margin-bottom: 2.8rem;
}

.anchor-quote {
    background: linear-gradient(135deg, #f3dca8 0%, #e8c97a 100%);
    color: var(--color-text, #2d2a26);
    border-radius: var(--radius-md, 8px);
    padding: 1.8rem 1.6rem;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.anchor-quote__mark {
    font-family: Georgia, serif;
    font-size: 4rem;
    line-height: 0.7;
    color: rgba(139,90,42,0.20);
    margin-bottom: 0.5rem;
}

.anchor-quote__text {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.25rem;
    font-style: italic;
    line-height: 1.55;
    flex: 1;
    margin: 0 0 1rem;
}

.anchor-quote__author {
    font-size: 0.82rem;
    opacity: 0.75;
    font-weight: 600;
}

.anchor-resource {
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-md, 8px);
    overflow: hidden;
    display: flex;
    flex-direction: column;
}

.anchor-resource__thumb {
    width: 100%;
    aspect-ratio: 16/9;
    object-fit: cover;
    background: var(--color-border, #e2ddd7);
}

.anchor-resource__body {
    padding: 0.9rem 1rem;
    flex: 1;
}

.anchor-resource__type {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin-bottom: 0.3rem;
}

.anchor-resource__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    line-height: 1.4;
    text-decoration: none;
    display: block;
}

.anchor-resource__title:hover { color: var(--theme-accent, var(--color-primary, #d4a574)); }

/* ---- Dashboard (Your Corner) --------------------------------------------- */
.my-corner-page { padding: 2.5rem 0 5rem; }

.corner-welcome {
    background: linear-gradient(135deg, #8b5a2a 0%, #c49563 100%);
    color: #fff;
    padding: 2rem 0 2.2rem;
    margin-bottom: 2.2rem;
}

.corner-welcome__inner {
    display: flex;
    align-items: center;
    gap: 1.2rem;
}

.corner-welcome__avatar {
    width: 56px;
    height: 56px;
    border-radius: 50%;
    overflow: hidden;
    flex-shrink: 0;
    background: rgba(255,255,255,0.2);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1.8rem;
}

.corner-welcome__avatar img { width: 100%; height: 100%; object-fit: cover; }

.corner-welcome__greeting {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.7rem;
    font-weight: 600;
    margin: 0 0 0.15rem;
    color: #fff;
}

.corner-welcome__date {
    font-size: 0.84rem;
    opacity: 0.75;
    color: #fff;
}

.corner-section-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.4rem;
    margin-bottom: 2rem;
}

.corner-widget {
    background: #fff;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-md, 8px);
    padding: 1.2rem 1.4rem;
}

.corner-widget__label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin: 0 0 0.8rem;
}

.corner-widget__link {
    display: inline-block;
    margin-top: 0.8rem;
    font-size: 0.82rem;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-weight: 600;
    text-decoration: none;
}

.corner-widget__link:hover { text-decoration: underline; }


/* ==========================================================================
   INTERACTION FIXES & EXTENSIONS
   ========================================================================== */

/* ── Book card: allow shelf dropdown to overflow the card boundary ── */
.book-card {
    overflow: visible;
    position: relative; /* needed for z-index stacking */
    z-index: 1;
}
/* Re-apply clipping only to the cover image so border-radius still works */
.book-card-cover {
    border-radius: var(--radius-lg, 10px) var(--radius-lg, 10px) 0 0;
    overflow: hidden;
}
/* Elevate the card whose dropdown is open above all sibling cards */
.book-card.shelf-active {
    z-index: 50;
}
.book-shelf-dropdown.is-open {
    z-index: 100;
}

/* ── Master save button ── */
.master-save-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.4rem 0.9rem;
    border: 1.5px solid rgba(255,255,255,0.6);
    border-radius: 50px;
    background: rgba(255,255,255,0.15);
    color: #fff;
    font-size: 0.78rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, border-color 0.2s;
    backdrop-filter: blur(4px);
    letter-spacing: 0.02em;
}
.master-save-btn:hover {
    background: rgba(255,255,255,0.28);
    border-color: rgba(255,255,255,0.9);
}
.master-save-btn.is-saved {
    background: rgba(255,255,255,0.9);
    color: #8b5a2a;
    border-color: rgba(255,255,255,0.9);
}

/* Archive card version (on dark card background) */
.master-card .master-save-btn {
    border-color: var(--color-border, #e2ddd7);
    background: #fff;
    color: var(--color-text-light, #7a7268);
    font-size: 0.72rem;
    padding: 0.25rem 0.6rem;
    backdrop-filter: none;
}
.master-card .master-save-btn:hover {
    border-color: var(--theme-accent, #d4a574);
    color: var(--theme-accent, #d4a574);
    background: #fdf6ec;
}
.master-card .master-save-btn.is-saved {
    background: #fdf6ec;
    color: var(--theme-accent, #d4a574);
    border-color: var(--theme-accent, #d4a574);
}

/* ── Generic resource save button (For You page cards, any context) ── */
.resource-save-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
    padding: 0.3rem 0.7rem;
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: #fff;
    font-size: 0.72rem;
    font-weight: 600;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    transition: border-color 0.2s, color 0.2s, background 0.2s;
    white-space: nowrap;
}
.resource-save-btn:hover,
.resource-save-btn.is-saved {
    border-color: var(--theme-accent, #d4a574);
    color: var(--theme-accent, #d4a574);
    background: #fdf6ec;
}

/* ── Event save button ── */
.event-save-btn {
    display: inline-flex;
    align-items: center;
    gap: 0.35rem;
    padding: 0.45rem 1.1rem;
    border: 1.5px solid var(--theme-accent, var(--color-primary, #d4a574));
    border-radius: 50px;
    background: transparent;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-size: 0.82rem;
    font-weight: 600;
    cursor: pointer;
    transition: background 0.2s, color 0.2s;
    white-space: nowrap;
    letter-spacing: 0.02em;
}
.event-save-btn:hover {
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
}
.event-save-btn.is-saved {
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
}

/* ── Single book page shelf widget ── */
.bk-shelf-widget {
    margin: 1rem 0 0.5rem;
    padding: 0.9rem 1rem;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    background: var(--color-bg-alt, #f9f7f4);
}
.bk-shelf-widget__label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin: 0 0 0.6rem;
}
.bk-shelf-widget .book-shelf-dropdown {
    position: static;
    box-shadow: none;
    border: none;
    border-radius: 0;
    background: transparent;
    display: flex;
    flex-wrap: wrap;
    gap: 0.4rem;
    padding: 0;
    margin-top: 0.5rem;
}
.bk-shelf-widget .shelf-option {
    border: 1.5px solid var(--color-border, #e2ddd7);
    border-radius: 50px;
    background: #fff;
    color: var(--color-text, #2d2a26);
    font-size: 0.78rem;
    padding: 0.3rem 0.75rem;
    cursor: pointer;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.bk-shelf-widget .shelf-option:hover {
    border-color: var(--theme-accent, #d4a574);
    color: var(--theme-accent, #d4a574);
    background: #fdf6ec;
}

/* ==========================================================================
   MY CORNER — New tab hub styles (Phase 9)
   ========================================================================== */

/* ── Welcome header additions ── */
.corner-welcome__inner {
    display: flex;
    align-items: center;
    gap: 1rem;
}

.corner-welcome__text {
    flex: 1;
}

.corner-settings-link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 36px;
    height: 36px;
    border-radius: 50%;
    border: 1.5px solid rgba(255,255,255,0.4);
    color: rgba(255,255,255,0.8);
    text-decoration: none;
    transition: background 0.2s, border-color 0.2s;
    flex-shrink: 0;
}
.corner-settings-link:hover {
    background: rgba(255,255,255,0.15);
    border-color: rgba(255,255,255,0.8);
    color: #fff;
}

/* ── Tab badge counts ── */
.mc-tab-count {
    display: inline-flex;
    align-items: center;
    font-size: 0.68rem;
    font-weight: 700;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border-radius: 50px;
    padding: 0.1rem 0.4rem;
    margin-left: 0.3rem;
    line-height: 1.4;
    vertical-align: middle;
}
.mc-tab-count--fire {
    background: transparent;
    color: inherit;
    font-size: 0.8rem;
    padding: 0;
}
.account-tab.is-active .mc-tab-count {
    background: rgba(212,165,116,0.15);
    color: var(--theme-accent, var(--color-primary, #d4a574));
}
/* Link-style tab (navigates to its own page rather than switching a panel) */
.account-tab--link {
    text-decoration: none;
    display: inline-flex;
    align-items: center;
    gap: 0.3rem;
}
.account-tab--link:hover {
    text-decoration: none;
}

/* ── My Corner tabs (scrollable) ── */
.mc-tabs {
    margin-bottom: 1.6rem;
}

/* ── Corner grid (2-column on desktop) ── */
.mc-grid-2col {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 1.2rem;
}

/* ── Anchor widget (gold) ── */
.corner-widget--anchor {
    background: linear-gradient(135deg, #f3dca8 0%, #e8c97a 100%);
    color: var(--color-text, #2d2a26);
    border-color: #e0b86a;
}
.corner-widget--anchor .corner-widget__label {
    color: var(--color-text-light, #7a7268);
}
.mc-anchor-text {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.05rem;
    font-style: italic;
    line-height: 1.65;
    margin-bottom: 0.6rem;
    color: var(--color-text, #2d2a26);
}
.mc-anchor-author {
    font-size: 0.78rem;
    opacity: 0.65;
    margin-bottom: 0;
}

/* ── Widget extras ── */
.corner-widget__empty {
    font-size: 0.84rem;
    color: var(--color-text-light, #7a7268);
    font-style: italic;
    margin: 0 0 0.5rem;
    line-height: 1.55;
}
.mc-today-logged {
    font-size: 0.85rem;
    color: #15803d;
    font-weight: 600;
    margin: 0 0 0.6rem;
}
.mc-path-title {
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    font-size: 0.95rem;
    margin-bottom: 0.4rem;
}

/* ── Shelf counts in dashboard widget ── */
.mc-shelf-counts {
    display: flex;
    gap: 1.2rem;
    margin-bottom: 0.8rem;
    flex-wrap: wrap;
}
.mc-shelf-count {
    text-align: center;
}
.mc-shelf-count__num {
    display: block;
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.8rem;
    font-weight: 600;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    line-height: 1;
}
.mc-shelf-count--done .mc-shelf-count__num {
    color: #15803d;
}
.mc-shelf-count__label {
    display: block;
    font-size: 0.68rem;
    color: var(--color-text-light, #7a7268);
    font-weight: 700;
    letter-spacing: 0.04em;
    text-transform: uppercase;
    margin-top: 0.15rem;
}

/* ── Section label ── */
.mc-section-label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin: 0 0 0.7rem;
}

/* ── Block wrapper (spacing util) ── */
.mc-block {
    margin-bottom: 1.6rem;
}
.mc-block-header {
    display: flex;
    align-items: baseline;
    justify-content: space-between;
    margin-bottom: 0.8rem;
}
.mc-block-header__more {
    font-size: 0.78rem;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-weight: 600;
    text-decoration: none;
}
.mc-block-header__more:hover { text-decoration: underline; }

/* ── Upcoming events strip ── */
.mc-events-strip {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    flex-wrap: wrap;
}
.mc-event-card {
    display: flex;
    align-items: center;
    gap: 0.7rem;
    padding: 0.6rem 0.9rem;
    background: #fff;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    flex: 1;
    min-width: 200px;
    max-width: 320px;
}
.mc-event-card__badge {
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 36px;
    background: var(--theme-accent, var(--color-primary, #d4a574));
    color: #fff;
    border-radius: 4px;
    padding: 0.3rem 0.4rem;
    text-align: center;
    flex-shrink: 0;
}
.mc-event-card__badge .badge-day {
    font-size: 1.1rem;
    font-weight: 700;
    line-height: 1;
}
.mc-event-card__badge .badge-month {
    font-size: 0.62rem;
    font-weight: 700;
    letter-spacing: 0.05em;
    text-transform: uppercase;
    opacity: 0.85;
}
.mc-event-card__info {
    flex: 1;
    min-width: 0;
}
.mc-event-card__title {
    display: block;
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mc-event-card__title:hover { color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-event-card__time {
    font-size: 0.75rem;
    color: var(--color-text-light, #7a7268);
}
.mc-events-more {
    font-size: 0.82rem;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-weight: 600;
    text-decoration: none;
    white-space: nowrap;
}
.mc-events-more:hover { text-decoration: underline; }

/* Event card arrow link */
.mc-event-card__link {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 28px;
    height: 28px;
    border-radius: 50%;
    border: 1.5px solid var(--color-border, #e2ddd7);
    color: var(--color-text-light, #7a7268);
    text-decoration: none;
    font-size: 0.85rem;
    flex-shrink: 0;
    transition: border-color 0.15s, color 0.15s, background 0.15s;
}
.mc-event-card__link:hover {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: var(--theme-accent, var(--color-primary, #d4a574));
    background: #fdf6ec;
}

/* Events empty state */
.mc-events-empty {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    padding: 1rem 1.1rem;
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px dashed var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
}
.mc-events-empty__icon {
    font-size: 1.5rem;
    flex-shrink: 0;
}
.mc-events-empty__msg {
    font-size: 0.86rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin: 0 0 0.2rem;
}
.mc-events-empty__link {
    font-size: 0.8rem;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    text-decoration: none;
    font-weight: 500;
}
.mc-events-empty__link:hover { text-decoration: underline; }
.mc-events-empty__text { flex: 1; }

/* ── Recommendation strip ── */
.mc-rec-strip {
    display: grid;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.9rem;
}
.mc-rec-card {
    display: flex;
    flex-direction: column;
    background: #fff;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    overflow: hidden;
    text-decoration: none;
    color: inherit;
    transition: box-shadow 0.2s, transform 0.2s;
}
.mc-rec-card:hover {
    box-shadow: 0 4px 16px rgba(0,0,0,0.08);
    transform: translateY(-2px);
}
.mc-rec-card__img {
    width: 100%;
    aspect-ratio: 3/4;
    overflow: hidden;
    background: var(--color-bg-alt, #f9f7f4);
}
.mc-rec-card__img img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.mc-rec-card__img--placeholder {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 2rem;
}
.mc-rec-card__body {
    padding: 0.6rem 0.75rem 0.75rem;
    display: flex;
    flex-direction: column;
    gap: 0.2rem;
    flex: 1;
}
.mc-rec-card__type {
    font-size: 0.68rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: var(--theme-accent, var(--color-primary, #d4a574));
}
.mc-rec-card__title {
    font-size: 0.84rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    line-height: 1.35;
}
.mc-rec-card__sub {
    font-size: 0.75rem;
    color: var(--color-text-light, #7a7268);
}

/* ── Empty recs / retake nudge ── */
.mc-recs-placeholder {
    padding: 1.2rem 1.4rem;
    background: var(--color-bg-alt, #f9f7f4);
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-md, 8px);
}
.mc-retake-nudge {
    padding: 0.9rem 1.2rem;
    border: 1px dashed var(--theme-accent, var(--color-primary, #d4a574));
    border-radius: var(--radius-md, 8px);
    background: #fdf6ec;
    font-size: 0.85rem;
    color: var(--color-text, #2d2a26);
}
.mc-retake-nudge a {
    color: var(--theme-accent, var(--color-primary, #d4a574));
    font-weight: 600;
    text-decoration: none;
}
.mc-retake-nudge a:hover { text-decoration: underline; }

/* ── Empty state (for tabs with no content) ── */
.mc-empty-state {
    text-align: center;
    padding: 2.5rem 1.5rem;
}
.mc-empty-state__icon {
    font-size: 2.5rem;
    margin-bottom: 0.8rem;
}
.mc-empty-state__title {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.25rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin: 0 0 0.5rem;
}
.mc-empty-state__desc {
    font-size: 0.88rem;
    color: var(--color-text-light, #7a7268);
    line-height: 1.6;
    max-width: 380px;
    margin: 0 auto 1.2rem;
}

/* ── Saved rows (Saved tab) ── */
.mc-saved-section {
    margin-bottom: 1.8rem;
}
.mc-saved-row {
    display: flex;
    align-items: center;
    gap: 0.8rem;
    padding: 0.7rem 0;
    border-bottom: 1px solid var(--color-border, #e2ddd7);
}
.mc-saved-row:last-child {
    border-bottom: none;
}
.mc-saved-row--muted {
    opacity: 0.55;
}
.mc-saved-row__avatar {
    width: 36px;
    height: 36px;
    border-radius: 50%;
    object-fit: cover;
    flex-shrink: 0;
}
.mc-saved-row__icon {
    font-size: 1.2rem;
    flex-shrink: 0;
    width: 36px;
    text-align: center;
}
.mc-saved-row__body {
    flex: 1;
    min-width: 0;
}
.mc-saved-row__title {
    display: block;
    font-size: 0.9rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    text-decoration: none;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}
.mc-saved-row__title:hover { color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-saved-row__meta {
    font-size: 0.75rem;
    color: var(--color-text-light, #7a7268);
    display: block;
    margin-top: 0.1rem;
}
.mc-saved-row__tag {
    font-size: 0.7rem;
    color: var(--color-text-light, #7a7268);
    flex-shrink: 0;
}
.mc-saved-row__link {
    font-size: 0.78rem;
    font-weight: 600;
    color: var(--theme-accent, var(--color-primary, #d4a574));
    text-decoration: none;
    white-space: nowrap;
    flex-shrink: 0;
}
.mc-saved-row__link:hover { text-decoration: underline; }

/* ── Paths tab ── */
.mc-path-row {
    padding: 1rem 1.2rem;
    border: 1px solid var(--color-border, #e2ddd7);
    border-radius: var(--radius-sm, 6px);
    margin-bottom: 0.8rem;
}
.mc-path-row__header {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    gap: 1rem;
    margin-bottom: 0.5rem;
}
.mc-path-row__title {
    font-size: 0.95rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    text-decoration: none;
}
.mc-path-row__title:hover { color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-path-row__status {
    font-size: 0.75rem;
    color: var(--color-text-light, #7a7268);
    font-weight: 600;
    white-space: nowrap;
}
.mc-path-row__status--done { color: #15803d; }

/* ── Practice tab extras ── */
.mc-practice-note {
    font-size: 0.78rem;
    color: var(--color-text-light, #7a7268);
    font-style: italic;
    margin-top: 1rem;
    line-height: 1.55;
}
.practice-heatmap-legend {
    display: flex;
    align-items: center;
    gap: 0.5rem;
    margin-top: 0.4rem;
    font-size: 0.7rem;
    color: var(--color-text-light, #7a7268);
}
.heatmap-legend-swatch {
    width: 12px;
    height: 12px;
    border-radius: 2px;
}

/* ==========================================================================
   NEW SEEKER WELCOME BANNER (Phase 11)
   ========================================================================== */

.mc-welcome-banner {
    position: relative;
    background: linear-gradient(135deg, #2d1a0e 0%, #8b5a2a 50%, #d4a574 100%);
    border-radius: var(--radius-md, 8px);
    padding: 1.8rem 2rem;
    margin-bottom: 1.8rem;
    color: #fff;
    overflow: hidden;
}
.mc-welcome-banner::before {
    content: '';
    position: absolute;
    top: -40px;
    right: -40px;
    width: 200px;
    height: 200px;
    border-radius: 50%;
    background: rgba(255,255,255,0.05);
    pointer-events: none;
}

/* Dismiss button */
.mc-welcome-dismiss {
    position: absolute;
    top: 0.9rem;
    right: 1rem;
    background: none;
    border: none;
    color: rgba(255,255,255,0.6);
    font-size: 1.4rem;
    cursor: pointer;
    line-height: 1;
    padding: 0.2rem 0.4rem;
    transition: color 0.15s;
}
.mc-welcome-dismiss:hover { color: #fff; }

/* Inner layout: text left, picks right */
.mc-welcome-banner__inner {
    display: grid;
    grid-template-columns: 1fr 1.4fr;
    gap: 2rem;
    align-items: start;
}

.mc-welcome-banner__eyebrow {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.1em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.6);
    margin: 0 0 0.5rem;
}
.mc-welcome-banner__name {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.7rem;
    font-weight: 600;
    color: #fff;
    margin: 0 0 0.8rem;
    line-height: 1.2;
}
.mc-welcome-banner__tradition {
    margin: 0 0 0.8rem;
}
.mc-welcome-tradition-tag {
    display: inline-block;
    font-size: 0.75rem;
    font-weight: 600;
    background: rgba(255,255,255,0.18);
    border: 1px solid rgba(255,255,255,0.3);
    border-radius: 50px;
    padding: 0.2rem 0.7rem;
    letter-spacing: 0.03em;
}
.mc-welcome-banner__quote {
    font-family: var(--font-heading, 'Cormorant Garamond', serif);
    font-size: 1.05rem;
    font-style: italic;
    color: rgba(255,255,255,0.8);
    line-height: 1.6;
    margin: 0;
}

/* Starter picks section */
.mc-welcome-picks__label {
    font-size: 0.7rem;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
    margin: 0 0 0.7rem;
}
.mc-welcome-picks-grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 0.7rem;
}
.mc-welcome-pick-card {
    display: flex;
    flex-direction: column;
    background: rgba(255,255,255,0.1);
    border: 1px solid rgba(255,255,255,0.2);
    border-radius: var(--radius-sm, 6px);
    overflow: hidden;
    text-decoration: none;
    color: #fff;
    transition: background 0.2s, border-color 0.2s;
}
.mc-welcome-pick-card:hover {
    background: rgba(255,255,255,0.18);
    border-color: rgba(255,255,255,0.45);
    color: #fff;
}
.mc-welcome-pick-card img {
    width: 100%;
    aspect-ratio: 4/3;
    object-fit: cover;
    display: block;
}
.mc-welcome-pick-card__placeholder {
    width: 100%;
    aspect-ratio: 4/3;
    display: flex;
    align-items: center;
    justify-content: center;
    background: rgba(255,255,255,0.08);
    font-size: 1.8rem;
}
.mc-welcome-pick-card__body {
    padding: 0.55rem 0.65rem 0.65rem;
    display: flex;
    flex-direction: column;
    gap: 0.15rem;
}
.mc-welcome-pick-card__type {
    font-size: 0.64rem;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    color: rgba(255,255,255,0.55);
}
.mc-welcome-pick-card__title {
    font-size: 0.82rem;
    font-weight: 600;
    color: #fff;
    line-height: 1.3;
}
.mc-welcome-pick-card__sub {
    font-size: 0.72rem;
    color: rgba(255,255,255,0.6);
}
.mc-welcome-pick-card--path .mc-welcome-pick-card__title {
    color: #e9d5ff;
}

/* =============================================================================
   PHASE D — MILESTONE BANNERS
   ============================================================================= */

.mc-milestone-banner {
    display: flex;
    align-items: center;
    gap: 0.9rem;
    background: linear-gradient(135deg, #fef9ec 0%, #fffdf7 100%);
    border: 1px solid #f0d875;
    border-left: 4px solid #f5c518;
    border-radius: 10px;
    padding: 0.9rem 1.1rem;
    margin-bottom: 0.75rem;
}

.mc-milestone-banner__icon {
    font-size: 1.6rem;
    flex-shrink: 0;
    line-height: 1;
}

.mc-milestone-banner__text {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
}

.mc-milestone-banner__text strong {
    font-size: 0.9rem;
    color: var(--color-text, #2d2a26);
}

.mc-milestone-banner__text span {
    font-size: 0.8rem;
    color: var(--color-text-light, #7a7268);
}

.mc-milestone-banner__dismiss {
    background: none;
    border: none;
    font-size: 1.2rem;
    color: var(--color-text-light, #7a7268);
    cursor: pointer;
    padding: 0 0.2rem;
    line-height: 1;
    flex-shrink: 0;
}

.mc-milestone-banner__dismiss:hover { color: var(--color-text, #2d2a26); }

/* =============================================================================
   PHASE D — JOURNEY TIMELINE
   ============================================================================= */

.mc-journey-block { margin-top: 1.5rem; }

.mc-journey-timeline {
    list-style: none;
    margin: 0.75rem 0 0;
    padding: 0;
    position: relative;
}

.mc-journey-timeline::before {
    content: '';
    position: absolute;
    left: 18px;
    top: 6px;
    bottom: 6px;
    width: 2px;
    background: var(--color-border, #e8e4de);
}

.mc-journey-item {
    display: flex;
    align-items: flex-start;
    gap: 0.75rem;
    padding: 0.55rem 0;
    position: relative;
}

.mc-journey-icon {
    width: 38px;
    height: 38px;
    border-radius: 50%;
    background: var(--color-surface, #fff);
    border: 2px solid var(--color-border, #e8e4de);
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1rem;
    flex-shrink: 0;
    position: relative;
    z-index: 1;
}

.mc-journey-body {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: 0.1rem;
    padding-top: 0.35rem;
}

.mc-journey-label {
    font-size: 0.88rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
}

.mc-journey-desc {
    font-size: 0.78rem;
    color: var(--color-text-light, #7a7268);
}

.mc-journey-date {
    font-size: 0.72rem;
    color: var(--color-text-light, #7a7268);
    white-space: nowrap;
    padding-top: 0.4rem;
    flex-shrink: 0;
}

.mc-journey-more {
    font-size: 0.8rem;
    color: var(--color-text-light, #7a7268);
    margin: 0.75rem 0 0;
    padding-left: 1rem;
    font-style: italic;
}

/* ==========================================================================
   MY CORNER — THEMES
   Applied via .mc-theme-{slug} on .my-corner-page.
   Default (no extra class) = Morning Parchment — base styles above cover it.
   ========================================================================== */

/* ---- Theme swatch picker (My Account → Appearance tab) ------------------- */
.mc-theme-picker { margin-top: 0.5rem; }

.mc-theme-group { margin-bottom: 1.8rem; }

.mc-theme-group__label {
    font-size: 0.72rem;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    color: var(--color-text-light, #7a7268);
    margin: 0 0 0.8rem;
}

.mc-theme-swatches { display: flex; flex-wrap: wrap; gap: 0.9rem; }

.mc-theme-swatch {
    background: none;
    border: none;
    padding: 0;
    cursor: pointer;
    text-align: center;
    width: 90px;
}

.mc-theme-swatch__preview {
    display: block;
    width: 90px;
    height: 64px;
    border-radius: var(--radius-md, 8px);
    overflow: hidden;
    border: 2.5px solid var(--color-border, #e2ddd7);
    transition: border-color 0.15s, box-shadow 0.15s;
}

.mc-theme-swatch:hover .mc-theme-swatch__preview {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
}

.mc-theme-swatch.is-active .mc-theme-swatch__preview {
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    box-shadow: 0 0 0 3px rgba(212,165,116,0.28);
}

.mc-theme-swatch__banner {
    display: block;
    height: 42px;
    width: 100%;
}

.mc-theme-swatch__anchor {
    display: block;
    height: 22px;
    width: 100%;
}

.mc-theme-swatch__name {
    display: block;
    font-size: 0.70rem;
    font-weight: 600;
    color: var(--color-text, #2d2a26);
    margin-top: 0.4rem;
    line-height: 1.3;
}

.mc-theme-toast {
    position: fixed;
    bottom: 1.8rem;
    left: 50%;
    transform: translateX(-50%) translateY(12px);
    background: var(--color-text, #2d2a26);
    color: #fff;
    padding: 0.55rem 1.3rem;
    border-radius: 50px;
    font-size: 0.82rem;
    font-weight: 600;
    opacity: 0;
    transition: opacity 0.22s, transform 0.22s;
    pointer-events: none;
    z-index: 9999;
    white-space: nowrap;
}

.mc-theme-toast.is-visible {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
}

/* =========================================================================
   Per-theme accent colour — inherited by ALL descendant elements.
   Adding a new theme? Set --theme-accent here; most accents follow automatically.
   ========================================================================= */
.mc-theme-morning-parchment { --theme-accent: #c9973a; }
.mc-theme-temple-clay       { --theme-accent: #b86030; }
.mc-theme-sacred-grove      { --theme-accent: #5a8a48; }
.mc-theme-sandalwood-night  { --theme-accent: #c49563; }
.mc-theme-sacred-fire       { --theme-accent: #c84a28; }
.mc-theme-forest-dusk       { --theme-accent: #5a8a48; }
.mc-theme-portal            { --theme-accent: var(--color-primary, #d4a574); }

/* =========================================================================
   THEME 2 — Temple Clay
   ========================================================================= */
.mc-theme-temple-clay .corner-welcome {
    background: linear-gradient(135deg, #7a3a18 0%, #b86030 100%);
}
.mc-theme-temple-clay .mc-welcome-banner {
    background: linear-gradient(135deg, #3d1a0a 0%, #7a3a18 50%, #b86030 100%);
}
.mc-theme-temple-clay .corner-widget--anchor {
    background: linear-gradient(135deg, #f0d4c0 0%, #e8c4a8 100%);
    color: var(--color-text, #2d2a26);
    border-color: #d4a070;
}
.mc-theme-temple-clay .corner-widget--anchor .corner-widget__label { color: var(--color-text-light, #7a7268); }
.mc-theme-temple-clay .mc-anchor-text   { color: var(--color-text, #2d2a26); }
.mc-theme-temple-clay .mc-anchor-author { opacity: 0.6; }
.mc-theme-temple-clay .anchor-quote {
    background: linear-gradient(135deg, #f0d4c0 0%, #e8c4a8 100%);
    color: var(--color-text, #2d2a26);
}
.mc-theme-temple-clay .anchor-quote__mark   { color: rgba(122,58,24,0.18); }
.mc-theme-temple-clay .anchor-quote__author { opacity: 0.6; }
.mc-theme-temple-clay .account-tab.is-active                       { color: #b86030; border-bottom-color: #b86030; }
.mc-theme-temple-clay .mc-tab-count                                 { background: #b86030; }
.mc-theme-temple-clay .account-tab.is-active .mc-tab-count         { background: rgba(184,96,48,0.14); color: #b86030; }
.mc-theme-temple-clay .mc-tradition-widget                          { border-left-color: #b86030; }
.mc-theme-temple-clay .mc-tradition-widget__label                   { color: #b86030; }
.mc-theme-temple-clay .mc-tradition-widget__link                    { color: #b86030; border-color: #b86030; }
.mc-theme-temple-clay .mc-tradition-widget__link:hover              { background: #b86030; color: #fff; }
.mc-theme-temple-clay .corner-widget__link                          { color: #b86030; }
.mc-theme-temple-clay .mc-block-header__more                        { color: #b86030; }

/* =========================================================================
   THEME 3 — Sacred Grove
   ========================================================================= */
.mc-theme-sacred-grove .corner-welcome {
    background: linear-gradient(135deg, #3a5830 0%, #6a9a58 100%);
}
.mc-theme-sacred-grove .mc-welcome-banner {
    background: linear-gradient(135deg, #1a2a18 0%, #3a5830 50%, #6a9a58 100%);
}
.mc-theme-sacred-grove .corner-widget--anchor {
    background: linear-gradient(135deg, #e5ecd8 0%, #d2dfc0 100%);
    color: var(--color-text, #2d2a26);
    border-color: #b0c8a0;
}
.mc-theme-sacred-grove .corner-widget--anchor .corner-widget__label { color: var(--color-text-light, #7a7268); }
.mc-theme-sacred-grove .mc-anchor-text   { color: var(--color-text, #2d2a26); }
.mc-theme-sacred-grove .mc-anchor-author { opacity: 0.6; }
.mc-theme-sacred-grove .anchor-quote {
    background: linear-gradient(135deg, #e5ecd8 0%, #d2dfc0 100%);
    color: var(--color-text, #2d2a26);
}
.mc-theme-sacred-grove .anchor-quote__mark   { color: rgba(58,88,48,0.18); }
.mc-theme-sacred-grove .anchor-quote__author { opacity: 0.6; }
.mc-theme-sacred-grove .account-tab.is-active                       { color: #567a45; border-bottom-color: #567a45; }
.mc-theme-sacred-grove .mc-tab-count                                 { background: #567a45; }
.mc-theme-sacred-grove .account-tab.is-active .mc-tab-count         { background: rgba(86,122,69,0.14); color: #567a45; }
.mc-theme-sacred-grove .mc-tradition-widget                          { border-left-color: #567a45; }
.mc-theme-sacred-grove .mc-tradition-widget__label                   { color: #567a45; }
.mc-theme-sacred-grove .mc-tradition-widget__link                    { color: #567a45; border-color: #567a45; }
.mc-theme-sacred-grove .mc-tradition-widget__link:hover              { background: #567a45; color: #fff; }
.mc-theme-sacred-grove .corner-widget__link                          { color: #567a45; }
.mc-theme-sacred-grove .mc-block-header__more                        { color: #567a45; }

/* =========================================================================
   THEME 4 — Sandalwood Night  (dark)
   ========================================================================= */
.mc-theme-sandalwood-night .corner-welcome {
    background: linear-gradient(135deg, #1f0f08 0%, #4a2810 100%);
}
.mc-theme-sandalwood-night .mc-welcome-banner {
    background: linear-gradient(135deg, #120804 0%, #2d1a0e 50%, #5c3212 100%);
}
.mc-theme-sandalwood-night .corner-widget--anchor {
    background: linear-gradient(135deg, #2d1a0e 0%, #5c3212 100%);
    color: #fff;
    border-color: transparent;
}
.mc-theme-sandalwood-night .corner-widget--anchor .corner-widget__label { color: rgba(255,255,255,0.6); }
.mc-theme-sandalwood-night .mc-anchor-text  { color: #fff; }
.mc-theme-sandalwood-night .anchor-quote {
    background: linear-gradient(135deg, #2d1a0e 0%, #5c3212 100%);
    color: #fff;
}
.mc-theme-sandalwood-night .anchor-quote__mark  { color: rgba(255,255,255,0.15); }
.mc-theme-sandalwood-night .anchor-quote__author { opacity: 0.7; }
.mc-theme-sandalwood-night .account-tab.is-active                   { color: #d4a574; border-bottom-color: #d4a574; }
.mc-theme-sandalwood-night .mc-tab-count                             { background: #d4a574; }
.mc-theme-sandalwood-night .account-tab.is-active .mc-tab-count     { background: rgba(212,165,116,0.15); color: #d4a574; }
.mc-theme-sandalwood-night .mc-tradition-widget                      { border-left-color: #d4a574; }
.mc-theme-sandalwood-night .mc-tradition-widget__label               { color: #d4a574; }
.mc-theme-sandalwood-night .mc-tradition-widget__link                { color: #d4a574; border-color: #d4a574; }
.mc-theme-sandalwood-night .mc-tradition-widget__link:hover          { background: #d4a574; color: #fff; }
.mc-theme-sandalwood-night .corner-widget__link                      { color: #d4a574; }
.mc-theme-sandalwood-night .mc-block-header__more                    { color: #d4a574; }

/* =========================================================================
   THEME 5 — Sacred Fire  (dark)
   ========================================================================= */
.mc-theme-sacred-fire .corner-welcome {
    background: linear-gradient(135deg, #2d0e0a 0%, #6e2414 100%);
}
.mc-theme-sacred-fire .mc-welcome-banner {
    background: linear-gradient(135deg, #1a0806 0%, #2d0e0a 50%, #6e2414 100%);
}
.mc-theme-sacred-fire .corner-widget--anchor {
    background: linear-gradient(135deg, #2d0e0a 0%, #6e2414 100%);
    color: #fff;
    border-color: transparent;
}
.mc-theme-sacred-fire .corner-widget--anchor .corner-widget__label { color: rgba(255,255,255,0.6); }
.mc-theme-sacred-fire .mc-anchor-text  { color: #fff; }
.mc-theme-sacred-fire .anchor-quote {
    background: linear-gradient(135deg, #2d0e0a 0%, #6e2414 100%);
    color: #fff;
}
.mc-theme-sacred-fire .anchor-quote__mark  { color: rgba(255,255,255,0.15); }
.mc-theme-sacred-fire .anchor-quote__author { opacity: 0.7; }
.mc-theme-sacred-fire .account-tab.is-active                   { color: #c84a28; border-bottom-color: #c84a28; }
.mc-theme-sacred-fire .mc-tab-count                             { background: #c84a28; }
.mc-theme-sacred-fire .account-tab.is-active .mc-tab-count     { background: rgba(200,74,40,0.14); color: #c84a28; }
.mc-theme-sacred-fire .mc-tradition-widget                      { border-left-color: #c84a28; }
.mc-theme-sacred-fire .mc-tradition-widget__label               { color: #c84a28; }
.mc-theme-sacred-fire .mc-tradition-widget__link                { color: #c84a28; border-color: #c84a28; }
.mc-theme-sacred-fire .mc-tradition-widget__link:hover          { background: #c84a28; color: #fff; }
.mc-theme-sacred-fire .corner-widget__link                      { color: #c84a28; }
.mc-theme-sacred-fire .mc-block-header__more                    { color: #c84a28; }

/* =========================================================================
   THEME 6 — Forest Dusk  (dark)
   ========================================================================= */
.mc-theme-forest-dusk .corner-welcome {
    background: linear-gradient(135deg, #0e1a0e 0%, #2a4528 100%);
}
.mc-theme-forest-dusk .mc-welcome-banner {
    background: linear-gradient(135deg, #080e08 0%, #1a2a1a 50%, #2a4528 100%);
}
.mc-theme-forest-dusk .corner-widget--anchor {
    background: linear-gradient(135deg, #1a2a1a 0%, #2a4528 100%);
    color: #fff;
    border-color: transparent;
}
.mc-theme-forest-dusk .corner-widget--anchor .corner-widget__label { color: rgba(255,255,255,0.6); }
.mc-theme-forest-dusk .mc-anchor-text  { color: #fff; }
.mc-theme-forest-dusk .anchor-quote {
    background: linear-gradient(135deg, #1a2a1a 0%, #2a4528 100%);
    color: #fff;
}
.mc-theme-forest-dusk .anchor-quote__mark  { color: rgba(255,255,255,0.15); }
.mc-theme-forest-dusk .anchor-quote__author { opacity: 0.7; }
.mc-theme-forest-dusk .account-tab.is-active                   { color: #5a8a48; border-bottom-color: #5a8a48; }
.mc-theme-forest-dusk .mc-tab-count                             { background: #5a8a48; }
.mc-theme-forest-dusk .account-tab.is-active .mc-tab-count     { background: rgba(90,138,72,0.14); color: #5a8a48; }
.mc-theme-forest-dusk .mc-tradition-widget                      { border-left-color: #5a8a48; }
.mc-theme-forest-dusk .mc-tradition-widget__label               { color: #5a8a48; }
.mc-theme-forest-dusk .mc-tradition-widget__link                { color: #5a8a48; border-color: #5a8a48; }
.mc-theme-forest-dusk .mc-tradition-widget__link:hover          { background: #5a8a48; color: #fff; }
.mc-theme-forest-dusk .corner-widget__link                      { color: #5a8a48; }
.mc-theme-forest-dusk .mc-block-header__more                    { color: #5a8a48; }

/* ─── Dark Themes: belt-and-suspenders white text for banner zones ──────────
   The base .corner-welcome { color: #fff } should cascade, but explicitly
   setting white on every dark-theme banner zone guarantees Astra specificity
   cannot override it, and protects against child elements with own color rules.
   ─────────────────────────────────────────────────────────────────────────── */
.mc-theme-sandalwood-night .corner-welcome,
.mc-theme-sacred-fire .corner-welcome,
.mc-theme-forest-dusk .corner-welcome                { color: #fff; }

.mc-theme-sandalwood-night .mc-welcome-banner,
.mc-theme-sacred-fire .mc-welcome-banner,
.mc-theme-forest-dusk .mc-welcome-banner             { color: #fff; }

.mc-theme-sandalwood-night .mc-welcome-banner__eyebrow,
.mc-theme-sacred-fire .mc-welcome-banner__eyebrow,
.mc-theme-forest-dusk .mc-welcome-banner__eyebrow    { color: rgba(255,255,255,0.65); }

.mc-theme-sandalwood-night .mc-welcome-banner__name,
.mc-theme-sacred-fire .mc-welcome-banner__name,
.mc-theme-forest-dusk .mc-welcome-banner__name       { color: #fff; }

.mc-theme-sandalwood-night .mc-welcome-banner__quote,
.mc-theme-sacred-fire .mc-welcome-banner__quote,
.mc-theme-forest-dusk .mc-welcome-banner__quote      { color: rgba(255,255,255,0.75); }

.mc-theme-sandalwood-night .mc-welcome-dismiss,
.mc-theme-sacred-fire .mc-welcome-dismiss,
.mc-theme-forest-dusk .mc-welcome-dismiss            { color: rgba(255,255,255,0.5); }

/* =========================================================================
   THEME 7 — Portal  (light — mirrors the portal's own warm-white look)
   ========================================================================= */
.mc-theme-portal .corner-welcome {
    background: linear-gradient(135deg, #f5ede0 0%, #fdf6ec 100%);
    color: var(--color-text, #2d2a26);
    border-bottom: 1px solid rgba(212,165,116,0.25);
}
.mc-theme-portal .corner-welcome__greeting { color: var(--color-text, #2d2a26); }
.mc-theme-portal .corner-welcome__date     { color: var(--color-text-light, #7a7268); opacity: 1; }
.mc-theme-portal .corner-settings-link {
    border-color: rgba(212,165,116,0.50);
    color: var(--theme-accent, var(--color-primary, #d4a574));
}
.mc-theme-portal .corner-settings-link:hover {
    background: rgba(212,165,116,0.12);
    border-color: var(--theme-accent, var(--color-primary, #d4a574));
    color: var(--color-text, #2d2a26);
}
.mc-theme-portal .mc-welcome-banner {
    background: linear-gradient(135deg, #f0e8d8 0%, #e8d4b0 50%, #f5ede0 100%);
    color: var(--color-text, #2d2a26);
}
.mc-theme-portal .mc-welcome-banner__eyebrow { color: var(--color-text-light, #7a7268); opacity: 1; }
.mc-theme-portal .mc-welcome-banner__name    { color: var(--color-text, #2d2a26); }
.mc-theme-portal .mc-welcome-banner__quote   { color: var(--color-text-light, #7a7268); }
.mc-theme-portal .mc-welcome-tradition-tag   { background: rgba(212,165,116,0.15); border-color: rgba(212,165,116,0.30); color: var(--color-text, #2d2a26); }
.mc-theme-portal .mc-welcome-dismiss         { color: var(--color-text-light, #7a7268); opacity: 1; }
.mc-theme-portal .corner-widget--anchor {
    background: linear-gradient(135deg, #f3dca8 0%, #e8c97a 100%);
    color: var(--color-text, #2d2a26);
    border-color: rgba(212,165,116,0.40);
}
.mc-theme-portal .corner-widget--anchor .corner-widget__label { color: #8a6020; }
.mc-theme-portal .mc-anchor-text  { color: var(--color-text, #2d2a26); }
.mc-theme-portal .anchor-quote {
    background: linear-gradient(135deg, #f3dca8 0%, #e8c97a 100%);
    color: var(--color-text, #2d2a26);
}
.mc-theme-portal .anchor-quote__mark   { color: rgba(139,90,42,0.15); }
.mc-theme-portal .anchor-quote__author { color: var(--color-text-light, #7a7268); opacity: 1; }
.mc-theme-portal .account-tab.is-active                   { color: var(--theme-accent, var(--color-primary, #d4a574)); border-bottom-color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-theme-portal .mc-tab-count                             { background: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-theme-portal .account-tab.is-active .mc-tab-count     { background: rgba(212,165,116,0.14); color: #8a6020; }
.mc-theme-portal .mc-tradition-widget                      { border-left-color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-theme-portal .mc-tradition-widget__label               { color: #8a6020; }
.mc-theme-portal .mc-tradition-widget__link                { color: var(--theme-accent, var(--color-primary, #d4a574)); border-color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-theme-portal .mc-tradition-widget__link:hover          { background: var(--theme-accent, var(--color-primary, #d4a574)); color: #fff; }
.mc-theme-portal .corner-widget__link                      { color: var(--theme-accent, var(--color-primary, #d4a574)); }
.mc-theme-portal .mc-block-header__more                    { color: var(--theme-accent, var(--color-primary, #d4a574)); }

/* =========================================================================
   My Corner sub-pages — Journal / Profile-Settings header
   .resource-category-header sits inside .journal-page.mc-theme-X, so these
   rules only fire on the journal (other resource pages carry no theme class).
   Same gradients as account-header / corner-welcome for full consistency.
   ========================================================================= */

/* Explicit white text on the journal header — beats Astra's h1/p rules */
.mc-theme-morning-parchment .resource-category-header .category-header-title,
.mc-theme-temple-clay       .resource-category-header .category-header-title,
.mc-theme-sacred-grove      .resource-category-header .category-header-title,
.mc-theme-sandalwood-night  .resource-category-header .category-header-title,
.mc-theme-sacred-fire       .resource-category-header .category-header-title,
.mc-theme-forest-dusk       .resource-category-header .category-header-title { color: #fff; }

.mc-theme-morning-parchment .resource-category-header .category-header-subtitle,
.mc-theme-temple-clay       .resource-category-header .category-header-subtitle,
.mc-theme-sacred-grove      .resource-category-header .category-header-subtitle,
.mc-theme-sandalwood-night  .resource-category-header .category-header-subtitle,
.mc-theme-sacred-fire       .resource-category-header .category-header-subtitle,
.mc-theme-forest-dusk       .resource-category-header .category-header-subtitle { color: rgba(255,255,255,0.75); }

.mc-theme-morning-parchment .resource-category-header .back-link,
.mc-theme-temple-clay       .resource-category-header .back-link,
.mc-theme-sacred-grove      .resource-category-header .back-link,
.mc-theme-sandalwood-night  .resource-category-header .back-link,
.mc-theme-sacred-fire       .resource-category-header .back-link,
.mc-theme-forest-dusk       .resource-category-header .back-link { color: rgba(255,255,255,0.7); }

/* Per-theme backgrounds for the journal header */
.mc-theme-morning-parchment .resource-category-header { background: linear-gradient(135deg,#8b5a2a 0%,#c49563 100%); border-bottom-color: rgba(139,90,42,0.4); }
.mc-theme-temple-clay       .resource-category-header { background: linear-gradient(135deg,#7a3a18 0%,#b86030 100%); border-bottom-color: rgba(122,58,24,0.4); }
.mc-theme-sacred-grove      .resource-category-header { background: linear-gradient(135deg,#3a5830 0%,#6a9a58 100%); border-bottom-color: rgba(58,88,48,0.4); }
.mc-theme-sandalwood-night  .resource-category-header { background: linear-gradient(135deg,#1f0f08 0%,#4a2810 100%); border-bottom-color: rgba(31,15,8,0.6); }
.mc-theme-sacred-fire       .resource-category-header { background: linear-gradient(135deg,#2d0e0a 0%,#6e2414 100%); border-bottom-color: rgba(45,14,10,0.6); }
.mc-theme-forest-dusk       .resource-category-header { background: linear-gradient(135deg,#0e1a0e 0%,#2a4528 100%); border-bottom-color: rgba(14,26,14,0.6); }

/* Portal: light header with dark text */
.mc-theme-portal .resource-category-header                              { background: linear-gradient(135deg,#f5ede0 0%,#fdf6ec 100%); border-bottom-color: rgba(212,165,116,0.3); }
.mc-theme-portal .resource-category-header .category-header-title      { color: var(--color-text,#2d2a26); }
.mc-theme-portal .resource-category-header .category-header-subtitle   { color: var(--color-text-light,#7a7268); }
.mc-theme-portal .resource-category-header .back-link                  { color: var(--color-primary,#d4a574); }

