.title-finder-shell {
    display: grid;
    grid-template-columns: minmax(250px, 320px) minmax(0, 1fr) minmax(270px, 340px);
    gap: 12px;
    min-height: calc(100vh - 150px);
}

.title-layer-panel,
.title-data-panel {
    position: sticky;
    top: 18px;
    align-self: start;
    max-height: calc(100vh - 42px);
    overflow: auto;
}

.title-layer-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 12px;
    margin-bottom: 12px;
}

.title-layer-search {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 8px;
    margin-bottom: 12px;
}

.title-layer-search input,
.title-radius-input {
    width: 100%;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 8px;
    padding: 11px 12px;
    background: rgba(0,0,0,.22);
    color: #e9f3ec;
    font-weight: 800;
}

.title-layer-search button {
    min-width: 48px;
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 8px;
    background: rgba(255,255,255,.06);
    color: #e9f3ec;
    font-weight: 950;
    cursor: pointer;
}

.title-sample-actions {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 8px;
    margin: -4px 0 12px;
}

.title-sample-actions button {
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    padding: 9px 10px;
    background: rgba(133, 197, 232, .12);
    color: #dce9e0;
    font-weight: 900;
    cursor: pointer;
}

.title-sample-actions button:first-child {
    border-color: rgba(158, 219, 116, .38);
    background: rgba(158, 219, 116, .16);
    color: #c9f5b1;
}

.title-layer-list {
    display: grid;
    gap: 6px;
    margin: 12px 0;
}

.title-layer-toggle {
    display: grid;
    grid-template-columns: auto 1fr auto;
    align-items: center;
    gap: 10px;
    min-height: 42px;
    padding: 8px 10px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 8px;
    background: rgba(255,255,255,.04);
    color: #dce9e0;
    cursor: pointer;
}

.title-layer-toggle input {
    width: 18px;
    height: 18px;
    accent-color: #85c5e8;
}

.title-layer-toggle b {
    color: #94a59c;
    font-size: 1.1rem;
}

.title-layer-toggle.restriction-layer b {
    min-width: 28px;
    text-align: center;
    border-radius: 999px;
    padding: 3px 7px;
    background: rgba(133, 197, 232, .14);
    color: #bfe9ff;
    font-size: .78rem;
}

.title-layer-toggle.title-group-toggle {
    border-color: rgba(255, 210, 31, .28);
    background: rgba(255, 210, 31, .08);
}

.title-layer-toggle.title-group-toggle b {
    min-width: 44px;
    text-align: center;
    border-radius: 999px;
    padding: 3px 8px;
    background: rgba(255, 210, 31, .16);
    color: #ffe887;
    font-size: .78rem;
}

.title-layer-toggle.unavailable {
    cursor: not-allowed;
    opacity: .56;
}

.title-layer-toggle.unavailable b {
    font-size: .72rem;
    text-transform: uppercase;
    letter-spacing: .06em;
}

.title-colour-help {
    display: flex;
    flex-wrap: wrap;
    gap: 7px;
    margin: 8px 0 14px;
}

.title-colour-help span {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    color: #b9c7bf;
    font-size: 11px;
    font-weight: 760;
}

.legend-swatch {
    width: 14px;
    height: 10px;
    border-radius: 3px;
    border: 2px solid #f7fff8;
    background: rgba(255,255,255,.06);
}

.legend-swatch.selected {
    border-color: #ff4fd8;
    background: rgba(255,79,216,.28);
}

.legend-swatch.high {
    border-color: #ef3f3f;
    background: rgba(239,63,63,.25);
}

.legend-swatch.watch {
    border-color: #e8b34f;
    background: rgba(232,179,79,.22);
}

.legend-swatch.normal {
    border-color: #f7fff8;
}

.title-live-note {
    margin-top: 12px;
    padding: 12px;
    border-left: 4px solid #e8b34f;
    border-radius: 8px;
    background: rgba(0,0,0,.22);
    color: #aebdb5;
    font-size: 0.9rem;
    line-height: 1.45;
}

.title-coverage-note {
    border-left-color: #85c5e8;
    background: rgba(133, 197, 232, .08);
}

.title-map-stage {
    position: relative;
    min-height: calc(100vh - 150px);
    overflow: hidden;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 8px;
    background: #08100e;
    box-shadow: 0 24px 70px rgba(0,0,0,.34);
}

.title-map-breadcrumb {
    position: absolute;
    z-index: 550;
    top: 14px;
    left: 50%;
    transform: translateX(-50%);
    max-width: calc(100% - 80px);
    padding: 8px 14px;
    border: 1px solid rgba(255,255,255,.18);
    border-radius: 6px;
    background: rgba(202, 236, 220, .9);
    color: #13211b;
    font-size: 0.9rem;
    font-weight: 800;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.title-map-source-badge {
    position: absolute;
    z-index: 550;
    left: 14px;
    top: 14px;
    display: grid;
    gap: 2px;
    max-width: 240px;
    padding: 10px 12px;
    border: 1px solid rgba(255, 79, 216, .42);
    border-left: 4px solid #ff4fd8;
    border-radius: 8px;
    background: rgba(7, 16, 13, .82);
    color: #f5f8ef;
    box-shadow: 0 18px 38px rgba(0, 0, 0, .28);
}

.title-map-source-badge strong,
.title-map-source-badge span,
.title-map-source-badge small {
    display: block;
}

.title-map-source-badge span {
    color: #f7b6ec;
    font-size: 12px;
    font-weight: 900;
}

.title-map-source-badge small {
    color: #a8b9af;
    font-size: 11px;
    line-height: 1.35;
}

.title-map-stage #fruitbowl-title-outlines-map {
    height: calc(100vh - 150px);
    min-height: 640px;
    border-radius: 0;
    background: #08100e;
}

.title-map-stage .leaflet-container {
    background: #08100e;
}

.title-data-panel {
    display: grid;
    gap: 12px;
}

.title-action-menu {
    border-left: 4px solid #9edb74;
}

.title-page-actions {
    display: grid;
    gap: 8px;
    margin-bottom: 12px;
}

.title-page-action {
    display: grid;
    grid-template-columns: minmax(0, 1fr) auto;
    align-items: center;
    gap: 10px;
    width: 100%;
    padding: 11px 12px;
    border: 1px solid rgba(255,255,255,.12);
    border-radius: 8px;
    background: rgba(255,255,255,.045);
    color: #e9f3ec;
    text-align: left;
    cursor: pointer;
}

.title-page-action span {
    font-weight: 900;
}

.title-page-action b {
    padding: 5px 8px;
    border-radius: 999px;
    background: rgba(158, 219, 116, .14);
    color: #bff1a7;
    font-size: .82rem;
}

.title-page-action.active {
    border-color: rgba(226, 196, 92, .55);
    background: rgba(226, 196, 92, .12);
}

.title-page-action.active b {
    background: rgba(226, 196, 92, .22);
    color: #f5dc83;
}

.title-action-buttons {
    display: grid;
    grid-template-columns: 1fr;
    gap: 8px;
}

.title-action-buttons button,
.title-action-buttons .ghost-link-button {
    border: 1px solid rgba(255,255,255,.13);
    border-radius: 8px;
    padding: 10px;
    background: rgba(255,255,255,.06);
    color: #e9f3ec;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
}

.title-action-buttons button:first-child {
    background: linear-gradient(135deg, #75a8c4, #9edb74);
    color: #07110d;
}

.title-action-buttons button.secondary-action {
    background: rgba(255,255,255,.05);
    color: #dce9e0;
}

.title-action-buttons button:disabled {
    cursor: not-allowed;
    opacity: .48;
}

.title-action-hint {
    margin: 10px 0 0;
    padding: 10px 11px;
    border-left: 3px solid #85c5e8;
    border-radius: 8px;
    background: rgba(133, 197, 232, .08);
}

.title-save-overrides {
    margin-top: 12px;
    padding: 12px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 8px;
    background: rgba(0,0,0,.18);
}

.title-save-overrides textarea {
    min-height: 90px;
}

.title-project-picker {
    display: grid;
    gap: 8px;
    margin-top: 12px;
}

.title-project-picker-header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: 10px;
    color: #dce9e0;
}

.title-project-picker-header span {
    color: #94a59c;
    font-size: .88rem;
    font-weight: 800;
}

.title-project-option {
    display: grid;
    grid-template-columns: auto 1fr;
    gap: 10px;
    align-items: center;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 8px;
    background: rgba(255,255,255,.035);
    color: #dce9e0;
    cursor: pointer;
}

.title-project-option.selected {
    border-color: rgba(158, 219, 116, .48);
    background: rgba(158, 219, 116, .12);
}

.title-project-option input {
    width: 18px;
    height: 18px;
    accent-color: #9edb74;
}

.title-project-option strong,
.title-project-option small {
    display: block;
}

.title-project-option small {
    color: #94a59c;
    font-size: .82rem;
}

.ransom-config-modal {
    width: min(760px, calc(100vw - 48px));
}

.ransom-config-modal .panel-title {
    margin-bottom: 12px;
}

.ransom-config-grid {
    display: grid;
    grid-template-columns: repeat(3, minmax(0, 1fr));
    gap: 10px;
    margin: 14px 0;
}

.ransom-config-grid label,
.ransom-config-options {
    padding: 12px;
    border: 1px solid rgba(255,255,255,.09);
    border-radius: 8px;
    background: rgba(255,255,255,.035);
}

.ransom-config-grid label {
    display: grid;
    gap: 7px;
}

.ransom-config-grid span {
    color: #dce9e0;
    font-weight: 900;
}

.ransom-config-grid input {
    width: 100%;
    border: 1px solid rgba(255,255,255,.14);
    border-radius: 8px;
    padding: 10px;
    background: rgba(0,0,0,.22);
    color: #f4fbf5;
    font-weight: 900;
}

.ransom-config-grid small,
.ransom-config-summary span {
    color: #94a59c;
    font-size: .82rem;
}

.ransom-config-options {
    display: grid;
    gap: 8px;
}

.ransom-config-summary {
    display: grid;
    gap: 4px;
    margin: 12px 0;
    padding: 12px;
    border-left: 4px solid #df64d3;
    border-radius: 8px;
    background: rgba(223, 100, 211, .09);
}

.ransom-config-summary strong {
    color: #f7b6ec;
}

.title-fact-list {
    display: grid;
    gap: 9px;
    margin: 0;
}

.title-fact-list div {
    display: grid;
    grid-template-columns: 115px 1fr;
    gap: 10px;
    padding-bottom: 9px;
    border-bottom: 1px solid rgba(255,255,255,.08);
}

.title-fact-list dt {
    color: #94a59c;
    font-weight: 800;
}

.title-fact-list dd {
    margin: 0;
    color: #e9f3ec;
    font-weight: 850;
}

.title-selected-card {
    border-left: 4px solid #ef4f3f;
}

.title-selected-summary {
    display: grid;
    gap: 6px;
    margin-bottom: 12px;
    padding: 12px;
    border-radius: 8px;
    border: 1px solid rgba(255,255,255,.08);
    background: linear-gradient(135deg, rgba(240,107,216,.12), rgba(0,0,0,.18));
}

.title-selected-summary strong,
.title-selected-summary span {
    display: block;
}

.title-selected-summary strong {
    color: #f5f8ef;
    font-size: 1.08rem;
    line-height: 1.2;
}

.title-selected-summary span {
    color: #f7b6ec;
    font-size: .82rem;
    font-weight: 850;
}

.title-selected-summary p {
    margin: 0;
    color: #dce9e0;
    font-size: .9rem;
    line-height: 1.42;
}

.title-selected-diligence {
    display: grid;
    gap: 8px;
    margin-top: 12px;
    padding: 12px;
    border-left: 4px solid #e8b34f;
    border-radius: 8px;
    background: rgba(232,179,79,.08);
}

.title-selected-diligence strong,
.title-selected-diligence small {
    display: block;
}

.title-selected-diligence p,
.title-selected-diligence small {
    margin: 0;
    color: #a8b9af;
    font-size: .84rem;
    line-height: 1.42;
}

.title-next-step-actions {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
}

.title-next-step-actions a {
    display: grid;
    place-items: center;
    min-height: 38px;
    padding: 8px 10px;
    border: 1px solid rgba(232,179,79,.38);
    border-radius: 8px;
    background: rgba(232,179,79,.13);
    color: #f7dd88;
    font-weight: 900;
    text-align: center;
    text-decoration: none;
}

.title-next-step-actions a:hover {
    border-color: rgba(158,219,116,.5);
    background: rgba(158,219,116,.12);
    color: #c8ffb2;
}

.title-assembly-card {
    border-left: 4px solid #f06bd8;
}

.compact-title-facts {
    margin-top: 10px;
}

.compact-title-facts div {
    grid-template-columns: 130px 1fr;
}

.title-mini-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8px;
    margin-top: 12px;
}

.title-mini-button {
    display: grid;
    gap: 2px;
    padding: 9px;
    border-radius: 8px;
    border: 1px solid rgba(240,107,216,.24);
    background: rgba(240,107,216,.08);
    color: #e9f3ec;
    text-align: left;
    cursor: pointer;
}

.title-mini-button:hover,
.title-mini-button.active {
    border-color: rgba(255, 210, 31, .82);
    background: rgba(255, 210, 31, .14);
}

.title-mini-button span,
.title-mini-button small {
    display: block;
}

.title-mini-button small {
    color: #b8c6bd;
    font-size: .78rem;
}

.title-evidence-scroll {
    display: grid;
    gap: 8px;
    max-height: 320px;
    overflow: auto;
}

.title-evidence-button {
    display: grid;
    grid-template-columns: 1fr auto;
    gap: 10px;
    width: 100%;
    padding: 10px;
    border: 1px solid rgba(255,255,255,.08);
    border-radius: 8px;
    background: rgba(255,255,255,.035);
    color: #e9f3ec;
    text-align: left;
    cursor: pointer;
}

.title-evidence-button:hover,
.title-evidence-button.active {
    border-color: rgba(239,79,63,.62);
    background: rgba(239,79,63,.12);
}

.title-evidence-button.grouped {
    border-color: rgba(255, 210, 31, .7);
    background: rgba(255, 210, 31, .1);
    box-shadow: inset 3px 0 0 #ffd21f;
}

.title-evidence-button.grouped b {
    background: #ffd21f;
    color: #07110d;
}

.title-evidence-button span,
.title-evidence-button small {
    display: block;
    color: #94a59c;
}

.title-evidence-button b {
    display: grid;
    place-items: center;
    width: 42px;
    height: 42px;
    border-radius: 10px;
    color: #07110d;
    background: #e8b34f;
}

.title-empty-state,
.title-empty-card {
    border: 1px solid rgba(232, 179, 79, .28);
    border-radius: 8px;
    padding: 12px;
    background: rgba(232, 179, 79, .08);
    color: #dce9e0;
}

.title-empty-state {
    display: grid;
    gap: 6px;
}

.title-empty-state span,
.title-empty-card span {
    color: #a8b9af;
    line-height: 1.45;
}

.title-source-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(180px, 1fr));
    gap: 12px;
}

.title-feed-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(190px, 1fr));
    gap: 12px;
}

.title-feed-card {
    display: grid;
    gap: 10px;
    padding: 14px;
    border: 1px solid rgba(255,255,255,.1);
    border-radius: 8px;
    background: rgba(255,255,255,.035);
}

.title-feed-card div {
    display: flex;
    align-items: flex-start;
    justify-content: space-between;
    gap: 12px;
}

.title-feed-card strong,
.title-feed-card span,
.title-feed-card small {
    display: block;
}

.title-feed-card span {
    color: #e8d27a;
    font-weight: 850;
    text-align: right;
}

.title-feed-card code {
    width: fit-content;
    max-width: 100%;
    padding: 5px 7px;
    border-radius: 6px;
    background: rgba(0,0,0,.28);
    color: #9edb74;
    white-space: normal;
    overflow-wrap: anywhere;
}

.title-feed-card p {
    margin: 0;
    color: #dce9e0;
}

.title-feed-card small {
    color: #a8b9af;
    line-height: 1.45;
}

.title-focus-marker {
    position: relative;
}

.title-focus-marker span {
    position: absolute;
    inset: 6px;
    border: 3px solid #f5f8ef;
    border-radius: 50%;
    background: #ff4fd8;
    box-shadow:
        0 0 0 6px rgba(255, 79, 216, .30),
        0 0 24px rgba(255, 79, 216, .72),
        0 8px 20px rgba(0, 0, 0, .48);
}

.title-focus-marker::before,
.title-focus-marker::after {
    content: "";
    position: absolute;
    background: #ff4fd8;
    box-shadow: 0 0 0 1px rgba(245, 248, 239, .8);
}

.title-focus-marker::before {
    left: 17px;
    top: 0;
    width: 2px;
    height: 36px;
}

.title-focus-marker::after {
    left: 0;
    top: 17px;
    width: 36px;
    height: 2px;
}

@media (max-width: 1180px) {
    .title-finder-shell {
        grid-template-columns: 1fr;
    }

    .title-layer-panel,
    .title-data-panel {
        position: relative;
        top: auto;
        max-height: none;
    }

    .title-map-stage,
    .title-map-stage #fruitbowl-title-outlines-map {
        min-height: 560px;
        height: 560px;
    }
}

@media (max-width: 760px) {
    .title-source-grid,
    .title-feed-grid {
        grid-template-columns: 1fr;
    }

    .title-map-breadcrumb {
        left: 12px;
        right: 12px;
        top: 78px;
        transform: none;
        max-width: none;
    }

    .title-map-source-badge {
        left: 12px;
        right: 12px;
        max-width: none;
    }
}
