/* ============================================================
   Gym app: template list, plan builder (Phase 3), session (Phase 4).
   ============================================================ */

/* ---- Gym section tabs ---- */

/* Sits between the page header and its content on every top-level gym screen. On
   desktop the side-nav already shows the section; this is what carries it on mobile,
   where the nav is a drawer. Max-width keeps it from stretching across a wide page. */
.gg-gymtabs {
    max-width: 360px;
    margin-bottom: var(--gg-s6);
}

.gg-gymtabs .gg-segments__cell { min-height: var(--gg-tap-min); }

/* ---- Template list ---- */

/* Resume banner — accent border, because an unfinished session is the one thing
   on this screen that is already happening. */
.gg-resume {
    display: flex;
    align-items: center;
    gap: var(--gg-s3);
    padding: var(--gg-s3);
    margin-bottom: var(--gg-s6);
    background: var(--gg-surface);
    border-left: 2px solid var(--gg-accent);
}

.gg-resume__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gg-resume__name { font-size: 16px; font-weight: 800; }
.gg-resume__meta { font-size: 11px; color: var(--gg-dim); }

.gg-templates { display: flex; flex-direction: column; gap: 2px; }

.gg-templates__row {
    display: flex;
    align-items: center;
    gap: var(--gg-s2);
    padding: var(--gg-s3) var(--gg-s4);
    min-height: 72px;
}

.gg-templates__info {
    flex: 1;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 2px;
    cursor: pointer;
}

/* Three controls now share the row — truncate rather than let a long name wrap it open. */
.gg-templates__name { font-size: 16px; font-weight: 800; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gg-templates__meta { font-size: 11px; color: var(--gg-dim); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.gg-templates__start { min-height: 48px; }

.gg-templates__confirm { display: flex; gap: var(--gg-s2); margin-top: var(--gg-s4); }
.gg-templates__confirm .gg-btn { flex: 1; min-height: var(--gg-tap-set); }

/* ---- Builder layout ---- */

.gg-builder { min-height: 100%; display: flex; flex-direction: column; }

.gg-builder__header {
    display: flex;
    align-items: center;
    gap: var(--gg-s3);
    padding: var(--gg-s3) var(--gg-s4);
    border-bottom: 2px solid var(--gg-divider);
    position: sticky;
    top: 0;
    background: var(--gg-ground);
    z-index: 30;
}

.gg-builder__titles { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }

.gg-builder__name {
    background: transparent;
    border: none;
    border-bottom: 2px solid transparent;
    font-size: 19px;
    font-weight: 800;
    color: var(--gg-ink);
    padding: 0;
    width: 100%;
}

.gg-builder__name:focus { outline: none; border-bottom-color: var(--gg-accent); }

.gg-builder__error { padding: var(--gg-s3) var(--gg-s4); color: var(--gg-accent); }

.gg-builder__grid {
    flex: 1;
    display: grid;
    grid-template-columns: 1fr;
}

.gg-builder__library, .gg-builder__inspector { display: none; }

.gg-builder__canvas {
    padding: var(--gg-s4);
    max-width: 640px;
    width: 100%;
    margin: 0 auto;
}

.gg-builder__meta { margin-bottom: var(--gg-s3); }

.gg-builder__add { width: 100%; margin-top: var(--gg-s3); }

@media (min-width: 1200px) {
    .gg-builder__grid { grid-template-columns: 290px 1fr 320px; }

    .gg-builder__library {
        display: block;
        border-right: 2px solid var(--gg-divider);
        padding: var(--gg-s4);
        overflow-y: auto;
        max-height: calc(100dvh - 130px);
        position: sticky;
        top: 74px;
    }

    .gg-builder__inspector {
        display: block;
        border-left: 2px solid var(--gg-divider);
        padding: var(--gg-s4);
        position: sticky;
        top: 74px;
        max-height: calc(100dvh - 130px);
        overflow-y: auto;
    }

    .gg-builder__canvas { max-width: none; }

    /* Desktop edits happen in the inspector, not the sheet */
    .gg-builder__slot-sheet { display: none; }
}

.gg-builder__inspector-empty { display: flex; flex-direction: column; gap: var(--gg-s2); }

/* ---- Library pane ---- */

.gg-library { display: flex; flex-direction: column; gap: var(--gg-s3); }

/* The catalog carries 13 muscle groups — wrapping would cost 3-4 lines of sheet header
   before a single result is visible, so the chip rows scroll sideways instead. */
.gg-library__chips, .gg-picker__chips {
    display: flex;
    flex-wrap: nowrap;
    gap: var(--gg-s2);
    overflow-x: auto;
    scrollbar-width: none;
    -webkit-overflow-scrolling: touch;
}

.gg-library__chips::-webkit-scrollbar, .gg-picker__chips::-webkit-scrollbar { display: none; }

.gg-library__chips .gg-chip, .gg-picker__chips .gg-chip { flex: 0 0 auto; }

.gg-library__rows { display: flex; flex-direction: column; gap: 1px; }

.gg-library__row {
    display: grid;
    grid-template-columns: 20px 1fr;
    grid-template-areas: "grip name" "grip meta";
    column-gap: var(--gg-s2);
    align-items: center;
    min-height: 52px;
    padding: 6px var(--gg-s2);
    background: var(--gg-surface);
    cursor: grab;
    touch-action: none;
    user-select: none;
    -webkit-user-select: none;
}

.gg-library__grip { grid-area: grip; color: var(--gg-dim); }
.gg-library__name { grid-area: name; font-size: 13px; font-weight: 800; }
.gg-library__meta { grid-area: meta; font-size: 10.5px; color: var(--gg-dim); }

.gg-library__row:hover { background: var(--gg-row); }

/* ---- Block card (rail + card, shared grammar with the session screen) ---- */

.gg-block {
    display: flex;
    gap: 0;
    margin-bottom: 0;
}

.gg-block__rail {
    width: 34px;
    flex-shrink: 0;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.gg-block__letter {
    width: 34px;
    height: 34px;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 15px;
    font-weight: 800;
    background: var(--gg-divider);
    color: var(--gg-ink);
}

.gg-block--group .gg-block__letter { background: var(--gg-accent); color: var(--gg-on-accent); }

.gg-block__line { flex: 1; width: 2px; background: var(--gg-divider); }
.gg-block--group .gg-block__line { background: var(--gg-accent); }

.gg-block__token {
    width: 34px;
    height: 34px;
    border: 2px solid var(--gg-divider);
    background: var(--gg-surface);
    display: flex;
    align-items: center;
    justify-content: center;
}

.gg-block--group .gg-block__token { border-color: var(--gg-accent); }

.gg-block__token-x { font-size: 12px; font-weight: 800; color: var(--gg-muted); }
.gg-block--group .gg-block__token-x { color: var(--gg-accent); }

.gg-block__card {
    flex: 1;
    min-width: 0;
    background: var(--gg-surface);
    border-left: 2px solid var(--gg-divider);
}

.gg-block--group .gg-block__card { border-left-color: var(--gg-accent); }

.gg-block--drop .gg-block__card {
    outline: 2px dashed var(--gg-accent);
    outline-offset: -2px;
    background: var(--gg-drop-fill);
}

.gg-block__head {
    display: flex;
    align-items: center;
    gap: var(--gg-s2);
    padding: var(--gg-s3) var(--gg-s3) var(--gg-s2);
}

.gg-block__type {
    font-size: 10.5px;
    font-weight: 800;
    letter-spacing: .15em;
    text-transform: uppercase;
    color: var(--gg-muted);
}

.gg-block--group .gg-block__type { color: var(--gg-accent); }

.gg-block__rest { margin-left: auto; }

/* Round tick strip — the countable reading of the round pointer. */
.gg-block__ticks { display: flex; gap: 3px; margin-left: var(--gg-s3); }

.gg-block__tick {
    width: 26px;
    height: 6px;
    background: var(--gg-divider);
}

.gg-block__tick.is-done { background: var(--gg-good); }
.gg-block__tick.is-current { background: var(--gg-accent); }
.gg-block__remove { width: 32px; height: 32px; color: var(--gg-dim); }

.gg-block__drophint {
    margin: 0 var(--gg-s3) var(--gg-s2);
    color: var(--gg-accent);
}

/* ---- Slots ---- */

.gg-slot {
    display: flex;
    align-items: center;
    gap: var(--gg-s2);
    min-height: 52px;
    padding: 0 var(--gg-s3);
    border-top: 1px solid var(--gg-divider);
    cursor: pointer;
    user-select: none;
    -webkit-user-select: none;
}

.gg-slot.is-selected { box-shadow: inset 3px 0 0 var(--gg-accent); background: var(--gg-row); }

.gg-slot__handle {
    color: var(--gg-dim);
    display: flex;
    align-items: center;
    touch-action: none;
    cursor: grab;
    padding: var(--gg-s2) 2px;
}

.gg-slot__name { font-size: 14px; font-weight: 800; flex: 1; min-width: 0; }

.gg-slot__rx { font-size: 11px; color: var(--gg-dim); white-space: nowrap; }

.gg-slot__remove { width: 32px; height: 32px; color: var(--gg-dim); }

/* ---- Block config ---- */

.gg-block__config {
    display: flex;
    flex-wrap: wrap;
    align-items: flex-end;
    gap: var(--gg-s3);
    padding: var(--gg-s3);
    border-top: 1px solid var(--gg-divider);
}

.gg-block__config-item { display: flex; flex-direction: column; gap: 6px; }

.gg-block__addslot { min-height: 40px; font-size: 11px; padding: 0 var(--gg-s3); }

/* ---- Drop gaps between blocks ---- */

.gg-dropgap {
    height: var(--gg-s6);
    transition: height 120ms ease-out;
}

.gg-dropgap.is-open {
    border: 2px dashed var(--gg-divider);
    height: 40px;
    margin: var(--gg-s2) 0;
}

.gg-dropgap.is-active {
    border-color: var(--gg-accent);
    background: var(--gg-drop-fill);
}

/* ---- Drag ghost (created by dragdrop.js) ---- */

.gg-drag-ghost {
    position: fixed;
    top: 0;
    left: 0;
    z-index: 200;
    pointer-events: none;
    background: var(--gg-drag);
    box-shadow: var(--gg-shadow-drag);
    opacity: .95;
    overflow: hidden;
}

.gg-drag-source { opacity: .35; }

body.gg-dragging { cursor: grabbing; }
body.gg-dragging * { cursor: grabbing; }

/* ---- Prescription editor ---- */

.gg-rx { display: flex; flex-direction: column; gap: var(--gg-s4); }

.gg-rx__exercise { font-size: 17px; font-weight: 800; margin-top: 2px; }

.gg-rx__section { display: flex; flex-direction: column; gap: var(--gg-s2); }

.gg-rx__range { display: flex; align-items: center; gap: var(--gg-s2); }

.gg-rx__num { width: 84px; text-align: center; font-weight: 800; font-size: 17px; }

.gg-rx__dash { color: var(--gg-dim); font-size: 18px; }

.gg-rx__load { display: flex; align-items: center; gap: var(--gg-s2); }

.gg-rx__load-value { width: 120px; font-size: 22px; }

.gg-rx__resolved { border-left: 2px solid var(--gg-divider); padding-left: var(--gg-s3); }

/* % 1RM inspector panel: the percentage dominates, resolved kg follows in copy. */
.gg-rx__pct {
    display: flex;
    flex-direction: column;
    gap: var(--gg-s3);
    padding: var(--gg-s3);
    background: var(--gg-surface);
    border: 2px solid var(--gg-divider);
}

.gg-rx__pct-head { display: flex; align-items: baseline; gap: var(--gg-s2); }

.gg-rx__pct-value {
    width: 124px;
    padding: 0;
    background: none;
    border: none;
    color: var(--gg-ink);
    font-family: inherit;
    font-size: 44px;
    font-weight: 800;
    line-height: 1;
}

.gg-rx__pct-value:focus { outline: none; color: var(--gg-accent); }

.gg-rx__pct-bar { height: 6px; background: var(--gg-divider); }
.gg-rx__pct-fill { height: 100%; background: var(--gg-accent); }

/* Two chip rows: muscle group reads primary, equipment secondary. */
.gg-chip--equipment { color: var(--gg-muted); }
.gg-chip--equipment.is-active { color: var(--gg-on-accent); }

.gg-rx__note { color: var(--gg-dim); font-size: 12px; }

/* ---- Exercise picker sheet ---- */

.gg-picker { height: calc(100dvh - 88px); }

.gg-picker__head {
    display: flex;
    flex-direction: column;
    gap: var(--gg-s2);
    padding: var(--gg-s2) var(--gg-s4) var(--gg-s3);
}

.gg-picker__rows {
    flex: 1;
    overflow-y: auto;
    border-top: 2px solid var(--gg-divider);
}

.gg-picker__row {
    display: flex;
    align-items: center;
    gap: var(--gg-s2);
    min-height: 68px;
    padding: 0 var(--gg-s4);
    border-bottom: 1px solid var(--gg-divider);
    cursor: pointer;
}

.gg-picker__info { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gg-picker__name { font-size: 15px; font-weight: 800; }
.gg-picker__meta { font-size: 11px; color: var(--gg-dim); }

.gg-picker__pick {
    width: 48px;
    height: 48px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: var(--gg-muted);
    border: 1px solid var(--gg-divider);
}

.gg-picker__row.is-picked .gg-picker__pick {
    color: var(--gg-accent);
    border: 2px solid var(--gg-accent);
}

.gg-picker__footer {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gg-s3);
    padding: var(--gg-s3) var(--gg-s4);
    border-top: 2px solid var(--gg-divider);
    background: var(--gg-ground);
}

.gg-sheet__body { padding: var(--gg-s3) var(--gg-s4) var(--gg-s6); overflow-y: auto; }

/* ============================================================
   Active session (Phase 4)
   ============================================================ */

.gg-session-host { min-height: 100dvh; background: var(--gg-ground); }

.gg-session {
    display: flex;
    flex-direction: column;
    min-height: 100dvh;
    max-width: 640px;
    margin: 0 auto;
}

.gg-session__header {
    position: sticky;
    top: 0;
    z-index: 30;
    display: flex;
    align-items: center;
    gap: var(--gg-s3);
    background: var(--gg-ground);
    border-bottom: 2px solid var(--gg-divider);
    /* In-session screens are full-screen with no app chrome above them, so this
       header is what has to clear the status bar. */
    padding: calc(var(--gg-s3) + var(--gg-safe-top)) var(--gg-s4) var(--gg-s3);
}

.gg-session__titles { flex: 1; min-width: 0; display: flex; flex-direction: column; gap: 2px; }
.gg-session__title { font-size: 19px; font-weight: 800; }

.gg-session__elapsed {
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    gap: 2px;
}

.gg-session__progress {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: var(--gg-s3) var(--gg-s4);
}

.gg-session__bars { display: flex; gap: 2px; }

.gg-session__bar { height: 4px; flex: 1; background: var(--gg-divider); }
.gg-session__bar.is-done { background: var(--gg-good); }
.gg-session__bar.is-current { background: var(--gg-accent); }

.gg-session__blocks {
    flex: 1;
    display: flex;
    flex-direction: column;
    gap: var(--gg-s6);
    padding: var(--gg-s2) var(--gg-s4) 120px;
}

.gg-block__token-of { font-size: 8px; color: var(--gg-dim); margin-left: 1px; }

.gg-session__exercise { border-top: 1px solid var(--gg-divider); padding: var(--gg-s3) 0; }
.gg-session__exercise:first-of-type { border-top: none; }

.gg-session__exercise-head {
    display: flex;
    flex-direction: column;
    gap: 2px;
    padding: 0 var(--gg-s3) var(--gg-s2);
}

.gg-session__exercise-name { font-size: 16px; font-weight: 800; }
.gg-session__exercise-meta { font-size: 11px; color: var(--gg-dim); }

/* Giant set: one compact line per member — name left, value stack right, so the
   cost of grouping stays flat as member count grows. */
.gg-session__compact {
    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--gg-s3);
    min-height: 56px;
    padding: var(--gg-s2) 0;
    border-top: 1px solid var(--gg-divider);
}

.gg-session__compact:first-of-type { border-top: none; }

.gg-session__compact.is-live {
    box-shadow: inset 3px 0 0 var(--gg-accent);
    background: var(--gg-row);
    padding-left: var(--gg-s3);
}

.gg-session__compact-name {
    font-size: 14px;
    font-weight: 800;
    min-width: 0;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gg-session__compact-values { display: flex; gap: var(--gg-s3); flex-shrink: 0; }
.gg-session__compact-cell { display: flex; flex-direction: column; align-items: flex-end; }
.gg-session__compact-value { font-size: 19px; font-weight: 800; }

/* ---- Set rows ---- */

.gg-setrow {
    display: grid;
    align-items: center;
    gap: var(--gg-s2);
    min-height: 52px;
    padding: var(--gg-s1) var(--gg-s3);
}

.gg-setrow__index { font-size: 12px; font-weight: 800; color: var(--gg-dim); }

.gg-setrow__cell { display: flex; flex-direction: column; }

.gg-setrow__value { font-weight: 800; font-variant-numeric: tabular-nums; }
.gg-setrow__value--xl { font-size: 30px; }
.gg-setrow__value--l { font-size: 24px; }
.gg-setrow__value--m { font-size: 19px; }

.gg-setrow__unit {
    font-size: 8.5px;
    font-weight: 800;
    letter-spacing: .12em;
    text-transform: uppercase;
    color: var(--gg-dim);
}

.gg-setrow__last { display: flex; flex-direction: column; align-items: flex-end; }
.gg-setrow__last-value { font-size: 13px; font-weight: 800; color: var(--gg-muted); font-variant-numeric: tabular-nums; }

.gg-setrow.is-live {
    background: var(--gg-row);
    box-shadow: inset 4px 0 0 var(--gg-accent);
    min-height: 68px;
    cursor: pointer;
}

.gg-setrow.is-live .gg-setrow__index { color: var(--gg-accent); }

.gg-setrow.is-pending { opacity: .5; }
.gg-setrow.is-pending .gg-setrow__value { color: var(--gg-dim); font-size: 18px; }

.gg-setrow.is-done .gg-setrow__index { color: var(--gg-good); }

.gg-setrow.is-short { box-shadow: inset 3px 0 0 var(--gg-dim); }
.gg-setrow.is-short .gg-setrow__value { color: var(--gg-muted); }
.gg-setrow.is-short .gg-setrow__index { color: var(--gg-dim); }

.gg-setrow.is-pr {
    background: var(--gg-row);
    box-shadow: inset 3px 0 0 var(--gg-accent);
}

.gg-setrow.is-pr .gg-setrow__index,
.gg-setrow.is-pr .gg-setrow__value { color: var(--gg-accent); }

/* ---- Bottom bar ---- */

.gg-session__bottombar {
    position: sticky;
    bottom: 0;
    z-index: 30;
    display: flex;
    gap: var(--gg-s2);
    background: var(--gg-ground);
    border-top: 2px solid var(--gg-divider);
    /* The 76px primary is the most-tapped control in the app and sits exactly where
       Android's gesture bar lives — this inset is what keeps it reachable. */
    padding: var(--gg-s3) var(--gg-s4) calc(14px + var(--gg-safe-bottom));
}

.gg-session__log {
    flex: 1;
    min-height: var(--gg-tap-primary);
    background: var(--gg-accent);
    color: var(--gg-on-accent);
    display: flex;
    flex-direction: column;
    align-items: flex-start; /* flush left per the system */
    justify-content: center;
    gap: 2px;
    padding: 0 var(--gg-s4);
}

.gg-session__log:active { background: var(--gg-accent-pressed); }

.gg-session__log-label {
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    max-width: 100%;
}

.gg-session__log-value { font-size: 28px; font-weight: 800; font-variant-numeric: tabular-nums; }

.gg-session__edit {
    width: var(--gg-tap-primary);
    min-height: var(--gg-tap-primary);
    border: 2px solid var(--gg-divider);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
    color: var(--gg-ink);
}

/* ---- Rest overlay ---- */

.gg-rest .gg-sheet { width: 100%; }

.gg-rest__body {
    display: flex;
    flex-direction: column;
    gap: var(--gg-s3);
    padding: var(--gg-s3) var(--gg-s4) var(--gg-s6);
}

.gg-rest__clock { display: flex; align-items: baseline; gap: var(--gg-s3); }

.gg-rest__bar { display: flex; gap: 2px; height: 6px; }
.gg-rest__bar-fill { background: var(--gg-accent); }
.gg-rest__bar-track { background: var(--gg-divider); }

.gg-rest__logged {
    display: flex;
    flex-direction: column;
    gap: 6px;
    padding: var(--gg-s3);
    background: var(--gg-row);
}

.gg-rest__logged-row { display: flex; align-items: center; gap: var(--gg-s3); }
.gg-rest__logged-value { font-size: 30px; font-weight: 800; }

.gg-rest__coach { color: var(--gg-muted); }

/* Tags: the one place a status word is spelled out. */
.gg-tag {
    display: inline-flex;
    align-items: center;
    height: 24px;
    padding: 0 var(--gg-s2);
    font-size: 9.5px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
}

.gg-tag--good { background: var(--gg-good); color: var(--gg-ground); }
.gg-tag--pr { background: var(--gg-accent); color: var(--gg-on-accent); }
.gg-tag--dim { background: var(--gg-divider); color: var(--gg-ink); }

/* --- Docked rest pill --- */
.gg-restpill {
    position: fixed;
    left: calc(var(--gg-s4) + var(--gg-safe-left));
    right: calc(var(--gg-s4) + var(--gg-safe-right));
    /* Sits above the bottom bar, which itself already clears the gesture area. */
    bottom: calc(var(--gg-tap-primary) + var(--gg-s6) + var(--gg-safe-bottom));
    display: flex;
    height: var(--gg-tap-set);
    background: var(--gg-surface);
    border: 2px solid var(--gg-accent);
    z-index: 40;
}

.gg-restpill__body {
    flex: 1;
    display: flex;
    align-items: center;
    gap: var(--gg-s3);
    padding: 0 var(--gg-s3);
    background: none;
    border: none;
    color: var(--gg-ink);
    text-align: left;
    cursor: pointer;
}

.gg-restpill__time {
    font-size: 30px;
    font-weight: 800;
    color: var(--gg-accent);
}

.gg-restpill__labels { display: flex; flex-direction: column; gap: 2px; min-width: 0; }

.gg-restpill__next {
    font-size: 11px;
    color: var(--gg-dim);
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.gg-restpill__skip {
    width: var(--gg-tap-min);
    background: none;
    border: none;
    border-left: 2px solid var(--gg-divider);
    color: var(--gg-muted);
    font-size: 10px;
    font-weight: 800;
    letter-spacing: .14em;
    text-transform: uppercase;
    cursor: pointer;
}

.gg-restpill__skip:active { background: var(--gg-row); }

.gg-rest__actions { display: flex; gap: var(--gg-s2); margin-top: var(--gg-s2); }
.gg-rest__skip { flex: 1; }
.gg-rest__extend { width: 64px; justify-content: center; }

/* ---- Overflow sheet ---- */

.gg-overflow { display: flex; flex-direction: column; padding-bottom: var(--gg-s4); }

.gg-overflow__row {
    display: flex;
    align-items: center;
    gap: var(--gg-s3);
    min-height: 60px;
    padding: 0 var(--gg-s4);
    font-size: 14px;
    font-weight: 800;
    color: var(--gg-ink);
    border-bottom: 1px solid var(--gg-divider);
    text-align: left;
}

.gg-overflow__note { padding: var(--gg-s3) var(--gg-s4) 0; color: var(--gg-dim); }

/* ---- Session done ---- */

.gg-session-done {
    min-height: 100dvh;
    display: flex;
    flex-direction: column;
    justify-content: center;
    gap: var(--gg-s4);
    max-width: 480px;
    margin: 0 auto;
    padding: var(--gg-s4);
}