:root {
    --csg-dark: #1b232b;
    --csg-dark-2: #111820;
    --csg-orange: #ff6b0a;
    --csg-orange-dark: #d95700;
    --csg-cream: #f7f4ef;
    --csg-card: #ffffff;
    --csg-border: #e7eaee;
    --csg-muted: #66727f;
}

html,
body {
    min-height: 100%;
}

body {
    min-height: 100vh;
    display: flex;
    flex-direction: column;
    background: linear-gradient(180deg, #f7f4ef 0%, #f4f6f8 40%, #eef2f5 100%);
    color: var(--csg-dark);
}

body > main {
    flex: 1 0 auto;
    width: 100%;
}

.app-navbar {
    background: var(--csg-dark);
    border-bottom: 3px solid var(--csg-orange);
    box-shadow: 0 8px 24px rgba(17, 24, 32, .18);
}

.app-navbar-inner {
    min-height: 74px;
}

.app-brand {
    display: inline-flex;
    align-items: center;
    padding: .35rem 0;
    margin-right: 1rem;
}

.app-brand-logo {
    display: block;
    width: min(320px, 52vw);
    max-height: 64px;
    object-fit: contain;
}

.app-nav-actions .btn {
    border-radius: 999px;
    font-weight: 700;
}

.hero-card {
    background: rgba(255, 255, 255, .92);
    border: 1px solid rgba(27, 35, 43, .08);
    border-radius: 1.35rem;
    padding: 2rem;
    box-shadow: 0 16px 40px rgba(27, 35, 43, .09);
}

.hero-card-brand {
    overflow: hidden;
    position: relative;
}

.hero-card-brand::before {
    content: "";
    position: absolute;
    inset: 0;
    background: radial-gradient(circle at top right, rgba(255, 107, 10, .14), transparent 36%);
    pointer-events: none;
}

.hero-card-brand > * {
    position: relative;
}

.hero-logo {
    display: block;
    width: 100%;
    max-width: 780px;
    height: auto;
    border-radius: .85rem;
}

.eyebrow {
    text-transform: uppercase;
    letter-spacing: .09em;
    font-weight: 800;
    color: var(--csg-orange-dark);
    font-size: .78rem;
}

.lead {
    color: #34414e;
}

.btn-primary {
    --bs-btn-bg: var(--csg-orange);
    --bs-btn-border-color: var(--csg-orange);
    --bs-btn-hover-bg: var(--csg-orange-dark);
    --bs-btn-hover-border-color: var(--csg-orange-dark);
    --bs-btn-active-bg: var(--csg-orange-dark);
    --bs-btn-active-border-color: var(--csg-orange-dark);
    --bs-btn-color: #fff;
    --bs-btn-font-weight: 800;
    box-shadow: 0 8px 18px rgba(255, 107, 10, .22);
}

.btn-outline-primary {
    --bs-btn-color: var(--csg-orange-dark);
    --bs-btn-border-color: var(--csg-orange);
    --bs-btn-hover-bg: var(--csg-orange);
    --bs-btn-hover-border-color: var(--csg-orange);
    --bs-btn-active-bg: var(--csg-orange-dark);
    --bs-btn-active-border-color: var(--csg-orange-dark);
    --bs-btn-font-weight: 800;
}

.app-form-card,
.card,
.info-panel,
.empty-state {
    border-radius: 1rem;
}

.app-form-card,
.card.shadow-sm {
    border: 1px solid var(--csg-border);
    box-shadow: 0 10px 28px rgba(27, 35, 43, .07) !important;
}

.app-form-card .card-body,
.card .card-body {
    padding: 1.35rem;
}

.form-label {
    font-weight: 800;
    color: var(--csg-dark);
}

.form-select,
.form-control,
.lens-box {
    border-color: #d9dee5;
    border-radius: .75rem;
}

.form-select:focus,
.form-control:focus,
.form-check-input:focus {
    border-color: var(--csg-orange);
    box-shadow: 0 0 0 .2rem rgba(255, 107, 10, .16);
}

.form-check-input:checked {
    background-color: var(--csg-orange);
    border-color: var(--csg-orange);
}

.lens-box {
    border: 1px solid #d9dee5;
    padding: .8rem;
    background: #fff;
}

.empty-state {
    background: rgba(255,255,255,.86);
    border: 2px dashed #d0d6dd;
    padding: 2rem;
    text-align: center;
    color: var(--csg-muted);
}

.quick-card {
    background: linear-gradient(135deg, var(--csg-dark), #2a3642);
    color: #fff;
    border-radius: 1rem;
    padding: 1.5rem;
    box-shadow: 0 14px 34px rgba(27, 35, 43, .22);
    border-bottom: 4px solid var(--csg-orange);
}

.quick-label {
    text-transform: uppercase;
    letter-spacing: .08em;
    font-size: .75rem;
    opacity: .84;
    margin-bottom: .5rem;
    color: #ffd7bf;
}

.quick-text {
    font-size: clamp(1.25rem, 2vw, 1.75rem);
    font-weight: 800;
    line-height: 1.25;
}

.setting-tile {
    background: #fbfcfd;
    border: 1px solid var(--csg-border);
    border-radius: .85rem;
    padding: 1rem;
    height: 100%;
}

.setting-label {
    color: var(--csg-muted);
    font-size: .78rem;
    text-transform: uppercase;
    letter-spacing: .06em;
    font-weight: 800;
}

.setting-value {
    font-weight: 800;
    font-size: 1.05rem;
    margin-top: .35rem;
}

.info-panel {
    background: #fff;
    padding: 1.25rem;
    box-shadow: 0 6px 18px rgba(27, 35, 43, .07);
    border: 1px solid var(--csg-border);
}

.info-panel h3,
.card h2,
.card h3 {
    color: var(--csg-dark);
}

.rating {
    color: var(--csg-orange-dark);
    font-weight: 900;
    font-size: 1.3rem;
    letter-spacing: .08em;
}

.checklist li {
    margin-bottom: .5rem;
}

.accordion-button:not(.collapsed) {
    color: var(--csg-dark);
    background: #fff3ea;
    box-shadow: inset 0 -1px 0 rgba(255, 107, 10, .16);
}

.accordion-button:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 107, 10, .16);
    border-color: var(--csg-orange);
}

.app-footer {
    flex-shrink: 0;
    margin-top: auto;
    padding: 1.5rem 0;
    background: var(--csg-dark);
    border-top: 3px solid var(--csg-orange);
    color: rgba(255, 255, 255, .72);
}

.app-footer-copy {
    color: rgba(255, 255, 255, .72);
}

.app-footer .footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: 1rem;
}

.app-footer .footer-links a {
    color: #fff;
    font-weight: 700;
    text-decoration: none;
}

.app-footer .footer-links a:hover,
.app-footer .footer-links a:focus {
    color: #ffb06a;
    text-decoration: underline;
}

.history-feedback-row td {
    border-top: 0;
}

.history-feedback-row textarea {
    resize: vertical;
}

.gear-lens-list {
    display: grid;
    gap: .65rem;
}

.gear-lens-row {
    display: grid;
    grid-template-columns: 2.25rem minmax(0, 1fr);
    gap: .75rem;
    align-items: flex-start;
    background: #fff;
    border: 1px solid var(--csg-border);
    border-radius: .85rem;
    padding: .85rem;
    cursor: pointer;
    transition: border-color .15s ease, box-shadow .15s ease, background .15s ease;
}

.gear-lens-row:hover {
    border-color: rgba(255, 107, 10, .38);
    box-shadow: 0 6px 16px rgba(27, 35, 43, .07);
}

.gear-lens-row.is-owned {
    border-color: rgba(255, 107, 10, .55);
    background: #fffaf5;
}

.gear-lens-check {
    display: flex;
    justify-content: center;
    padding-top: .15rem;
}

.gear-lens-check .form-check-input {
    margin: 0;
    float: none;
}

.gear-lens-main {
    min-width: 0;
}

.gear-favourite-select {
    background: #fbfcfd;
    border: 1px solid var(--csg-border);
    border-radius: .85rem;
    padding: .85rem;
}

.badge.text-bg-primary {
    background-color: var(--csg-orange) !important;
}

@media (max-width: 575.98px) {
    .hero-card {
        padding: 1.25rem;
    }
}

/* Responsive main navigation */
.app-menu-toggle {
    width: 44px;
    height: 44px;
    border: 1px solid rgba(255, 195, 125, .48);
    border-radius: 999px;
    padding: 0;
    align-items: center;
    justify-content: center;
    background: rgba(255, 255, 255, .08);
    transition: background-color .15s ease, border-color .15s ease, box-shadow .15s ease;
}

.app-menu-toggle:hover,
.app-menu-toggle:active,
.app-menu-toggle[aria-expanded="true"] {
    background: rgba(255, 107, 10, .18);
    border-color: rgba(255, 195, 125, .86);
}

.app-menu-toggle:focus {
    box-shadow: 0 0 0 .2rem rgba(255, 195, 125, .28);
}

.app-menu-toggle .navbar-toggler-icon {
    width: 22px;
    height: 16px;
    position: relative;
    background: linear-gradient(#ffc37d, #ffc37d) center / 22px 2px no-repeat !important;
}

.app-menu-toggle .navbar-toggler-icon::before,
.app-menu-toggle .navbar-toggler-icon::after {
    content: "";
    position: absolute;
    left: 0;
    width: 22px;
    height: 2px;
    border-radius: 999px;
    background: #ffc37d;
}

.app-menu-toggle .navbar-toggler-icon::before {
    top: 1px;
}

.app-menu-toggle .navbar-toggler-icon::after {
    bottom: 1px;
}

.app-menu-text {
    color: #fff;
    font-weight: 800;
    font-size: .9rem;
}

.app-nav-collapse {
    flex-grow: 1;
}

.app-nav-actions {
    gap: .45rem;
    align-items: center;
}

.app-nav-link {
    color: rgba(255,255,255,.86);
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 999px;
    padding: .45rem .85rem !important;
    font-weight: 800;
}

.app-nav-link:hover,
.app-nav-link:focus {
    color: #fff;
    border-color: rgba(255,255,255,.38);
    background: rgba(255,255,255,.08);
}

.app-nav-link.active {
    color: var(--csg-dark) !important;
    background: #fff;
    border-color: #fff;
}

@media (min-width: 992px) {
    .app-menu-toggle {
        display: none;
    }
}

@media (max-width: 991.98px) {
    .app-navbar-inner {
        align-items: center;
        gap: .65rem;
        padding-top: .55rem;
        padding-bottom: .55rem;
    }

    .app-brand-logo {
        width: min(300px, 68vw);
        max-height: 58px;
    }

    .app-nav-collapse {
        width: 100%;
        flex-basis: 100%;
    }

    .app-nav-actions {
        align-items: stretch;
        padding-top: .75rem;
    }

    .app-nav-link {
        border-radius: .85rem;
        padding: .7rem .85rem !important;
        text-align: center;
    }
}

@media (max-width: 575.98px) {
    .app-brand-logo {
        width: min(250px, 64vw);
        max-height: 52px;
    }

    .app-menu-text {
        font-size: .82rem;
    }

}

.login-prompt-card {
    border: 1px solid rgba(255, 107, 10, .22);
    background: rgba(255, 247, 239, .96);
    border-radius: 1rem;
    padding: .95rem 1rem;
    color: var(--csg-dark);
}

.login-prompt-card span {
    color: var(--csg-muted);
}

.footer-links {
    display: flex;
    flex-wrap: wrap;
    gap: .9rem;
}

.footer-links a {
    color: var(--csg-muted);
    text-decoration: none;
    font-weight: 700;
}

.footer-links a:hover,
.footer-links a:focus {
    color: var(--csg-orange-dark);
    text-decoration: underline;
}

.content-card {
    background: rgba(255, 255, 255, .94);
    border: 1px solid var(--csg-border);
    border-radius: 1rem;
    padding: clamp(1.25rem, 3vw, 2rem);
    box-shadow: 0 10px 28px rgba(27, 35, 43, .07);
}

.content-card h2 {
    margin-top: 1.8rem;
}

.content-card h2:first-child {
    margin-top: 0;
}

.error-code {
    color: var(--csg-orange);
    font-size: clamp(4rem, 18vw, 9rem);
    font-weight: 900;
    line-height: .85;
    letter-spacing: -.06em;
}

@media (max-width: 575.98px) {
    .hero-card {
        padding: 1.25rem;
        border-radius: 1rem;
    }

    .app-brand-logo {
        width: min(255px, 72vw);
    }

    .app-footer {
        padding: 1.5rem 0;
    }
}

/* Compact recommendation history and complimentary Premium EXIF comparison */
.premium-access-pill,
.photo-count-pill,
.status-pill {
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .38rem .7rem;
    font-size: .78rem;
    line-height: 1;
    font-weight: 800;
}

.premium-access-pill {
    background: #20160f;
    color: #ffc37d;
    border: 1px solid rgba(255, 195, 125, .45);
}

.history-toolbar {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    align-items: center;
    gap: .75rem;
    padding: .8rem 1rem;
    background: rgba(255,255,255,.9);
    border: 1px solid var(--csg-border);
    border-radius: .9rem;
}

.history-card-list {
    display: grid;
    gap: 1rem;
}

.history-card {
    background: rgba(255,255,255,.96);
    border: 1px solid var(--csg-border);
    border-radius: 1rem;
    box-shadow: 0 8px 22px rgba(27,35,43,.06);
    overflow: hidden;
}

.history-card-summary {
    display: flex;
    gap: .8rem;
    padding: 1rem;
}

.history-select {
    padding-top: .12rem;
}

.history-summary-main {
    min-width: 0;
    flex: 1;
}

.history-summary-top {
    display: flex;
    justify-content: space-between;
    gap: 1rem;
}

.history-date,
.history-context {
    color: var(--csg-muted);
    font-size: .84rem;
}

.history-statuses,
.history-actions {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-end;
    gap: .45rem;
}

.status-pill { background: #eef1f3; color: #4f5a64; }
.status-worked { background: #def3e5; color: #17643a; }
.status-partly_worked { background: #fff0c9; color: #7a5300; }
.status-did_not_work { background: #f9dddd; color: #842029; }
.photo-count-pill { background: #fff4ea; color: #9a4600; }

.history-quick {
    margin-top: .65rem;
    font-weight: 900;
    color: var(--csg-dark);
}

.history-actions {
    justify-content: flex-start;
    margin-top: .75rem;
}

.history-panel {
    border-top: 1px solid var(--csg-border);
    padding: 1rem;
    background: #fbfcfd;
}

.history-detail-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: .65rem;
}

.history-detail-grid > div {
    border: 1px solid var(--csg-border);
    border-radius: .75rem;
    padding: .7rem;
    background: #fff;
}

.history-detail-grid span {
    display: block;
    color: var(--csg-muted);
    font-size: .76rem;
    margin-bottom: .15rem;
}

.premium-note,
.premium-locked {
    border-radius: .8rem;
    padding: .85rem 1rem;
}

.premium-note {
    border: 1px solid rgba(255,107,10,.28);
    background: #fff5eb;
}

.premium-locked {
    border: 1px dashed var(--csg-border);
    background: #fff;
}

.photo-attempt-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .8rem;
}

.photo-attempt-card {
    position: relative;
    overflow: hidden;
    border: 1px solid var(--csg-border);
    border-radius: .85rem;
    background: #fff;
}

.photo-attempt-card.is-best {
    border: 2px solid var(--csg-orange);
}

.photo-preview-button {
    display: block;
    width: 100%;
    border: 0;
    padding: 0;
    background: #101418;
}

.photo-preview-button img {
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
}

.photo-attempt-body { padding: .75rem; }
.best-badge {
    display: inline-block;
    border-radius: 999px;
    padding: .28rem .55rem;
    margin-bottom: .45rem;
    background: var(--csg-orange);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
}

.exif-compact span,
.exif-compact strong { display: block; }
.exif-compact span { color: var(--csg-muted); font-size: .76rem; }
.exif-compact strong { font-size: .86rem; margin-top: .15rem; }
.exif-comparison { margin-top: .65rem; font-size: .82rem; }
.exif-comparison summary { cursor: pointer; font-weight: 800; color: var(--csg-orange-dark); }
.comparison-grid {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: .3rem .55rem;
    margin-top: .55rem;
}
.comparison-grid span { color: var(--csg-muted); }
.photo-upload-box {
    border: 1px dashed #d4a171;
    border-radius: .8rem;
    padding: 1rem;
    background: #fff;
}

@media (max-width: 991.98px) {
    .history-detail-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .photo-attempt-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 575.98px) {
    .history-card-summary { padding: .85rem; gap: .55rem; }
    .history-summary-top { display: block; }
    .history-statuses { justify-content: flex-start; margin-top: .55rem; }
    .history-actions .btn { flex: 1 1 auto; }
    .history-detail-grid,
    .photo-attempt-grid { grid-template-columns: 1fr; }
    .history-panel { padding: .85rem; }
}

/* Chunk 2B: photo feedback and neutral EXIF comparison */
.history-subject {
    margin-bottom: .1rem;
    color: var(--csg-muted);
    font-size: .82rem;
    font-weight: 700;
}

.photo-preview-button { position: relative; overflow: hidden; }
.photo-preview-button img { display: block; }
.view-larger-cue {
    position: absolute;
    right: .55rem;
    bottom: .55rem;
    padding: .3rem .55rem;
    border-radius: 999px;
    background: rgba(12, 16, 20, .82);
    color: #fff;
    font-size: .72rem;
    font-weight: 900;
    letter-spacing: .01em;
    transition: transform .15s ease, background .15s ease;
}
.photo-preview-button:hover .view-larger-cue,
.photo-preview-button:focus-visible .view-larger-cue {
    transform: translateY(-2px);
    background: rgba(12, 16, 20, .96);
}

.comparison-explainer {
    margin: .55rem 0 .65rem;
    color: var(--csg-muted);
    font-size: .76rem;
    line-height: 1.35;
}
.comparison-table { display: grid; gap: .45rem; }
.comparison-row {
    display: grid;
    grid-template-columns: minmax(80px,.75fr) minmax(0,1fr) minmax(0,1fr) minmax(135px,.9fr);
    gap: .55rem;
    align-items: center;
    padding: .55rem;
    border: 1px solid var(--csg-border);
    border-radius: .65rem;
    background: #fff;
}
.comparison-row > div:not(.comparison-setting):not(.comparison-state) span {
    display: block;
    color: var(--csg-muted);
    font-size: .68rem;
}
.comparison-row strong { display: block; font-size: .78rem; line-height: 1.25; }
.comparison-setting { font-weight: 900; font-size: .78rem; }
.comparison-state {
    display: flex;
    align-items: center;
    gap: .35rem;
    border-radius: 999px;
    padding: .3rem .5rem;
    font-size: .69rem;
    font-weight: 900;
    line-height: 1.1;
}
.comparison-state span { font-size: .9rem; }
.comparison-state em { font-style: normal; }
.comparison-within { background: #e3f4e9; color: #17643a; }
.comparison-near { background: #fff1cb; color: #765200; }
.comparison-different { background: #e6f0fb; color: #24557e; }
.comparison-unavailable { background: #edf0f2; color: #5f6871; }

.photo-feedback-form {
    margin-top: .8rem;
    padding-top: .75rem;
    border-top: 1px solid var(--csg-border);
}
.photo-feedback-form fieldset { margin: 0; }
.photo-feedback-form legend { margin-bottom: .45rem; font-size: .8rem; font-weight: 900; }
.outcome-options { display: flex; flex-wrap: wrap; gap: .4rem; }
.outcome-options label { margin: 0; }
.outcome-options input { position: absolute; opacity: 0; pointer-events: none; }
.outcome-options span {
    display: inline-block;
    padding: .38rem .62rem;
    border: 1px solid var(--csg-border);
    border-radius: 999px;
    background: #fff;
    color: var(--csg-dark);
    font-size: .75rem;
    font-weight: 800;
    cursor: pointer;
}
.outcome-options input:checked + span {
    border-color: var(--csg-orange);
    box-shadow: 0 0 0 2px rgba(255,107,10,.12);
    background: #fff4ea;
    color: var(--csg-orange-dark);
}
.outcome-options input:focus-visible + span { outline: 3px solid rgba(13,110,253,.25); }
.photo-feedback-details { margin-top: .55rem; font-size: .78rem; }
.photo-feedback-details summary { cursor: pointer; color: var(--csg-orange-dark); font-weight: 900; }
.feedback-reasons { display: grid; gap: .35rem; margin-top: .6rem; }
.feedback-reasons p { margin: 0 0 .15rem; color: var(--csg-muted); font-size: .74rem; }
.feedback-reasons label { display: flex; align-items: flex-start; gap: .35rem; }
.feedback-reasons input { margin-top: .18rem; }

@media (max-width: 767.98px) {
    .comparison-row { grid-template-columns: 1fr 1fr; }
    .comparison-setting { grid-column: 1 / -1; }
    .comparison-state { grid-column: 1 / -1; justify-self: start; }
}

/* Chunk 2C: History focus and 0–2 feedback controls */
.history-title-line{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap}.title-edit-toggle{border:0;background:transparent;color:var(--bs-primary);font-size:.78rem;padding:0;text-decoration:underline}.history-title-form{max-width:520px}.factor-score-list{display:grid;gap:.55rem}.factor-score-row{display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:center;gap:.75rem;padding:.55rem .65rem;border:1px solid rgba(255,255,255,.1);border-radius:.6rem}.factor-score-row>span{min-width:0;line-height:1.25}.factor-score-options{display:flex;gap:.35rem;flex:0 0 auto}.factor-score-options label{margin:0}.factor-score-options input{position:absolute;opacity:0;pointer-events:none}.factor-score{display:grid;place-items:center;width:2rem;height:2rem;border:1px solid rgba(255,255,255,.2);border-radius:50%;font-size:1.15rem;font-weight:950;line-height:1;cursor:pointer;background:rgba(255,255,255,.04)}.factor-score-2{color:#46d37c}.factor-score-1{color:#aeb4bd}.factor-score-0{color:#ff6464}.factor-score-options input:checked+.factor-score-2{background:#176c38;border-color:#52df8a;color:#fff;box-shadow:0 0 0 2px rgba(82,223,138,.18)}.factor-score-options input:checked+.factor-score-1{background:#626975;border-color:#aeb4bd;color:#fff}.factor-score-options input:checked+.factor-score-0{background:#9f2f35;border-color:#ff7379;color:#fff;box-shadow:0 0 0 2px rgba(255,115,121,.16)}.factor-score-options input:focus-visible+.factor-score{outline:3px solid rgba(255,153,51,.35);outline-offset:2px}.history-actions .btn-outline-primary{font-weight:700}
@media (max-width:767.98px){.factor-score-row{grid-template-columns:minmax(0,1fr) auto;gap:.5rem;padding:.5rem}.factor-score{width:1.9rem;height:1.9rem}.history-title-line{align-items:flex-start}}


/* Chunk 2C corrective layout: missing photo-result styles */
.photo-result-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: .85rem;
    align-items: start;
}

.photo-result-card {
    min-width: 0;
    overflow: hidden;
    border: 1px solid var(--csg-border);
    border-radius: .85rem;
    background: #fff;
    box-shadow: 0 2px 8px rgba(18, 24, 30, .05);
}

.photo-result-card.is-best {
    border: 2px solid var(--csg-orange);
}

.photo-thumb-button {
    position: relative;
    display: block;
    width: 100%;
    max-width: 100%;
    padding: 0;
    overflow: hidden;
    border: 0;
    background: #101418;
    cursor: pointer;
}

.photo-thumb-button img {
    display: block;
    width: 100%;
    height: auto;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    object-position: center;
}

.photo-result-body {
    padding: .75rem;
}

.best-result-pill {
    flex: 0 0 auto;
    align-self: flex-start;
    display: inline-flex;
    align-items: center;
    border-radius: 999px;
    padding: .28rem .52rem;
    background: var(--csg-orange);
    color: #fff;
    font-size: .7rem;
    font-weight: 900;
    white-space: nowrap;
}

/* Keep each feedback factor and its three choices on one row. */
.factor-score-row {
    display: flex !important;
    align-items: center !important;
    justify-content: space-between;
    gap: .65rem;
    width: 100%;
    padding: .55rem .65rem;
    border: 1px solid var(--csg-border);
    border-radius: .65rem;
    background: #fff;
}

.factor-score-row > span {
    flex: 1 1 auto;
    min-width: 0;
    color: var(--csg-dark);
    font-size: .78rem;
    font-weight: 700;
    line-height: 1.2;
}

.factor-score-options {
    display: inline-flex !important;
    flex: 0 0 auto;
    align-items: center;
    gap: .3rem;
    white-space: nowrap;
}

.factor-score-options label {
    display: inline-flex !important;
    flex: 0 0 auto;
    margin: 0 !important;
}

.factor-score {
    width: 2rem;
    height: 2rem;
    border-color: var(--csg-border);
    background: #f8f9fa;
}

.factor-score-2 {
    color: #15803d;
    font-size: 1.3rem;
    font-weight: 1000;
}

.factor-score-0 {
    color: #c62828;
    font-size: 1.25rem;
    font-weight: 1000;
}

.factor-score-1 {
    color: #6c757d;
    font-weight: 900;
}

@media (max-width: 991.98px) {
    .photo-result-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
    }
}

@media (max-width: 575.98px) {
    .photo-result-grid {
        grid-template-columns: 1fr;
        gap: .7rem;
    }

    .photo-result-card {
        display: grid;
        grid-template-columns: 118px minmax(0, 1fr);
        align-items: stretch;
    }

    .photo-thumb-button {
        min-height: 118px;
        height: 100%;
    }

    .photo-thumb-button img {
        width: 100%;
        height: 100%;
        min-height: 118px;
        aspect-ratio: auto;
        object-fit: cover;
    }

    .photo-result-body {
        min-width: 0;
        padding: .65rem;
    }

    .view-larger-cue {
        right: .35rem;
        bottom: .35rem;
        padding: .22rem .4rem;
        font-size: .64rem;
    }

    .factor-score-row {
        gap: .4rem;
        padding: .45rem .5rem;
    }

    .factor-score-row > span {
        font-size: .74rem;
    }

    .factor-score {
        width: 1.82rem;
        height: 1.82rem;
    }
}

@media (max-width: 390px) {
    .photo-result-card {
        grid-template-columns: 100px minmax(0, 1fr);
    }

    .photo-thumb-button,
    .photo-thumb-button img {
        min-height: 100px;
    }

    .factor-score-options {
        gap: .2rem;
    }

    .factor-score {
        width: 1.7rem;
        height: 1.7rem;
        font-size: 1.05rem;
    }
}


/* Chunk 2C final interaction polish */
.factor-score-options input:checked + .factor-score-2,
.factor-score-options label:hover .factor-score-2 {
    background: rgba(255, 154, 61, .18);
    border-color: rgba(255, 132, 24, .7);
    color: #15803d;
    box-shadow: 0 0 0 2px rgba(255, 132, 24, .08);
}

.factor-score-options input:checked + .factor-score-0,
.factor-score-options label:hover .factor-score-0 {
    background: rgba(255, 154, 61, .18);
    border-color: rgba(255, 132, 24, .7);
    color: #c62828;
    box-shadow: 0 0 0 2px rgba(255, 132, 24, .08);
}

.factor-score-options label:hover .factor-score {
    transform: translateY(-1px);
}

.factor-score {
    transition: background .15s ease, border-color .15s ease, box-shadow .15s ease, transform .15s ease;
}

.comparison-row > div:not(.comparison-setting):not(.comparison-state) {
    align-self: stretch;
    display: flex;
    flex-direction: column;
    justify-content: center;
}

.comparison-row > div:not(.comparison-setting):not(.comparison-state) span {
    margin-bottom: .28rem;
    line-height: 1;
}

/* Location Shooting Mode */
.location-status{border:1px solid #d7dce1;border-radius:.65rem;padding:.8rem .9rem;background:#f8f9fa;font-weight:600}.location-status.is-info{background:#eaf4ff;border-color:#9bc5ef;color:#183b5b}.location-status.is-success{background:#eaf7ee;border-color:#9fd5ad;color:#204c2b}.location-status.is-error{background:#fff1f1;border-color:#e0a6a6;color:#6c2020}.location-status.is-working{background:#fff8e6;border-color:#e8cb77;color:#5b4712}.location-list{display:grid;gap:1rem}.location-card{overflow:hidden}.location-card .card-body{min-height:130px}.location-thumb{width:100%;height:100%;min-height:130px;object-fit:cover;display:block}.location-thumb-empty{display:flex;align-items:center;justify-content:center;background:#e9ecef;color:#6c757d;font-size:.85rem}.location-note{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.location-photo-large{width:100%;max-height:620px;object-fit:contain;background:#111}.location-log-card{position:sticky;top:1rem}@media(max-width:991.98px){.location-log-card{position:static}.location-card .card-body,.location-thumb{min-height:115px}}

/* Location Shooting Mode — Chunk 1B */
.session-control-card{position:sticky;top:1rem}.session-quick-group{margin-top:1rem}.session-quick-group>span{display:block;font-size:.78rem;font-weight:700;text-transform:uppercase;letter-spacing:.04em;margin-bottom:.35rem;color:#5d6570}.session-quick-group .btn{padding:.55rem .35rem;font-size:.86rem}.session-quick-group .btn.active{background:#ff8418;border-color:#ff8418;color:#111}.session-result-card #quickGlance{line-height:1.25}.session-result-card .setting-tile{height:100%}@media(max-width:991.98px){.session-control-card{position:static}.session-result-card{margin-bottom:1rem}}@media(max-width:575.98px){.session-quick-group .btn{font-size:.76rem;padding:.5rem .2rem}.session-result-card .card-body{padding:1rem}}

/* Master photography session / Chunk 1C */
.session-timeline{border-left:3px solid #ff8418;padding-left:1rem;display:grid;gap:.75rem}.session-moment{border:1px solid #dfe3e7;border-radius:.7rem;background:#fff;padding:.8rem 1rem}.session-moment summary{cursor:pointer;line-height:1.4}.session-moment[open]{border-color:#ffb06a}@media(max-width:575.98px){.session-moment{padding:.7rem .8rem}.session-moment summary .text-muted{display:block;margin-top:.15rem}}

/* Shoots and field-flow usability pass */
.shoots-heading{max-width:760px}.shoot-primary-card{border:2px solid rgba(255,132,24,.35)}.shoot-moment-count{font-size:.82rem;font-weight:800;color:#5d6570;white-space:nowrap}.shoot-list{display:grid;gap:.65rem}.shoot-list-item{display:flex;justify-content:space-between;align-items:center;gap:1rem;padding:.85rem 1rem;border:1px solid var(--csg-border);border-radius:.7rem;background:#fff;color:inherit;text-decoration:none}.shoot-list-item:hover{border-color:#ffb06a;background:#fffaf5}.session-result-card{position:sticky;top:1rem}.session-result-card #quickGlance{font-size:1.35rem;font-weight:800}.session-timeline-section{padding-top:.25rem}.location-card{box-shadow:none!important;border-color:var(--csg-border)}.location-card .card-body{padding:.8rem}.location-thumb,.location-card .card-body{min-height:105px}.location-photo-large{max-height:440px}.location-status{padding:.65rem .75rem;font-size:.9rem}
@media(max-width:991.98px){.session-result-card{position:static}.shoot-primary-card .card-body{padding:1rem}.location-log-card{position:static}}
@media(max-width:575.98px){.shoots-heading p{font-size:.9rem}.shoot-list-item{padding:.75rem}.session-result-card #quickGlance{font-size:1.18rem}.session-control-card .card-body{padding:.9rem}.session-quick-group{margin-top:.75rem}.session-timeline{padding-left:.7rem}.location-card .card-body{min-height:96px}.location-thumb{min-height:96px}.location-log-card .card-body{padding:1rem}}

/* Location groups and quick shoot ending */
.location-group-filters{display:flex;flex-wrap:wrap;gap:.45rem}.location-group-checks{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.35rem .75rem;padding:.7rem;border:1px solid var(--csg-border);border-radius:.65rem;background:#f8f9fa}.location-group-checks .form-check{margin:0}.location-group-filters .badge{font-size:.68rem}.shoot-primary-card form .btn-outline-danger{background:#fff}@media(max-width:575.98px){.location-group-checks{grid-template-columns:1fr}.location-group-filters .btn{flex:1 1 auto}.shoot-primary-card form .btn{font-size:.9rem}}

/* Shoot review page and desktop action tidy-up */
.shoot-primary-actions{display:flex;flex-wrap:wrap;align-items:center;gap:.6rem}.shoot-primary-actions form{margin:0}.shoot-detail-actions{display:flex;flex-direction:column;align-items:flex-end}.shoot-visit-list{display:grid;gap:.75rem}.shoot-visit-item{padding:.75rem;border:1px solid var(--csg-border);border-radius:.65rem;background:#fff}.shoot-moment-detail{display:grid;gap:.3rem}
@media(max-width:575.98px){.shoot-primary-actions{display:grid}.shoot-primary-actions .btn,.shoot-primary-actions form,.shoot-primary-actions form .btn{width:100%}.shoot-detail-actions{align-items:flex-start}.shoot-detail-actions .btn{width:100%}}


/* Places and shoot review UI tidy-up — 2026-07-27 */
@media (min-width: 768px) {
    .shoot-primary-card {
        max-width: 820px;
    }
}

.shoot-review-timeline {
    border-left: 0;
    padding-left: 0;
}

.shoot-review-timeline .session-moment summary {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    gap: .15rem 1rem;
    align-items: start;
}

.shoot-moment-time,
.shoot-moment-place,
.shoot-moment-gear {
    grid-column: 1;
}

.shoot-moment-time {
    font-weight: 800;
}

.shoot-moment-place {
    display: block;
    color: var(--csg-dark);
}

.shoot-moment-gear {
    display: block;
    color: var(--csg-muted);
    font-size: .82rem;
}

.shoot-moment-settings {
    grid-column: 2;
    grid-row: 1 / span 3;
    align-self: center;
    color: var(--csg-muted);
    font-size: .86rem;
    text-align: right;
}

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

.location-card-layout {
    display: grid;
    grid-template-columns: 112px minmax(0, 1fr);
    min-height: 112px;
}

.location-card-media {
    min-width: 0;
}

.location-photo-button,
.location-detail-photo-button {
    position: relative;
    display: block;
    width: 100%;
    border: 0;
    padding: 0;
    background: #111;
    overflow: hidden;
    cursor: zoom-in;
}

.location-photo-button {
    height: 100%;
    min-height: 112px;
    z-index: 2;
}

.location-photo-button span,
.location-detail-photo-button span {
    position: absolute;
    right: .5rem;
    bottom: .5rem;
    border-radius: 999px;
    padding: .25rem .5rem;
    background: rgba(12, 16, 20, .78);
    color: #fff;
    font-size: .72rem;
    font-weight: 800;
}

.location-card .location-thumb {
    width: 100%;
    height: 100%;
    min-height: 112px;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
}

.location-card .card-body {
    min-height: 112px;
    padding: .8rem;
}

.location-photo-figure {
    max-width: 540px;
}

.location-detail-photo-button {
    border-radius: .85rem;
}

.location-photo-preview {
    display: block;
    width: 100%;
    aspect-ratio: 1 / 1;
    object-fit: cover;
    object-position: center;
}

.location-photo-caption {
    margin-top: .55rem;
    color: var(--csg-muted);
    font-size: .82rem;
    line-height: 1.4;
}

.location-modal-image {
    display: block;
    width: 100%;
    max-height: 78vh;
    object-fit: contain;
    background: #111;
}

.location-shoot-action .btn {
    width: auto;
}

@media (max-width: 1199.98px) {
    .location-list {
        grid-template-columns: 1fr;
    }
}

@media (max-width: 575.98px) {
    .shoot-review-timeline .session-moment summary {
        grid-template-columns: 1fr;
    }

    .shoot-moment-settings {
        grid-column: 1;
        grid-row: auto;
        text-align: left;
        margin-top: .15rem;
    }

    .location-card-layout {
        grid-template-columns: 96px minmax(0, 1fr);
        min-height: 96px;
    }

    .location-photo-button,
    .location-card .location-thumb,
    .location-card .card-body {
        min-height: 96px;
    }

    .location-photo-button span {
        display: none;
    }

    .location-photo-figure {
        max-width: none;
    }

    .location-shoot-action .btn {
        width: 100%;
    }
}

/* Places and shoot review follow-up — 2026-07-27 */
.saved-viewpoint-card .location-photo-figure {
    max-width: 430px;
}

.saved-viewpoint-card .location-photo-preview {
    aspect-ratio: 1 / 1;
}

.shoots-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1rem;
}

.shoot-grid-card {
    min-width: 0;
    min-height: 150px;
}

.shoot-grid-card-active {
    border: 2px solid rgba(255,132,24,.35);
}

.shoot-grid-link {
    display: flex;
    justify-content: space-between;
    align-items: flex-start;
    gap: 1rem;
    padding: 1rem;
    border: 1px solid var(--csg-border);
    border-radius: .75rem;
    background: #fff;
    color: inherit;
    text-decoration: none;
}

.shoot-grid-link:hover {
    border-color: #ffb06a;
    background: #fffaf5;
}

.shoot-review-stack {
    display: grid;
    gap: 1rem;
}

.shoot-review-section .card-body {
    padding: 1rem;
}

.shoot-review-items {
    display: grid;
    gap: .75rem;
}

.shoot-review-item {
    margin: 0;
    padding: .85rem 1rem;
    border: 1px solid var(--csg-border);
    border-radius: .7rem;
    background: #fff;
}

.shoot-review-timeline {
    border-left: none !important;
    padding-left: 0 !important;
}

.shoot-review-timeline .session-moment[open] {
    border-color: #ffb06a;
}

@media (max-width: 767.98px) {
    .shoots-grid {
        grid-template-columns: 1fr;
    }

    .shoot-grid-card {
        min-height: 0;
    }

    .saved-viewpoint-card .location-photo-figure {
        max-width: none;
    }
}


/* Shoot map — 2026-07-28 */
.shoot-map {
    width: 100%;
    height: clamp(320px, 48vw, 520px);
    border: 1px solid var(--csg-border);
    border-radius: .75rem;
    background: #e9eef2;
    overflow: hidden;
}

.shoot-map-key {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    gap: .65rem 1rem;
}

.shoot-map-key > span {
    display: inline-flex;
    align-items: center;
    gap: .35rem;
}

.shoot-map-key-marker,
.shoot-map-numbered-marker {
    display: inline-flex;
    align-items: center;
    justify-content: center;
    border-radius: 999px;
    font-weight: 800;
    line-height: 1;
}

.shoot-map-key-marker {
    width: 1.45rem;
    height: 1.45rem;
    font-size: .72rem;
}

.shoot-map-numbered-marker {
    width: 2rem;
    height: 2rem;
    border: 2px solid #fff;
    box-shadow: 0 2px 8px rgba(17, 24, 32, .35);
    font-size: .72rem;
}

.shoot-map-key-place,
.shoot-map-marker-place {
    background: var(--csg-dark);
    color: #fff;
}

.shoot-map-key-spot,
.shoot-map-marker-spot {
    background: var(--csg-orange);
    color: #fff;
}

.shoot-map .leaflet-popup-content {
    margin: .8rem 1rem;
    min-width: 180px;
}

.shoot-map-popup-title {
    display: block;
    margin-bottom: .2rem;
}

.shoot-map-popup-link {
    display: inline-block;
    margin-top: .45rem;
    font-weight: 700;
}

.shoot-review-item:target,
.shoot-review-item.shoot-map-highlight {
    border-color: var(--csg-orange);
    box-shadow: 0 0 0 3px rgba(255, 107, 10, .15);
}

@media (max-width: 575.98px) {
    .shoot-map {
        height: 360px;
    }
}


/* Shoot review desktop columns and Place popup image — 2026-07-28 */
.shoot-review-grid {
    display: grid;
    grid-template-columns: minmax(0, 5fr) minmax(0, 7fr);
    gap: 1rem;
    align-items: start;
}

.shoot-map-place-popup {
    display: grid;
    gap: .35rem;
}

.shoot-map-popup-photo {
    display: block;
    width: 100%;
    aspect-ratio: 4 / 3;
    object-fit: cover;
    border-radius: .55rem;
    margin-bottom: .2rem;
    background: #eef1f3;
}

.shoot-map-place-popup .shoot-map-popup-link {
    margin-top: .2rem;
}

@media (max-width: 991.98px) {
    .shoot-review-grid {
        grid-template-columns: 1fr;
    }
}

/* Logged moment summary width fix inside the narrower shoot review column — 2026-07-28 */
.shoot-review-grid > *,
.shoot-review-section,
.shoot-review-section .card-body,
.shoot-review-timeline,
.shoot-review-timeline .session-moment,
.shoot-review-timeline .session-moment summary {
    min-width: 0;
}

.shoot-review-timeline .session-moment summary {
    grid-template-columns: minmax(12rem, 1fr) minmax(0, 42%);
}

.shoot-review-timeline .session-moment summary > * {
    min-width: 0;
}

.shoot-moment-settings {
    max-width: 100%;
    overflow-wrap: anywhere;
    word-break: normal;
}

@media (max-width: 1199.98px) {
    .shoot-review-timeline .session-moment summary {
        grid-template-columns: minmax(0, 1fr);
    }

    .shoot-moment-settings {
        grid-column: 1;
        grid-row: auto;
        margin-top: .35rem;
        text-align: left;
    }
}

/* Match shoot review column heights on desktop — 2026-07-28 */
@media (min-width: 992px) {
    .shoot-review-grid {
        align-items: stretch;
    }

    .shoot-review-section {
        height: 100%;
    }

    .shoot-review-section .card-body {
        display: flex;
        flex-direction: column;
        height: 100%;
    }
}

/* Shoot photo intake and post-shoot EXIF review. */
.shoot-photo-upload { width: min(100%, 390px); }
.shoot-photo-empty {
  display: flex;
  flex-direction: column;
  gap: .25rem;
  padding: 1rem;
  border: 1px dashed var(--bs-border-color);
  border-radius: .75rem;
  color: var(--csg-muted);
}
.shoot-photo-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 1rem;
}
.shoot-photo-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--bs-border-color);
  border-radius: .8rem;
  background: #fff;
}
.shoot-photo-thumb {
  display: block;
  width: 100%;
  padding: 0;
  border: 0;
  background: #111;
  position: relative;
  aspect-ratio: 4 / 3;
  overflow: hidden;
}
.shoot-photo-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; }
.shoot-photo-thumb span {
  position: absolute;
  right: .6rem;
  bottom: .6rem;
  padding: .25rem .5rem;
  border-radius: 999px;
  background: rgba(0,0,0,.72);
  color: #fff;
  font-size: .75rem;
  font-weight: 700;
}
.shoot-photo-body { padding: .9rem; }
.shoot-photo-settings { font-weight: 700; }
.shoot-photo-meta { padding-top: .6rem; border-top: 1px solid var(--bs-border-color); }
.shoot-photo-modal-image { display: block; width: 100%; max-height: 82vh; object-fit: contain; background: #111; }
@media (max-width: 991.98px) { .shoot-photo-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 575.98px) {
  .shoot-photo-grid { grid-template-columns: 1fr; }
  .shoot-photo-upload { width: 100%; }
}


/* Shoot clock comparison, matching and deletion — 2026-07-28 */
.shoot-clock-card .eyebrow, .shoot-clock-review .eyebrow { color: var(--csg-orange, #e8751a); }
.shoot-photo-assignment .form-select { min-width: 0; }
.shoot-photo-meta .badge { white-space: normal; text-align: left; }
.shoot-photo-card:target { outline: 3px solid rgba(232,117,26,.35); outline-offset: 3px; }
@media (max-width: 575.98px) {
  .shoot-clock-card .btn, .shoot-clock-review .btn { width: 100%; }
  .shoot-photo-assignment .input-group { display: grid; grid-template-columns: 1fr; gap: .4rem; }
  .shoot-photo-assignment .input-group > .form-select, .shoot-photo-assignment .input-group > .btn { width: 100%; border-radius: var(--bs-border-radius-sm) !important; }
}

/* In-shoot quick Place creation */
.shoot-add-place-panel{border:1px solid var(--csg-border);border-radius:.75rem;background:#f8f9fa;padding:1rem}
.shoot-add-place-panel .location-status:not(.is-info):not(.is-success):not(.is-error):not(.is-working){background:#fff}
@media(max-width:575.98px){.shoot-add-place-panel{padding:.85rem}.shoot-add-place-panel .btn{width:100%}}

/* Location marker confirmation map */
.location-marker-map {
    width: 100%;
    height: 320px;
    min-height: 260px;
    margin-top: 1rem;
    border: 1px solid rgba(0, 0, 0, .15);
    border-radius: .75rem;
    overflow: hidden;
    background: #e9ecef;
}

@media (max-width: 575.98px) {
    .location-marker-map {
        height: 280px;
        min-height: 240px;
    }
}

/* Shooting-session expanded setup: keep desktop content within its accordion */
#cameraSetupPanel .session-control-card {
    position: static;
    top: auto;
}
#cameraSetupPanel .accordion-body {
    padding-bottom: 1.5rem;
}
#cameraSetupAccordion {
    clear: both;
}

/* Batch 5: visible network activity and offline queue */
.shoot-activity-bar{position:fixed;z-index:2000;top:0;left:0;right:0;height:4px;background:rgba(13,110,253,.18);overflow:hidden}.shoot-activity-bar-fill{height:100%;background:var(--bs-primary);transition:width .2s ease}.shoot-activity-bar.is-active .shoot-activity-bar-fill{animation:shootActivity 1.4s ease-in-out infinite}@keyframes shootActivity{0%{transform:translateX(-100%)}50%{transform:translateX(120%)}100%{transform:translateX(320%)}}.offline-sync-panel{border:1px solid var(--bs-warning-border-subtle);background:var(--bs-warning-bg-subtle);border-radius:.75rem;padding:1rem}.offline-sync-item:last-child{margin-bottom:0!important}.shoot-is-busy button[type=submit]{cursor:wait}

/* Get Started chronological guide */
.get-started-route .content-card { display: flex; flex-direction: column; align-items: flex-start; }
.get-started-route .content-card .btn { margin-top: auto; }
.get-started-steps { display: grid; gap: 1rem; }
.get-started-step {
    display: grid;
    grid-template-columns: 3rem minmax(0, 1fr);
    gap: 1rem;
    padding: 1.25rem;
    border: 1px solid var(--csg-border, #dee2e6);
    border-radius: .9rem;
    background: #fff;
}
.get-started-step-number {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 3rem;
    height: 3rem;
    border-radius: 50%;
    background: var(--csg-orange, #e8751a);
    color: #fff;
    font-weight: 800;
    font-size: 1.15rem;
}
.get-started-step-body h3 { margin-bottom: .55rem; }
.get-started-step-body > p { color: #495057; }
.get-started-step-body ul { padding-left: 1.2rem; margin-bottom: 1rem; }
.get-started-step-body li + li { margin-top: .35rem; }
.get-started-glossary dt { font-weight: 800; }
.get-started-glossary dd { margin-bottom: .75rem; }
@media (max-width: 575.98px) {
    .get-started-step { grid-template-columns: 2.5rem minmax(0, 1fr); gap: .75rem; padding: 1rem; }
    .get-started-step-number { width: 2.5rem; height: 2.5rem; font-size: 1rem; }
    .get-started-step .btn { width: 100%; }
}

/* Active shoot timeline and compact desktop controls */
.offline-timeline-item{padding:.8rem 1rem;margin-bottom:.75rem;border-radius:.75rem}
.offline-timeline-item summary{cursor:pointer}
.session-timeline-section .session-timeline{display:grid;gap:.75rem}
.shoot-title-editor{max-width:640px}
@media (min-width:768px){
  .app-form-card .btn.w-100,.session-timeline-section .btn.w-100{width:auto!important}
  .location-marker-controls{display:flex;flex-wrap:wrap;gap:.5rem}
}

/* Shooting-session timeline and top sync summary */
.offline-sync-panel{border:1px solid #f0b75e;background:#fff3cd;border-radius:.75rem;padding:.85rem 1rem}.offline-sync-panel>summary{cursor:pointer;list-style:none}.offline-sync-panel>summary::-webkit-details-marker{display:none}.offline-sync-panel>summary:before{content:'▸';margin-right:.55rem}.offline-sync-panel[open]>summary:before{content:'▾'}.session-place{border:1px solid #ff8418;border-radius:.8rem;background:#fff;padding:.85rem 1rem}.session-place>summary{cursor:pointer;display:flex;justify-content:space-between;align-items:center;gap:.75rem}.session-place-moments{display:grid;gap:.65rem;border-left:2px solid rgba(255,132,24,.35);padding-left:.8rem}.timeline-reference-photo{max-height:220px;width:auto}.offline-timeline-item{margin-bottom:.75rem}.offline-timeline-item+ .session-place{margin-top:.25rem}
@media(max-width:575.98px){.offline-sync-panel{padding:.75rem}.offline-sync-panel>summary{align-items:flex-start!important}.offline-sync-panel #offlineSyncSummary{display:block;margin-left:0!important;margin-top:.15rem}.session-place{padding:.75rem}.session-place>summary{align-items:flex-start}.session-place-moments{padding-left:.55rem}.timeline-reference-photo{max-height:190px}}


/* Reference-photo and timeline refinements */
.session-timeline{border-left:0!important;padding-left:0!important}
.session-place-moments{border-left:0!important;padding-left:0!important;margin-left:0}
.timeline-photo-grid{display:flex;flex-wrap:wrap;gap:.55rem}
.timeline-photo-button{display:block;width:112px;height:84px;padding:0;border:1px solid var(--csg-border);border-radius:.65rem;overflow:hidden;background:#f4f5f6;cursor:pointer}
.timeline-photo-button:hover,.timeline-photo-button:focus-visible{border-color:#ff8418;outline:2px solid rgba(255,132,24,.2);outline-offset:2px}
.timeline-reference-photo{display:block;width:100%;height:100%;max-height:none!important;object-fit:cover}
.reference-photo-modal-image{max-height:78vh;width:auto;object-fit:contain}
@media(max-width:575.98px){.session-place-moments{margin-left:0}.timeline-photo-button{width:96px;height:72px}}

/* Shooting-session workflow refinement — 2026-08-06 */
.session-card-toggle {
  align-items: center;
  background: transparent;
  border: 0;
  display: flex;
  justify-content: space-between;
  padding: 0;
  text-align: left;
  width: 100%;
}
.session-card-toggle-icon {
  font-size: 1.35rem;
  line-height: 1;
  margin-left: 1rem;
  transition: transform .2s ease;
}
.session-card-toggle[aria-expanded="true"] .session-card-toggle-icon { transform: rotate(180deg); }
.session-compact-action { width: auto !important; }
@media (max-width: 575.98px) {
  .session-compact-action { width: 100% !important; }
}

/* Shooting-session top-card typography consistency — 2026-08-06 */
.session-card-heading { display:block; min-width:0; }
.session-card-summary {
  color:#212529;
  display:block;
  font-weight:700;
  line-height:1.3;
  text-transform:none;
}
.shoot-clock-card .eyebrow,
.session-result-card .eyebrow { color:var(--csg-orange-dark); }
@media (max-width:575.98px) {
  .session-card-summary { font-size:1rem; }
}


/* Current Shot repair — 2026-08-06 */
.session-result-card{position:static;top:auto}
.session-current-recommendation{border-top:1px solid var(--csg-border);padding-top:1rem}
.session-current-recommendation .setting-tile{height:100%}
.session-current-shot-controls{overflow:visible}
.session-log-setup{background:#fffaf5;border-radius:0 0 .5rem .5rem}
@media (max-width:575.98px){.session-current-recommendation #quickGlance{font-size:1.12rem}.session-current-shot-controls .row>[class*="col-"]{min-width:0}}

/* Current Shot compact expandable layout — 2026-08-06 */
.session-chevron-action{display:inline-flex;align-items:center;justify-content:space-between;gap:.65rem}
.session-chevron-action .session-card-toggle-icon{margin-left:0}
.session-chevron-action[aria-expanded="true"] .session-card-toggle-icon{transform:rotate(180deg)}
.session-current-shot-controls{width:100%}
.session-shot-section{width:100%}
.session-guidance-tabs{flex-wrap:wrap;gap:.15rem}
.session-guidance-tabs .nav-link{font-weight:700;white-space:nowrap}
.session-guidance-content{min-height:7rem}
.session-log-setup{background:transparent;border-radius:0}
@media(max-width:575.98px){.session-guidance-tabs{border-bottom:0}.session-guidance-tabs .nav-item{width:100%}.session-guidance-tabs .nav-link{border:1px solid var(--csg-border);border-radius:.45rem;width:100%;text-align:left}.session-guidance-tabs .nav-link.active{border-color:#ff8418}.session-guidance-content{min-height:0}}

/* Active shoot timeline — unified Place and Moment stream */
.shoot-timeline-layout{display:grid;grid-template-columns:minmax(0,1fr) minmax(320px,40%);gap:1rem;align-items:start}
.shoot-timeline-map-wrap{grid-column:2;grid-row:1;position:sticky;top:1rem}
.shoot-timeline-map-wrap .shoot-map{height:420px}
.shoot-timeline-layout .session-timeline{grid-column:1;grid-row:1}
.session-timeline-entry{width:100%}
.session-timeline-entry>summary{cursor:pointer;display:flex;justify-content:space-between;align-items:flex-start;gap:.75rem;list-style:none}
.session-timeline-entry>summary::-webkit-details-marker{display:none}
.session-timeline-entry>summary:after{content:'⌄';font-size:1.1rem;line-height:1;transition:transform .18s ease}
.session-timeline-entry[open]>summary:after{transform:rotate(180deg)}
.session-timeline-entry-main{display:flex;flex-wrap:wrap;align-items:center;gap:.35rem .55rem;min-width:0}
.session-timeline-entry-detail{display:flex;justify-content:space-between;align-items:flex-start;gap:1rem}
.session-timeline-entry-copy{display:grid;gap:.3rem;min-width:0}
.timeline-photo-button{width:160px;height:120px;flex:0 0 auto}
@media(max-width:991.98px){.shoot-timeline-layout{grid-template-columns:1fr}.shoot-timeline-map-wrap,.shoot-timeline-layout .session-timeline{grid-column:1}.shoot-timeline-map-wrap{grid-row:1;position:static}.shoot-timeline-layout .session-timeline{grid-row:2}.shoot-timeline-map-wrap .shoot-map{height:320px}}
@media(max-width:575.98px){.session-timeline-entry>summary{display:grid;grid-template-columns:minmax(0,1fr) auto}.session-timeline-entry>summary>.badge{grid-column:1}.session-timeline-entry>summary:after{grid-column:2;grid-row:1}.session-timeline-entry-detail{flex-direction:row;align-items:flex-start}.timeline-photo-button{width:108px;height:81px}.shoot-timeline-map-wrap .shoot-map{height:260px}}

/* Travel / multi-location Moment refinement — 2026-08-09 */
.session-place-moments .shoot-review-item{border-color:#c5cbd1}
.timeline-photo-button-moment{width:132px;height:99px}
@media(max-width:575.98px){.timeline-photo-button-moment{width:92px;height:69px}}

/* Travel / multi-location V2 — persistent current-shot access */
.shooting-session-page{padding-bottom:6rem!important}
.current-shot-floating{position:fixed;right:max(1rem,env(safe-area-inset-right));bottom:max(1rem,env(safe-area-inset-bottom));z-index:1030;display:inline-flex;border-radius:.75rem;overflow:hidden;box-shadow:0 .4rem 1.2rem rgba(0,0,0,.2)}
.current-shot-floating-action{border-radius:0!important;white-space:nowrap}
.current-shot-floating-action-secondary{border-left:1px solid rgba(255,255,255,.4)!important}
.current-shot-offcanvas{--bs-offcanvas-width:min(560px,calc(100vw - 1rem))}
.current-shot-offcanvas .offcanvas-body{padding-bottom:2rem}
.current-shot-offcanvas [data-current-shot-panel][hidden]{display:none!important}
@media(max-width:575.98px){.shooting-session-page{padding-bottom:5.5rem!important}.current-shot-floating{right:max(.75rem,env(safe-area-inset-right));bottom:max(.75rem,env(safe-area-inset-bottom))}.current-shot-floating-action{padding:.55rem .7rem;font-size:.9rem}.current-shot-offcanvas{--bs-offcanvas-width:100vw;border-left:0}}

/* Location Shoot: lightweight Area divider above each contiguous Place group. */
.session-area-divider{display:flex;flex-wrap:wrap;align-items:center;gap:.4rem .6rem;padding:.2rem .15rem .35rem;border-bottom:1px solid rgba(255,132,24,.35)}
.session-area-divider strong{font-size:.95rem}


/* Shoot review route/photo presentation — 2026-08-11 */
.shoot-review-route-timeline{border-left:0;padding-left:0}
.shoot-review-reference-photo{width:160px;height:120px;flex:0 0 auto;object-fit:cover;border-radius:.55rem}
.shoot-route-photo-group{padding-top:.75rem;border-top:1px solid var(--csg-border)}
.shoot-route-photo-grid{display:flex;flex-wrap:wrap;gap:.55rem}
.shoot-route-photo-thumb{width:92px;height:69px;padding:0;border:2px solid transparent;border-radius:.55rem;background:#111;overflow:hidden}
.shoot-route-photo-thumb img{width:100%;height:100%;display:block;object-fit:cover}
.shoot-route-photo-thumb.is-matched,.shoot-photo-thumb.is-matched{border:2px solid #198754}
.shoot-photo-thumb.is-unmatched{border:2px solid #dc3545}
@media(max-width:575.98px){.shoot-review-reference-photo{width:108px;height:81px}.shoot-route-photo-thumb{width:78px;height:59px}}

/* Shoot review usability refinements — 2026-08-11 */
.session-timeline-entry-summary-meta{display:flex;align-items:center;gap:.4rem;flex-wrap:wrap;justify-content:flex-end}
.shoot-review-reference-button{width:160px;height:120px;flex:0 0 auto}
.shoot-review-reference-button .shoot-review-reference-photo{width:100%;height:100%}
@media(max-width:575.98px){.session-timeline-entry-summary-meta{justify-content:flex-start}.shoot-review-reference-button{width:108px;height:81px}}


/* Shoot Route keeps a full-width outer card; only the route timeline is kept compact on desktop. */
@media (min-width: 992px) {
    #shoot-route .shoot-review-route-timeline {
        width: 60%;
        max-width: 820px;
    }
}
/* Shooting-session paired summary cards and compact review controls — 2026-08-12 */
.shooting-session-summary-grid{align-items:start}
.shoot-summary-card{min-height:104px}
.timeline-utility-actions{align-items:center}
@media (min-width: 992px){
  #shoot-route .shoot-review-route-header{width:60%;max-width:820px}
}
@media (max-width: 575.98px){
  .shoot-summary-card{min-height:0}
}