/* ─── Theme Variables ──────────────────────────────────────────────────────── */
:root {
    --bg-color: #fdfcf8; --text-color: #2c3e50; --card-bg: #ffffff;
    --border-color: #dcdde1; --input-bg: #ffffff; --read-bg: #f5f6fa;
    --accent-color: #4a69bd; --accent-hover: #1e3799;
    --success-color: #27ae60; --success-hover: #219150;
    --secondary-color: #34495e; --secondary-hover: #2c3e50;
    --info-color: #3498db; --danger-color: #e74c3c; --danger-hover: #c0392b;
    --focus-color: #8e44ad; --focus-hover: #732d91;
    --warning-color: #f39c12; --sheets-color: #217346; --sheets-hover: #165030;
}
:root[data-theme="light-red"]    { --bg-color:#fff5f5;--text-color:#2d3436;--card-bg:#ffffff;--border-color:#f1dddd;--input-bg:#ffffff;--read-bg:#fce8e8; }
:root[data-theme="powder-blue"]  { --bg-color:#f0f8ff;--text-color:#2c3e50;--card-bg:#ffffff;--border-color:#d1e5f5;--input-bg:#ffffff;--read-bg:#e1effc; }
:root[data-theme="light-yellow"] { --bg-color:#fcf8e3;--text-color:#3e3124;--card-bg:#ffffff;--border-color:#e8dfc3;--input-bg:#ffffff;--read-bg:#f2ebd9; }
:root[data-theme="dark"]         { --bg-color:#121212;--text-color:#d4d4d4;--card-bg:#1e1e1e;--border-color:#333333;--input-bg:#2a2a2a;--read-bg:#181818;--accent-color:#5b7cda; }

/* ─── Base ─────────────────────────────────────────────────────────────────── */
html, body { min-height:100vh; margin:0; padding:0; background-color:var(--bg-color); color:var(--text-color); font-family:'Glober',sans-serif; transition:background-color .3s ease,color .3s ease; }
h1,h2,h3,h4,h5,h6 { font-family:'Futura',sans-serif; font-weight:500; }

.main-wrapper { max-width:1400px; margin:0 auto; padding:30px 20px; line-height:1.6; }

/* ─── Header ───────────────────────────────────────────────────────────────── */
.header-controls {
    display:flex; justify-content:space-between; align-items:flex-end;
    margin-bottom:20px; flex-wrap:wrap; gap:15px;
    border-bottom:2px solid var(--border-color); padding-bottom:15px;
}
.brand-container { display:flex; flex-direction:column; }
.brand-title { margin:0; font-size:2.5rem; color:var(--accent-color); letter-spacing:-.5px; display:flex; align-items:baseline; gap:12px; font-weight:bold; flex-wrap:wrap; }
.brand-subtitle { font-size:1.1rem; color:var(--text-color); font-weight:400; font-style:italic; opacity:.85; font-family:'Glober',sans-serif; }
.brand-tagline { font-size:1rem; color:#7f8fa6; font-style:italic; margin-top:4px; letter-spacing:.5px; font-family:'Glober',sans-serif; }

.action-buttons { display:flex; gap:10px; align-items:center; flex-wrap:wrap; justify-content:flex-end; }
.btn, button, input, textarea, select { font-family:'Glober',sans-serif; }
.btn { color:white; border:none; padding:10px 15px; font-size:.9rem; font-weight:bold; border-radius:5px; cursor:pointer; transition:all .3s ease; }

/* ─── Auth UI ──────────────────────────────────────────────────────────────── */
.auth-section { display:flex; align-items:center; gap:10px; }

#user-info {
    display:none; align-items:center; gap:8px;
    background:var(--read-bg); padding:5px 12px; border-radius:20px;
    border:1px solid var(--border-color); font-size:.85rem;
}
#user-avatar { width:26px; height:26px; border-radius:50%; object-fit:cover; }
#user-name   { font-weight:bold; color:var(--text-color); }

#sync-status { display:none; font-size:.72rem; padding:3px 8px; border-radius:10px; font-weight:bold; }
.sync-syncing { background:#fff3cd; color:#856404; }
.sync-synced  { background:#d4edda; color:#155724; }
.sync-local   { background:#e2e3e5; color:#383d41; }
.sync-error   { background:#f8d7da; color:#721c24; }

.sign-in-btn {
    background:white !important; color:#3c4043 !important;
    border:1px solid #dadce0 !important;
    display:flex; align-items:center; gap:8px;
    font-family:'Google Sans','Futura',sans-serif;
    box-shadow:0 1px 2px rgba(0,0,0,.1);
}
.sign-in-btn:hover { background:#f8f8f8 !important; box-shadow:0 1px 4px rgba(0,0,0,.2); }
.sign-out-btn { background-color:#95a5a6 !important; }
.sign-out-btn:hover { background-color:#7f8c8d !important; }

.google-g {
    display:inline-flex; align-items:center; justify-content:center;
    width:18px; height:18px; border-radius:50%;
    background:linear-gradient(135deg,#4285F4 25%,#34A853 25%,#34A853 50%,#FBBC05 50%,#FBBC05 75%,#EA4335 75%);
    color:white; font-size:.7rem; font-weight:900; font-family:Arial,sans-serif;
    flex-shrink:0;
}

/* ─── Buttons ──────────────────────────────────────────────────────────────── */
.export-btn { background-color:var(--success-color); }
.export-btn:hover { background-color:var(--success-hover); }
.import-btn { background-color:var(--secondary-color); }
.import-btn:hover { background-color:var(--secondary-hover); }
.fullscreen-btn { background-color:var(--focus-color); }
.fullscreen-btn:hover { background-color:var(--focus-hover); }

.fs-scrolled {
    position:fixed !important; bottom:30px; left:30px; padding:8px 15px !important;
    font-size:.8rem !important; border-radius:50px !important;
    box-shadow:0 4px 15px rgba(0,0,0,.3); z-index:10000; opacity:.9;
}
.fs-scrolled:hover { opacity:1; transform:scale(1.05); }

.info-btn {
    background-color:var(--secondary-color); color:white; border:none;
    width:32px; height:32px; border-radius:50%; font-size:1rem; font-weight:bold;
    font-family:'Futura',sans-serif; cursor:pointer;
    display:flex; align-items:center; justify-content:center; transition:all .3s; padding:0;
}
.info-btn:hover { background-color:var(--secondary-hover); transform:scale(1.1); }

.theme-select {
    padding:8px; border-radius:5px; border:1px solid var(--border-color);
    background-color:var(--input-bg); color:var(--text-color); cursor:pointer; font-family:'Glober',sans-serif;
}

/* ─── Search & Filters ─────────────────────────────────────────────────────── */
.search-filter-row { display:flex; gap:10px; margin-bottom:25px; flex-wrap:wrap; align-items:flex-start; }
.search-bar { flex-grow:1; padding:12px 15px; font-size:1.1rem; border:2px solid var(--accent-color); height:fit-content; border-radius:8px; background-color:var(--input-bg); color:var(--text-color); }
.filter-btn { background-color:transparent; color:var(--accent-color); border:2px solid var(--accent-color); padding:10px 15px; height:fit-content; font-family:'Futura',sans-serif; font-weight:bold; border-radius:8px; cursor:pointer; white-space:nowrap; transition:all .3s; }
.filter-btn.active { background-color:var(--accent-color); color:white; }
.export-sheets-btn { background-color:var(--sheets-color); font-size:.85rem; padding:8px 15px; font-family:'Futura',sans-serif; }
.export-sheets-btn:hover { background-color:var(--sheets-hover); }

/* ─── Tabs ─────────────────────────────────────────────────────────────────── */
.tabs-section { margin-bottom:20px; border-bottom:2px solid var(--border-color); padding-bottom:15px; }
.tabs { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:15px; }
.tab { padding:8px 16px; background-color:transparent; color:var(--text-color); border:1px solid var(--border-color); border-radius:6px; cursor:pointer; font-family:'Futura',sans-serif; font-size:1rem; }
.tab.active { background-color:var(--accent-color); color:white; border-color:var(--accent-color); }
.add-subject-container { display:flex; gap:10px; align-items:center; flex-wrap:wrap; }
.add-subject-container input { padding:8px 12px; border:1px solid var(--border-color); border-radius:5px; background-color:var(--input-bg); color:var(--text-color); width:250px; }
.add-subject-btn { background-color:var(--info-color); font-family:'Futura',sans-serif; }
.delete-subject-btn { background-color:var(--danger-color); font-family:'Futura',sans-serif; margin-left:auto; }
.delete-subject-btn:hover { background-color:var(--danger-hover); }

/* ─── Form ─────────────────────────────────────────────────────────────────── */
.form-container { background:var(--card-bg); padding:25px; border:1px solid var(--border-color); border-radius:8px; margin-bottom:30px; box-shadow:0 4px 6px rgba(0,0,0,.02); transition:all .3s ease; }
.form-tip { background-color:var(--read-bg); padding:12px 15px; border-left:4px solid var(--accent-color); border-radius:4px; font-size:.95rem; margin-bottom:20px; color:var(--text-color); }
.form-group { margin-bottom:15px; }
label { display:block; margin-bottom:5px; font-weight:bold; font-size:.9rem; font-family:'Futura',sans-serif; }
input[type="text"], textarea, select { width:100%; padding:10px; border:1px solid var(--border-color); border-radius:5px; font-size:1rem; box-sizing:border-box; background-color:var(--input-bg); color:var(--text-color); transition:min-height .2s ease-out; }
textarea { resize:vertical; min-height:80px; }
.submit-btn { background-color:var(--accent-color); color:white; border:none; padding:10px 20px; font-family:'Futura',sans-serif; font-size:1rem; border-radius:5px; cursor:pointer; width:100%; margin-top:10px; }
.submit-btn:hover { background-color:var(--accent-hover); }
.word-warning { font-size:.75rem; color:var(--warning-color); font-style:italic; margin-top:4px; display:none; animation:fadeIn .3s ease-in-out; font-family:'Glober',sans-serif; }
@keyframes fadeIn { from { opacity:0; transform:translateY(-3px); } to { opacity:1; transform:translateY(0); } }

/* Compact mode */
.form-container.compact-mode { padding:10px 15px; margin-bottom:15px; border:1px dashed var(--border-color); box-shadow:none; }
.form-container.compact-mode h2 { font-size:1rem; margin-top:0; margin-bottom:8px; color:var(--text-color); }
.form-container.compact-mode .form-tip { display:none; }
.form-container.compact-mode form { display:grid; grid-template-columns:repeat(4,1fr); gap:6px; }
.form-container.compact-mode .form-group { margin-bottom:0; }
.form-container.compact-mode label { display:none; }
.form-container.compact-mode .fg-subject  { grid-column:1/2; }
.form-container.compact-mode .fg-title    { grid-column:2/4; }
.form-container.compact-mode .fg-ponente  { grid-column:4/5; }
.form-container.compact-mode .fg-doctrine { grid-column:1/2; }
.form-container.compact-mode .fg-facts    { grid-column:2/3; }
.form-container.compact-mode .fg-issues   { grid-column:3/4; }
.form-container.compact-mode .fg-ruling   { grid-column:4/5; }
.form-container.compact-mode .full-width-btn { grid-column:1/-1; }
.form-container.compact-mode input[type="text"], .form-container.compact-mode select { padding:6px 8px; font-size:.85rem; }
.form-container.compact-mode textarea { min-height:32px; height:32px; padding:6px 8px; font-size:.85rem; overflow:hidden; }
.form-container.compact-mode textarea:focus { min-height:150px; overflow:auto; }
.form-container.compact-mode .submit-btn { padding:6px; font-size:.9rem; margin-top:2px; }

/* ─── Cases Table ──────────────────────────────────────────────────────────── */
#cases-container { margin-top:15px; transition:all .3s; }
.table-responsive { width:100%; overflow-x:auto; background:var(--card-bg); border:1px solid var(--border-color); border-radius:8px; box-shadow:0 4px 6px rgba(0,0,0,.02); }
.cases-table { width:100%; border-collapse:collapse; font-size:.9rem; min-width:1000px; }
.cases-table th, .cases-table td { padding:12px 15px; border-bottom:1px solid var(--border-color); border-right:1px solid var(--border-color); text-align:left; vertical-align:top; }
.cases-table th:last-child, .cases-table td:last-child { border-right:none; }
.cases-table th { background-color:var(--read-bg); color:var(--accent-color); font-family:'Futura',sans-serif; font-weight:bold; text-transform:uppercase; letter-spacing:.5px; position:sticky; top:0; z-index:5; }
.cases-table tr { transition:background-color .2s,border-top .2s; }
.cases-table tr:hover { background-color:var(--read-bg); }
.cases-table tr.read { opacity:.55; background-color:var(--bg-color); }
.cases-table tr.read:hover { background-color:var(--border-color); }

.cases-table tr.editing-row { background-color:var(--read-bg); box-shadow:inset 0 0 0 2px var(--accent-color); opacity:1; }
.cases-table input[type="text"].inline-input, .cases-table textarea.inline-input, .cases-table select.inline-input { width:100%; padding:8px; font-size:.85rem; border:1px solid var(--accent-color); border-radius:4px; background-color:var(--bg-color); color:var(--text-color); box-sizing:border-box; font-family:'Glober',sans-serif; margin-bottom:2px; }
.cases-table textarea.inline-input { min-height:100px; resize:vertical; }

.drag-handle { cursor:grab; color:var(--border-color); text-align:center; vertical-align:middle; font-size:1.2rem; user-select:none; transition:color .2s; }
.cases-table tr:hover .drag-handle { color:var(--accent-color); }
.drag-handle:active { cursor:grabbing; }
.case-subject-badge { display:inline-block; background-color:var(--border-color); color:var(--text-color); padding:3px 6px; border-radius:4px; font-size:.7rem; margin-top:5px; font-weight:bold; text-transform:uppercase; }
.pending-text { color:#7f8fa6; font-style:italic; opacity:.7; }

.card-actions { display:flex; flex-direction:column; gap:8px; }
.card-actions button { border:none; padding:6px 10px; border-radius:4px; cursor:pointer; font-size:.8rem; color:white; width:100%; font-family:'Futura',sans-serif; }
.read-btn   { background:var(--success-color); }
.edit-btn   { background:var(--info-color); }
.delete-btn { background:var(--danger-color); }

/* ─── Review Mode ──────────────────────────────────────────────────────────── */
.cell-content { transition:all .3s ease; position:relative; width:100%; height:100%; }
.review-active tr:not(.revealed-case) .hideable-td { cursor:pointer; position:relative; }
.review-active tr:not(.revealed-case) .hideable-td .cell-content { filter:blur(6px); opacity:.25; user-select:none; pointer-events:none; }
.review-active tr:not(.revealed-case) .hideable-td:hover .cell-content { filter:blur(4px); opacity:.4; }
.review-active tr:not(.revealed-case) .hideable-td::after { content:'Click to Reveal Case'; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:var(--accent-color); color:white; padding:4px 8px; border-radius:4px; font-size:.75rem; font-weight:bold; opacity:0; transition:opacity .2s; pointer-events:none; font-family:'Futura',sans-serif; white-space:nowrap; }
.review-active tr:not(.revealed-case) .hideable-td:hover::after { opacity:1; }
.review-active tr.revealed-case .hideable-td .cell-content { filter:blur(0); opacity:1; user-select:auto; pointer-events:auto; }
.review-active tr.revealed-case .hideable-td { cursor:pointer; }
.floating-review-btn { position:fixed; bottom:30px; right:30px; background-color:var(--danger-color); color:white; border:none; padding:15px 25px; border-radius:50px; box-shadow:0 4px 15px rgba(0,0,0,.3); font-family:'Futura',sans-serif; font-weight:bold; font-size:1rem; cursor:pointer; z-index:9000; display:none; transition:transform .2s,background-color .3s; }
.floating-review-btn:hover { transform:scale(1.05); background-color:var(--danger-hover); }

/* ─── Modals ───────────────────────────────────────────────────────────────── */
.modal-overlay { visibility:hidden; opacity:0; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.85); z-index:10001; display:flex; justify-content:center; align-items:center; transition:opacity .3s ease,visibility .3s ease; }
.modal-overlay.active { visibility:visible; opacity:1; }
.modal-content { background:var(--card-bg); padding:35px; border-radius:12px; text-align:center; max-width:450px; border:3px solid var(--accent-color); color:var(--text-color); position:relative; transform:scale(.95); transition:transform .3s ease; }
.modal-overlay.active .modal-content { transform:scale(1); }
.modal-content h3 { color:var(--accent-color); margin-top:0; font-size:1.8rem; margin-bottom:5px; line-height:1.2; }
.modal-content h4 { color:var(--text-color); margin-top:0; font-size:1.1rem; opacity:.8; font-family:'Glober',sans-serif; margin-bottom:20px; }
.modal-content p { font-family:'Glober',sans-serif; line-height:1.6; font-size:1.05rem; }
.welcome-list { text-align:left; padding-left:20px; font-size:.95rem; line-height:1.6; color:var(--text-color); margin-bottom:25px; }
.welcome-list li { margin-bottom:12px; }
.motivational-text { font-style:italic; color:#7f8fa6; margin-bottom:25px; font-size:1.1rem; }
.close-modal-btn { background-color:var(--success-color); color:white; border:none; padding:12px 20px; border-radius:5px; font-family:'Futura',sans-serif; font-size:1.1rem; cursor:pointer; width:100%; font-weight:bold; margin-top:10px; transition:background-color .3s; }
.close-modal-btn:hover { background-color:var(--success-hover); }
.welcome-modal-wrapper, .info-modal-wrapper { max-width:600px; padding:40px; max-height:90vh; overflow-y:auto; }
.info-modal-wrapper { max-width:700px; text-align:left; }
.info-modal-wrapper h4.subhead { color:var(--accent-color); font-family:'Futura',sans-serif; margin-top:25px; margin-bottom:10px; font-size:1.3rem; opacity:1; }

/* ─── Immersive Mode ───────────────────────────────────────────────────────── */
.immersive-card { background:var(--bg-color); width:95%; max-width:1000px; height:90vh; border-radius:12px; display:flex; flex-direction:column; box-shadow:0 15px 40px rgba(0,0,0,.5); position:relative; overflow:hidden; transform:scale(.95); transition:transform .3s ease; }
.modal-overlay.active .immersive-card { transform:scale(1); }
.immersive-header { padding:15px 25px; border-bottom:1px solid var(--border-color); display:flex; justify-content:space-between; align-items:flex-start; background:var(--card-bg); }
.immersive-header-titles { flex-grow:1; padding-right:20px; }
.immersive-case-title { font-family:'Futura',sans-serif; font-size:2.2rem; color:var(--accent-color); margin:0 0 5px 0; line-height:1.2; }
.immersive-ponente { font-style:italic; color:#7f8fa6; margin:0; font-size:1.1rem; }
.immersive-controls { display:flex; gap:10px; align-items:center; }
.immersive-review-btn { background-color:var(--danger-color); padding:8px 12px; font-size:.8rem; }
.immersive-close-btn { background:none; border:none; font-size:2rem; color:#7f8fa6; cursor:pointer; padding:0; line-height:1; transition:color .2s; }
.immersive-close-btn:hover { color:var(--danger-color); }
.immersive-body { flex-grow:1; overflow-y:auto; padding:30px 40px; color:var(--text-color); }
.immersive-section { margin-bottom:35px; }
.immersive-section-title { font-family:'Futura',sans-serif; font-size:1.4rem; margin-bottom:15px; color:var(--text-color); border-bottom:2px solid var(--border-color); padding-bottom:5px; }
.immersive-text-block { font-size:1.15rem; line-height:1.7; }
.immersive-footer { padding:15px 25px; border-top:1px solid var(--border-color); display:flex; justify-content:space-between; background:var(--card-bg); }
.immersive-nav-btn { background-color:var(--info-color); padding:10px 20px; font-size:1rem; }
.immersive-nav-btn:disabled { opacity:.5; cursor:not-allowed; }
.immersive-hideable { position:relative; cursor:pointer; }
.immersive-hideable .immersive-text-block { filter:blur(8px); opacity:.25; user-select:none; pointer-events:none; transition:all .3s ease; }
.immersive-hideable:hover .immersive-text-block { filter:blur(5px); opacity:.4; }
.immersive-hideable::after { content:'Click to Reveal Section'; position:absolute; top:50%; left:50%; transform:translate(-50%,-50%); background:var(--accent-color); color:white; padding:8px 16px; border-radius:4px; font-size:.9rem; font-weight:bold; opacity:0; transition:opacity .2s; pointer-events:none; font-family:'Futura',sans-serif; }
.immersive-hideable:hover::after { opacity:1; }
.immersive-hideable.revealed .immersive-text-block { filter:blur(0); opacity:1; user-select:auto; pointer-events:auto; }
.immersive-hideable.revealed::after { display:none; }
.immersive-hideable.revealed { cursor:default; }

/* ─── Onboarding Splash Screen ─────────────────────────────────────────────── */
#onboarding-screen {
    display: none;
    position: fixed;
    top: 0; left: 0; right: 0; bottom: 0;
    width: 100%; height: 100%;
    z-index: 20000;
    background: var(--bg-color);
    align-items: center; justify-content: center;
    padding: 20px;
    box-sizing: border-box;
    overflow-y: auto;
    animation: onboardingFadeIn .35s ease forwards;
}
#onboarding-screen.active {
    display: flex;
}
#onboarding-screen.hiding {
    animation: onboardingFadeOut .4s ease forwards;
}

@keyframes onboardingFadeIn  { from { opacity:0; } to { opacity:1; } }
@keyframes onboardingFadeOut { from { opacity:1; } to { opacity:0; } }

.onboarding-card {
    background: var(--card-bg);
    border: 2px solid var(--border-color);
    border-radius: 16px;
    padding: 50px 48px;
    max-width: 480px;
    width: 100%;
    text-align: center;
    box-shadow: 0 8px 40px rgba(0,0,0,.08);
    animation: onboardingSlideUp .4s ease forwards;
}
@keyframes onboardingSlideUp {
    from { opacity:0; transform:translateY(24px); }
    to   { opacity:1; transform:translateY(0); }
}

.onboarding-logo {
    display: flex; align-items: baseline; justify-content: center;
    gap: 10px; margin-bottom: 6px; flex-wrap: wrap;
}
.onboarding-logo-main {
    font-family: 'Futura', sans-serif;
    font-size: 2.4rem; font-weight: bold;
    color: var(--accent-color); letter-spacing: -.5px;
}
.onboarding-logo-sub {
    font-family: 'Glober', sans-serif;
    font-size: 1.1rem; font-style: italic;
    color: var(--text-color); opacity: .75;
}
.onboarding-tagline {
    font-size: .95rem; color: #7f8fa6;
    font-style: italic; margin: 0 0 32px;
    font-family: 'Glober', sans-serif;
}

.onboarding-features {
    display: flex; flex-direction: column; gap: 12px;
    text-align: left; margin-bottom: 36px;
}
.onboarding-feature {
    display: flex; align-items: flex-start; gap: 12px;
    font-size: .95rem; color: var(--text-color);
    font-family: 'Glober', sans-serif; line-height: 1.4;
}
.onboarding-feature-icon {
    font-size: 1.15rem; flex-shrink: 0; margin-top: 1px;
}

.onboarding-actions {
    display: flex; flex-direction: column; gap: 12px;
    margin-bottom: 20px;
}

.onboarding-google-btn {
    display: flex; align-items: center; justify-content: center; gap: 10px;
    background: white; color: #3c4043;
    border: 1px solid #dadce0;
    padding: 13px 20px; border-radius: 8px;
    font-size: 1rem; font-weight: 600;
    font-family: 'Google Sans', 'Futura', sans-serif;
    cursor: pointer; width: 100%;
    box-shadow: 0 1px 3px rgba(0,0,0,.12);
    transition: box-shadow .2s, background .2s;
    box-sizing: border-box;
}
.onboarding-google-btn:hover {
    background: #f8f9fa;
    box-shadow: 0 2px 8px rgba(0,0,0,.18);
}
.google-logo-svg {
    width: 20px !important;
    height: 20px !important;
    min-width: 20px;
    flex-shrink: 0;
    display: block;
}

.onboarding-offline-btn {
    background: transparent; color: var(--accent-color);
    border: 2px solid var(--accent-color);
    padding: 12px 20px; border-radius: 8px;
    font-size: .95rem; font-weight: bold;
    font-family: 'Futura', sans-serif;
    cursor: pointer; width: 100%;
    transition: background .2s, color .2s;
    box-sizing: border-box;
}
.onboarding-offline-btn:hover {
    background: var(--accent-color); color: white;
}

.onboarding-note {
    font-size: .8rem; color: #7f8fa6; line-height: 1.5;
    margin: 0; font-family: 'Glober', sans-serif;
}

/* ─── Mobile ────────────────────────────────────────────────────────────────── */
@media (max-width:768px) {
    .onboarding-card { padding: 36px 24px; }
    .onboarding-logo-main { font-size: 1.9rem; }
    .brand-title { font-size:2rem; flex-wrap:wrap; }
    .header-controls { flex-direction:column; align-items:stretch; gap:10px; }
    .action-buttons { justify-content:flex-start; }
    .action-buttons > select, .action-buttons > button { flex-grow:1; }
    .auth-section { flex-wrap:wrap; }
    .search-filter-row { flex-direction:column; }
    .search-filter-row > select, .search-filter-row > button { width:100%; }
    .tabs { justify-content:center; }
    .add-subject-container { flex-direction:column; align-items:stretch; }
    .add-subject-container input, .add-subject-container button { width:100%; margin-bottom:5px; }
    .delete-subject-btn { margin-left:0; }
    .form-container.compact-mode form { grid-template-columns:1fr; }
    .form-container.compact-mode .fg-subject, .form-container.compact-mode .fg-title,
    .form-container.compact-mode .fg-ponente, .form-container.compact-mode .fg-doctrine,
    .form-container.compact-mode .fg-facts, .form-container.compact-mode .fg-issues,
    .form-container.compact-mode .fg-ruling, .form-container.compact-mode .full-width-btn { grid-column:1/-1; }
    .cases-table { min-width:100%; display:block; border:none; }
    .cases-table thead { display:none; }
    .cases-table tbody, .cases-table tr { display:block; width:100%; }
    .cases-table tr { margin-bottom:15px; border:2px solid var(--accent-color); border-radius:8px; box-shadow:0 2px 5px rgba(0,0,0,.1); padding:15px; }
    .cases-table td { display:flex; flex-direction:column; border-right:none; border-bottom:1px solid var(--border-color); padding:10px 5px; }
    .cases-table td:last-child { border-bottom:none; }
    .cases-table td::before { content:attr(data-label); font-family:'Futura',sans-serif; font-size:.75rem; color:#7f8fa6; text-transform:uppercase; margin-bottom:5px; }
    .drag-handle { display:none !important; }
    .card-actions { flex-direction:row; flex-wrap:wrap; }
    .card-actions button { width:calc(33% - 5px); }
    .fs-scrolled { bottom:15px; left:15px; padding:10px; font-size:.75rem !important; }
    .floating-review-btn { bottom:15px; right:15px; padding:10px 15px; font-size:.85rem; }
    .immersive-card { width:100%; height:100vh; border-radius:0; }
    .immersive-header { flex-direction:column; gap:15px; }
    .immersive-body { padding:15px 20px; }
    .immersive-case-title { font-size:1.5rem; }
    #user-info { flex-wrap:wrap; }
}