#project-overlay .po-bookmarks {
    position: fixed;
    z-index: 210;
    top: 50%;
    right: auto;
    left: calc(50% + 575px);
    width: clamp(100px, calc(50vw - 600px), 180px);
    max-height: 58vh;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    gap: 11px;
    overflow: auto;
    transform: translateY(-50%);
    scrollbar-width: none;
}

#project-overlay .po-bookmarks[hidden] { display: none; }
#project-overlay .po-bookmarks::-webkit-scrollbar { display: none; }

#project-overlay .po-bookmarks button {
    max-width: 100%;
    padding: 2px 0;
    border: 0;
    border-bottom: 1px solid transparent;
    background: transparent;
    color: rgba(255, 255, 255, 0.58);
    cursor: pointer;
    font: inherit;
    font-size: 0.73rem;
    line-height: 1.3;
    text-align: left;
    transition: color 160ms ease, border-color 160ms ease;
}

#project-overlay .po-bookmarks button:hover,
#project-overlay .po-bookmarks button:focus-visible,
#project-overlay .po-bookmarks button.is-active {
    border-bottom-color: currentColor;
    color: #fff;
}

#project-overlay .po-bookmark-target { scroll-margin-block: 24px 0; }
#project-overlay[data-bookmark-scroll-align="center"] .po-bookmark-target { scroll-margin-block: 0; }

#project-overlay .po-block--section,
#project-overlay .po-block--process,
#project-overlay .po-block--insight,
#project-overlay .po-block--findings,
#project-overlay .po-block--cards {
    max-width: 900px;
    margin: 0 auto 1.5rem;
    padding: 2.25rem 2rem;
}

#project-overlay .po-block--section > span,
#project-overlay .po-block--insight > span {
    display: block;
    margin-bottom: 0.75rem;
    color: #176b87;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
}

#project-overlay .po-block--section h2,
#project-overlay .po-block--process > h2,
#project-overlay .po-block--insight h2,
#project-overlay .po-block--findings > h2,
#project-overlay .po-block--cards > h2 {
    margin: 0;
    color: var(--game-ui-text, #171715);
    font-size: clamp(1.8rem, 3vw, 2.8rem);
    font-weight: 550;
    line-height: 1.05;
}

#project-overlay .po-block--section p,
#project-overlay .po-block--insight p {
    max-width: 680px;
    margin: 1rem 0 0;
    color: var(--game-ui-muted, #686864);
    line-height: 1.65;
}

#project-overlay .po-block--process ol {
    margin: 1.5rem 0 0;
    padding: 0;
    list-style: none;
}

#project-overlay .po-block--process li {
    display: grid;
    grid-template-columns: 42px minmax(0, 1fr);
    gap: 16px;
    padding: 1rem 0;
}

#project-overlay .po-block--process li > span { color: #176b87; font-size: 0.72rem; }
#project-overlay .po-block--process h3 { margin: 0; color: var(--game-ui-text, #171715); font-size: 1rem; }
#project-overlay .po-block--process li p { margin: 0.45rem 0 0; color: var(--game-ui-muted, #686864); line-height: 1.55; }

#project-overlay .po-block--insight {
    border-left: 3px solid #176b87;
    background: var(--game-ui-surface-muted, #f4f4f1);
}

#project-overlay .po-block--findings ul {
    display: grid;
    gap: 8px;
    margin: 1.25rem 0 0;
    padding: 0;
    list-style: none;
}

#project-overlay .po-block--findings li {
    display: grid;
    grid-template-columns: 10px minmax(0, 1fr);
    gap: 14px;
    padding: 1rem 1.1rem;
    border: 1px solid var(--game-ui-border, #deded9);
    background: #f7f7f5;
}

#project-overlay .po-block--findings li > span {
    width: 8px;
    height: 8px;
    margin-top: 5px;
    border-radius: 50%;
    background: #777;
}

#project-overlay .po-block--findings li[data-tone="warning"] { background: #fff2f4; }
#project-overlay .po-block--findings li[data-tone="warning"] > span { background: #d44862; }
#project-overlay .po-block--findings li[data-tone="positive"] { background: #edf7e8; }
#project-overlay .po-block--findings li[data-tone="positive"] > span { background: #438445; }
#project-overlay .po-block--findings h3,
#project-overlay .po-block--cards h3 { margin: 0; color: var(--game-ui-text, #171715); font-size: 0.98rem; }
#project-overlay .po-block--findings p,
#project-overlay .po-block--cards p { margin: 0.35rem 0 0; color: var(--game-ui-muted, #686864); line-height: 1.55; }

#project-overlay .po-card-grid {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 10px;
    margin-top: 1.25rem;
}

#project-overlay .po-card-grid article {
    min-height: 150px;
    padding: 1.25rem;
    border: 1px solid var(--game-ui-border, #deded9);
    background: #fff;
}

#project-overlay .po-card-grid article > span {
    display: block;
    margin-bottom: 1.4rem;
    color: #176b87;
    font-size: 0.68rem;
    font-weight: 700;
    text-transform: uppercase;
}

#project-overlay .po-repeater-list { display: grid; gap: 8px; margin-top: 10px; }
#project-overlay .po-repeater-row { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 8px; padding: 10px 0; border-bottom: 1px solid var(--game-ui-border, #deded9); }
#project-overlay .po-repeater-row > div { display: grid; gap: 5px; }
#project-overlay .po-repeater-remove { align-self: start; border: 0; background: none; color: #a02b2b; cursor: pointer; font-size: 1.15rem; }

@media (max-width: 1419px) {
    #project-overlay .po-bookmark-target { scroll-margin-top: 80px; }
    #project-overlay .po-bookmarks {
        top: 16px;
        right: auto;
        left: 50%;
        width: auto;
        max-width: calc(100vw - 150px);
        min-height: 38px;
        max-height: none;
        padding: 7px 12px;
        flex-direction: row;
        align-items: center;
        gap: 14px;
        overflow-x: auto;
        background: rgba(255, 255, 255, 0.94);
        border: 1px solid var(--game-ui-border, #deded9);
        border-radius: 5px;
        backdrop-filter: blur(10px);
        transform: translateX(-50%);
    }
    #project-overlay .po-bookmarks button { flex: 0 0 auto; text-align: left; white-space: nowrap; }
    #project-overlay .po-bookmarks button { color: var(--game-ui-muted, #686864); }
    #project-overlay .po-bookmarks button:hover,
    #project-overlay .po-bookmarks button:focus-visible,
    #project-overlay .po-bookmarks button.is-active { color: var(--game-ui-text, #171715); }
}

@media (max-width: 768px) {
    #project-overlay .po-bookmarks { display: none !important; }
    #project-overlay .po-block--section,
    #project-overlay .po-block--process,
    #project-overlay .po-block--insight,
    #project-overlay .po-block--findings,
    #project-overlay .po-block--cards { padding-right: 1rem; padding-left: 1rem; }
    #project-overlay .po-card-grid { grid-template-columns: 1fr; }
}