:root { --nav:#17365d; --accent:#1f4e78; --soft:#f5f8fc; }
body { background:#f6f8fb; color:#263238; }
.app-nav { background:linear-gradient(90deg,#17365d,#1f4e78); }
.card { border:0; box-shadow:0 4px 20px rgba(23,54,93,.07); }
.stat-card .label { color:#6c757d; font-size:.84rem; }
.stat-card .value { font-size:1.7rem; font-weight:700; color:#17365d; }
.entry-card { max-width:980px; margin:auto; }
.form-label { font-weight:600; color:#17365d; }
.table thead th { background:#1f4e78; color:#fff; white-space:nowrap; }
.badge-paid { background:#198754; }
.badge-pending { background:#ffc107; color:#212529; }
.badge-planned { background:#6c757d; }
.badge-refunded { background:#0dcaf0; color:#212529; }
.ai-box { border:2px dashed #9db5ce; background:#f8fbff; }
.amount { font-variant-numeric:tabular-nums; }
@media (max-width: 768px){ .table-responsive{font-size:.9rem;} }


/* v1.2 Dashboard */
.dashboard-shell { max-width: 1280px; margin: 0 auto; }
.dashboard-stat { position: relative; overflow: hidden; }
.dashboard-stat::after {
  content:""; position:absolute; right:-28px; top:-28px; width:90px; height:90px;
  border-radius:50%; background:rgba(31,78,120,.07);
}
.stat-kicker { color:#6c757d; font-size:.82rem; font-weight:600; text-transform:uppercase; letter-spacing:.02em; }
.stat-number { color:#17365d; font-size:1.72rem; font-weight:800; margin-top:.2rem; }
.stat-foot { color:#8a949e; font-size:.8rem; margin-top:.2rem; }
.chart-wrap { position:relative; min-height:320px; }
.chart-wrap-small { min-height:290px; }
.dashboard-progress { height:7px; background:#edf1f6; margin-top:.45rem; }
.dashboard-progress .progress-bar { background:#1f4e78; border-radius:10px; }
.dashboard-list-item { display:flex; gap:1rem; align-items:center; justify-content:space-between; padding:.9rem 0; border-bottom:1px solid #edf0f4; }
.dashboard-list-item:last-child { border-bottom:0; }
.dashboard-empty { padding:1.5rem; border:1px dashed #ccd6e0; border-radius:12px; background:#fafcff; color:#74808c; text-align:center; }
.dashboard-table thead th { font-size:.78rem; letter-spacing:.02em; }
.dashboard-table td { vertical-align:middle; }
@media(max-width:768px){
  .stat-number { font-size:1.3rem; }
  .chart-wrap { min-height:280px; }
}


/* v1.3 Reminders */
.reminder-row { display:flex; justify-content:space-between; gap:1rem; padding:1rem 0; border-bottom:1px solid #edf0f4; }
.reminder-row:last-child { border-bottom:0; }
.reminder-mini-card { height:100%; padding:1rem; border-radius:12px; background:#fff9e9; border:1px solid #f3df9d; }


/* v1.4 Academic Years */
.dashboard-hero { background:#fff; border-radius:14px; padding:1.25rem; box-shadow:0 4px 20px rgba(23,54,93,.07); }
.dashboard-profile-photo { width:86px; height:86px; border-radius:50%; object-fit:cover; border:4px solid #edf3f8; }
.dashboard-profile-placeholder { width:86px; height:86px; border-radius:50%; display:flex; align-items:center; justify-content:center; background:#17365d; color:white; font-size:2rem; font-weight:700; }
.year-select-box { min-width:260px; }
.year-profile-row { display:flex; justify-content:space-between; align-items:center; gap:1rem; padding:1rem 0; border-bottom:1px solid #edf0f4; }
.year-profile-row:last-child { border-bottom:0; }
.year-profile-thumb { width:64px; height:64px; object-fit:cover; border-radius:50%; border:3px solid #edf3f8; }
.year-profile-placeholder { width:64px; height:64px; display:flex; align-items:center; justify-content:center; border-radius:50%; background:#17365d; color:#fff; font-size:1.4rem; font-weight:700; }
.year-photo-preview { width:120px; height:120px; object-fit:cover; border-radius:14px; }
@media(max-width:768px){ .year-select-box{min-width:100%;} .dashboard-profile-photo,.dashboard-profile-placeholder{width:72px;height:72px;} }


/* v1.5 Memories Gallery */
.memory-grid { display:grid; grid-template-columns:repeat(auto-fill,minmax(245px,1fr)); gap:1rem; }
.memory-card { background:#fff; border-radius:14px; overflow:hidden; box-shadow:0 4px 18px rgba(23,54,93,.08); border:1px solid #edf0f4; }
.memory-image-link { display:block; background:#eef2f6; aspect-ratio:1/1; overflow:hidden; }
.memory-image-link img { width:100%; height:100%; object-fit:cover; display:block; transition:transform .2s ease; }
.memory-image-link:hover img { transform:scale(1.025); }
.memory-body { padding:1rem; }
.memory-date { color:#7b8794; font-size:.78rem; text-transform:uppercase; letter-spacing:.02em; }
.memory-caption { color:#344454; line-height:1.4; }
.memory-tags { color:#5e7590; }
.memory-heart { color:#dc3545; font-size:1.35rem; line-height:1; }
@media(max-width:576px){ .memory-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.7rem;} .memory-body{padding:.75rem;} }


/* v1.5.2 HEIC gallery support */
.memory-heic-placeholder {
    width:100%;
    height:100%;
    min-height:220px;
    display:flex;
    flex-direction:column;
    align-items:center;
    justify-content:center;
    gap:.35rem;
    background:linear-gradient(135deg,#eef3f7,#f8fafc);
    color:#52697d;
    text-align:center;
    padding:1rem;
}
.memory-heic-icon {
    display:inline-flex;
    align-items:center;
    justify-content:center;
    min-width:70px;
    height:48px;
    padding:0 12px;
    border-radius:10px;
    background:#17365d;
    color:#fff;
    font-weight:800;
    letter-spacing:.08em;
}


/* v1.5.3 browser-side HEIC conversion */
#heicConvertStatus:empty { display:none; }
.memory-heic-placeholder { cursor:default; }


/* v1.5.4 HEIC live preview + modal */
button.memory-image-link {
    width:100%;
    border:0;
    padding:0;
    margin:0;
    cursor:pointer;
    text-align:inherit;
}
.memory-heic-live {
    width:100%;
    height:100%;
    object-fit:cover;
    display:block;
}
.memory-preview-modal-content {
    background:#0f1720;
}
.memory-preview-modal-content .modal-header,
.memory-preview-modal-content .modal-footer {
    background:#fff;
}
.memory-preview-modal-body {
    min-height:420px;
    display:flex;
    align-items:center;
    justify-content:center;
    padding:1rem;
    background:#0f1720;
}
.memory-preview-image {
    max-width:100%;
    max-height:78vh;
    width:auto;
    height:auto;
    object-fit:contain;
    display:block;
    margin:auto;
}
.memory-preview-loading {
    color:#fff;
    text-align:center;
    padding:3rem;
}
@media(max-width:768px){
    .memory-preview-modal-body { min-height:280px; padding:.5rem; }
    .memory-preview-image { max-height:72vh; }
}


/* v1.5.5 Fixed-size gallery modal */
#memoryPreviewModal .modal-dialog {
    max-width: 960px !important;
    width: calc(100% - 32px) !important;
    margin: 16px auto !important;
}

#memoryPreviewModal .modal-content {
    max-height: calc(100vh - 32px) !important;
    overflow: hidden !important;
}

#memoryPreviewModal .memory-preview-modal-body {
    height: 70vh !important;
    min-height: 420px !important;
    max-height: 70vh !important;
    overflow: hidden !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    background: #0f1720 !important;
    padding: 12px !important;
}

#memoryPreviewModal .memory-preview-image {
    width: 100% !important;
    height: 100% !important;
    max-width: 100% !important;
    max-height: 100% !important;
    object-fit: contain !important;
    object-position: center center !important;
    display: block !important;
    margin: 0 auto !important;
}

#memoryPreviewModal .modal-header,
#memoryPreviewModal .modal-footer {
    flex: 0 0 auto !important;
}

@media (max-width: 768px) {
    #memoryPreviewModal .modal-dialog {
        width: calc(100% - 16px) !important;
        margin: 8px auto !important;
    }

    #memoryPreviewModal .memory-preview-modal-body {
        height: 68vh !important;
        min-height: 260px !important;
        max-height: 68vh !important;
        padding: 6px !important;
    }
}