/* ==========================================================================
   post.css — Glideslope AI article detail page styles
   Extracted from post.php inline <style> blocks.
   ========================================================================== */

/* --- Lazy-load placeholder (featured media) --- */
.featured-media-placeholder {
    width: 100%;
    aspect-ratio: 16 / 9;
    background-color: var(--color-elevate);
    border-bottom: 1px solid var(--color-border);
    overflow: hidden;
    margin-bottom: 24px;
    position: relative;
    border-radius: 12px;
}
.featured-media-placeholder.loading::after {
    content: '';
    position: absolute;
    top: 50%;
    left: 50%;
    width: 48px;
    height: 48px;
    margin: -24px 0 0 -24px;
    border: 5px solid rgba(128, 128, 128, 0.2);
    border-top-color: var(--color-text-muted);
    border-radius: 50%;
    animation: spin 1s linear infinite;
}
.featured-media-placeholder .story-image {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}
.featured-media-placeholder .story-image.placeholder {
    object-fit: cover;
    padding: 0;
    opacity: 0.4;
}
@keyframes spin { to { transform: rotate(360deg); } }


/* ==========================================================================
   Snap card (off-screen render target for html2canvas)
   ========================================================================== */
#snapCard { width: 800px; height: 1000px; position: relative; overflow: hidden; background: #0b0b0b; font-family: 'Inter', sans-serif; }
#snapCard.banner { width: 1600px; height: 900px; }

/* Banner two-column grid */
#snapCard.banner .snap-content { display: grid; grid-template-columns: 1fr 520px; column-gap: 28px; align-items: start; }
#snapCard.banner #snapSentiment,
#snapCard.banner #snapPulse { grid-column: 2; }
#snapCard.banner #snapTitle,
#snapCard.banner #snapDesc,
#snapCard.banner #snapMeta,
#snapCard.banner #snapHash { grid-column: 1; }

/* Banner typography */
#snapCard.banner #snapTitle {
    font-family: 'Playfair Display', serif;
    font-weight: 800;
    font-size: 60px;
    line-height: 1.12;
    margin-bottom: 14px;
    max-height: calc(3 * 1.12em + 0.55em);
    padding-bottom: 0.40em;
    overflow: hidden;
    display: -webkit-box;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
}
#snapCard.banner #snapDesc  { font-family: 'Inter', sans-serif; font-size: 24px; line-height: 1.35; margin-bottom: 16px; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
#snapCard.banner #snapMeta  { font-family: 'Inter', sans-serif; font-size: 16px; }
#snapCard.banner #snapHash  { font-family: 'Inter', sans-serif; font-size: 13px; }
#snapCard.banner #snapSentiment .snap-sentiment-header { font-family: 'Inter', sans-serif; font-size: 18px; margin-bottom: 18px; }
#snapCard.banner #snapSentiment .snap-sentiment-info   { font-family: 'Inter', sans-serif; font-size: 16px; }
#snapCard.banner #snapSentiment .snap-sentiment-labels span { font-family: 'Inter', sans-serif; font-size: 12px; }
#snapCard.banner #snapPulse .snap-pulse-header  { font-family: 'Inter', sans-serif; font-size: 18px; margin-bottom: 8px; }
#snapCard.banner #snapPulse .snap-pulse-content { font-family: 'Inter', sans-serif; font-size: 16px; line-height: 1.45; }

/* Post (portrait) card typography */
#snapCard .snap-brand        { font-family: 'Inter', sans-serif; font-size: 18px; }
#snapCard #snapNotesUser     { font-family: 'Inter', sans-serif; font-size: 30px; }
#snapCard #snapNotesText     { font-family: 'Inter', sans-serif; font-size: 30px; max-height: none; overflow-y: visible; }
#snapCard #snapTitle         { font-family: 'Playfair Display', serif; font-weight: 800; font-size: 44px; line-height: 1.2; margin-bottom: 18px; }
#snapCard #snapDesc          { font-family: 'Inter', sans-serif; font-size: 22px; line-height: 1.4; margin-bottom: 22px; }
#snapCard #snapMeta          { font-family: 'Inter', sans-serif; font-size: 16px; }
#snapCard #snapHash          { font-family: 'Inter', sans-serif; font-size: 13px; }
#snapCard #snapSentiment .snap-sentiment-header  { font-family: 'Inter', sans-serif; font-size: 19px; margin-bottom: 28px; }
#snapCard #snapSentiment .snap-sentiment-info    { font-family: 'Inter', sans-serif; font-size: 17px; }
#snapCard #snapSentiment .snap-sentiment-labels span { font-family: 'Inter', sans-serif; font-size: 13px; }
#snapCard #snapPulse .snap-pulse-header          { font-family: 'Inter', sans-serif; font-size: 19px; margin-bottom: 8px; }
#snapCard #snapPulse .snap-pulse-content         { font-family: 'Inter', sans-serif; font-size: 17px; line-height: 1.5; }
































/* ============================================================
   POST PAGE — THREE-COLUMN RESIZABLE LAYOUT
   Inherits all colors from the site's existing CSS variables.
   No hardcoded theme overrides — works with light or dark mode.
   ============================================================ */

:root {
    --col-gap:        6px;
    --handle-w:       6px;
    --col-min:        200px;
    --panel-radius:   var(--radius, 4px);
    --panel-border:   1px solid var(--color-border);
    --panel-bg:       var(--color-elevate);
    --panel-hdr-bg:   var(--color-surface, #e8e9eb);
    --panel-hdr-h:    32px;
    --accent:         var(--color-accent, var(--color-text, #111));
    --accent-dim:     var(--color-accent-subtle, rgba(0,0,0,.07));
    --font-mono:      var(--font-mono, 'JetBrains Mono', 'Fira Code', monospace);
    --font-ui:        var(--font-body, inherit);
}

/* ── Layout shell ── */
.post-three-col {
    display: flex;
    align-items: stretch;
    gap: 0;
    width: 100%;
    max-width: 100%;
    min-height: 80vh;
    padding: 12px 0 40px;
    box-sizing: border-box;
    position: relative;
    overflow: hidden;
}

.post-col {
    display: flex;
    flex-direction: column;
    gap: 8px;
    min-width: var(--col-min);
    max-width: calc(100% - var(--col-min) * 2 - 12px);
    overflow: hidden;
    flex-shrink: 0;
    box-sizing: border-box;
}

/* Default widths (overridden by JS from localStorage) */
.post-col--left   { width: 52%; }
.post-col--center { width: 26%; }
.post-col--right  { width: calc(22% - 12px); }

/* ── Resize handle ── */
.col-resize-handle {
    width: var(--handle-w);
    min-width: var(--handle-w);
    flex-shrink: 0;
    cursor: col-resize;
    background: var(--color-border);
    position: relative;
    transition: background 0.15s;
    z-index: 10;
}
.col-resize-handle::after {
    content: '';
    position: absolute;
    inset: 0 -4px;
}
.col-resize-handle:hover,
.col-resize-handle.dragging {
    background: var(--accent);
}
.col-resize-handle.dragging {
    box-shadow: 0 0 8px var(--accent);
}

/* ── Panel (reusable card block) ── */
.gs-panel {
    border: var(--panel-border);
    border-radius: var(--panel-radius);
    background: var(--panel-bg);
    display: flex;
    flex-direction: column;
    overflow: hidden;
    flex-shrink: 0;
}
.gs-panel--grow {
    flex: 1 1 auto;
    overflow: hidden;
}

.gs-panel__header {
    display: flex;
    align-items: center;
    gap: 8px;
    height: var(--panel-hdr-h);
    padding: 0 12px;
    background: var(--panel-hdr-bg);
    border-bottom: var(--panel-border);
    flex-shrink: 0;
}
.gs-panel__header-label {
    font-family: var(--font-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: #111;
    white-space: nowrap;
}
.gs-panel__header-dot {
    width: 5px; height: 5px;
    border-radius: 50%;
    background: #111;
    flex-shrink: 0;
    opacity: 0.4;
}
.gs-panel__header-sep {
    flex: 1;
}
.gs-panel__header-meta {
    font-family: var(--font-mono);
    font-size: 9px;
    color: #444;
    white-space: nowrap;
}

.gs-panel__body {
    padding: 14px;
    overflow-y: auto;
    flex: 1 1 auto;
}
.gs-panel__body--flush {
    padding: 0;
}

/* ── Article title & meta ── */
.post-story-title {
    font-family: var(--font-serif, 'Playfair Display', serif);
    font-size: 22px;
    font-weight: 800;
    line-height: 1.25;
    color: var(--color-text);
    margin: 0 0 10px;
    letter-spacing: -0.01em;
}
.post-story-meta {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--color-text-muted);
    display: flex;
    flex-wrap: wrap;
    gap: 6px 12px;
    margin-bottom: 12px;
}
.post-story-meta .meta-src { color: var(--color-text); font-weight: 700; }
.post-story-meta a {
    color: var(--color-accent, var(--accent));
    text-decoration: none;
}
.post-story-meta a:hover { text-decoration: underline; }

/* ── Featured media ── */
.post-featured-wrap {
    position: relative;
    width: 100%;
    border-radius: var(--panel-radius);
    overflow: hidden;
    background: var(--color-background);
    margin-bottom: 12px;
    border: var(--panel-border);
}
.post-featured-wrap .story-image {
    width: 100%;
    display: block;
    aspect-ratio: 16/9;
    object-fit: cover;
}
.post-featured-wrap .youtube-embed {
    aspect-ratio: 16/9;
}
.post-featured-wrap .youtube-embed iframe {
    width: 100%;
    height: 100%;
    border: none;
    display: block;
}
.featured-media-placeholder {
    aspect-ratio: 16/9;
    background: var(--color-background);
}

/* ── Description ── */
.post-description-text {
    font-family: var(--font-ui);
    font-size: 14px;
    line-height: 1.65;
    color: var(--color-text-secondary, var(--color-text));
    margin: 0;
}

/* ── Sentiment strip ── */
.gs-sentiment {
    padding: 10px 0 4px;
}
.gs-sentiment__row {
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    margin-bottom: 6px;
}
.gs-sentiment__label {
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 700;
    letter-spacing: 0.05em;
}
.gs-sentiment__score {
    font-family: var(--font-mono);
    font-size: 20px;
    font-weight: 700;
    line-height: 1;
}
.gs-sentiment__strip {
    position: relative;
    height: 6px;
    border-radius: 3px;
    background: linear-gradient(90deg, #c0392b 0%, #2c3e50 50%, #27ae60 100%);
    margin-bottom: 4px;
}
.gs-sentiment__marker {
    position: absolute;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 12px; height: 12px;
    border-radius: 50%;
    border: 2px solid var(--color-background);
    box-shadow: 0 0 6px currentColor;
}
.gs-sentiment__ticks {
    display: flex;
    justify-content: space-between;
    font-family: var(--font-mono);
    font-size: 8px;
    color: var(--color-text-muted);
    margin-top: 2px;
}

/* ── Action buttons ── */
.gs-actions {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.gs-action-group {
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.gs-action-group-label {
    font-family: var(--font-mono);
    font-size: 8px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    padding: 4px 0 2px;
    border-top: 1px solid var(--color-border);
    margin-top: 4px;
}
.gs-action-group-label:first-child { border-top: none; margin-top: 0; padding-top: 0; }

.gs-btn {
    display: flex;
    align-items: center;
    gap: 8px;
    padding: 7px 10px;
    border-radius: 3px;
    border: 1px solid var(--color-border);
    background: transparent;
    color: var(--color-text);
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 600;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    transition: border-color .15s, background .15s, color .15s;
    text-decoration: none;
    width: 100%;
    box-sizing: border-box;
    text-align: left;
}
.gs-btn:hover:not(:disabled) {
    border-color: var(--color-accent, var(--accent));
    /* background: var(--color-accent-subtle, var(--accent-dim)); */
    color: var(--color-accent, var(--accent));
}
.gs-btn:disabled {
    opacity: 0.35;
    cursor: not-allowed;
}
.gs-btn--primary {
    border-color: var(--color-accent, var(--accent));
    color: var(--color-accent, var(--accent));
}
.gs-btn--primary:hover:not(:disabled) {
    /* background: var(--color-accent, var(--accent)); */
    color: var(--color-background);
}
.gs-btn--danger {
    border-color: var(--color-negative, #c0392b);
    color: var(--color-negative, #e74c3c);
}
.gs-btn--danger:hover:not(:disabled) {
    background: var(--color-negative-subtle, rgba(192,57,43,.12));
    color: var(--color-negative, #e74c3c);
}
.gs-btn__icon {
    font-size: 12px;
    flex-shrink: 0;
}
.gs-btn__text { flex: 1; }

/* ── Pulse analysis ── */
.pulse-content-inner {
    font-family: var(--font-ui);
    font-size: 12px;
    line-height: 1.6;
    color: var(--color-text-secondary, var(--color-text));
}
.pulse-disclaimer-text {
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--color-text-muted);
    line-height: 1.4;
    margin-top: 8px;
    padding-top: 8px;
    border-top: 1px solid var(--color-border);
}

/* ── Notes / bookmark ── */
.gs-notes-area {
    display: flex;
    flex-direction: column;
    gap: 8px;
}
.gs-notes-meta {
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--color-text-muted);
}
.gs-notes-meta a {
    color: var(--accent);
    text-decoration: none;
}
.gs-notes-textarea {
    width: 100%;
    min-height: 80px;
    background: var(--color-background);
    border: 1px solid var(--color-border);
    border-radius: 3px;
    color: var(--color-text);
    font-family: var(--font-ui);
    font-size: 12px;
    line-height: 1.5;
    padding: 8px 10px;
    resize: vertical;
    box-sizing: border-box;
    transition: border-color .15s;
}
.gs-notes-textarea:focus {
    outline: none;
    border-color: var(--accent);
}
.gs-notes-textarea::placeholder { color: var(--color-text-muted); }

/* ── Chat iframe ── */
.gs-chat-iframe {
    width: 100%;
    height: 300px;
    border: none;
    display: block;
    background: var(--color-background);
    flex: 1 1 auto;
    min-height: 200px;
}

/* ── Article info (right col) ── */
.gs-info-row {
    display: flex;
    flex-direction: column;
    gap: 3px;
    margin-bottom: 10px;
    padding-bottom: 10px;
    border-bottom: 1px solid var(--color-border);
}
.gs-info-row:last-child { margin-bottom: 0; padding-bottom: 0; border-bottom: none; }
.gs-info-label {
    font-family: var(--font-mono);
    font-size: 8px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-text-muted);
}
.gs-info-value {
    font-family: var(--font-mono);
    font-size: 11px;
    color: var(--color-text);
    word-break: break-word;
}
.gs-info-value a {
    color: var(--accent);
    text-decoration: none;
}
.gs-info-value a:hover { text-decoration: underline; }

/* ── Related lists ── */
.gs-related-list {
    list-style: none;
    margin: 0;
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 4px;
}
.gs-related-list li a {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--color-text-secondary, var(--color-text));
    text-decoration: none;
    display: block;
    padding: 3px 0;
    border-bottom: 1px solid transparent;
    transition: color .15s, border-color .15s;
    word-break: break-word;
}
.gs-related-list li a:hover {
    color: var(--accent);
    border-color: var(--accent-dim);
}
.gs-related-list li {
    font-family: var(--font-mono);
    font-size: 10px;
    color: var(--color-text-muted);
}

/* ── More like this cards ── */
.gs-related-cards {
    display: flex;
    flex-direction: column;
    gap: 6px;
}
.gs-related-card {
    display: flex;
    gap: 8px;
    padding: 8px;
    border: 1px solid var(--color-border);
    border-radius: 3px;
    background: var(--color-background);
    text-decoration: none;
    transition: border-color .15s, background .15s;
}
.gs-related-card:hover {
    border-color: var(--accent);
    background: var(--accent-dim);
}
.gs-related-card__thumb {
    width: 48px;
    height: 48px;
    object-fit: cover;
    border-radius: 2px;
    flex-shrink: 0;
    background: var(--color-elevate);
}
.gs-related-card__body { flex: 1; min-width: 0; }
.gs-related-card__title {
    font-family: var(--font-ui);
    font-size: 11px;
    font-weight: 600;
    color: var(--color-text);
    line-height: 1.35;
    margin: 0 0 4px;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
}
.gs-related-card__meta {
    font-family: var(--font-mono);
    font-size: 9px;
    color: var(--color-text-muted);
}

/* ── Newsletter block ── */
.gs-newsletter-dot {
    background: var(--color-accent, #dc2626) !important;
}
.gs-newsletter-body {
    padding: 12px 16px 14px;
}
.gs-newsletter-headline {
    font-family: var(--font-serif, 'Playfair Display', serif);
    font-size: 16px;
    font-weight: 800;
    color: var(--color-text);
    margin: 0 0 4px;
    letter-spacing: -0.01em;
    line-height: 1.2;
}
.gs-newsletter-sub {
    font-family: var(--font-mono);
    font-size: 11px;
    color: var(--color-text-muted);
    margin: 0 0 10px;
    line-height: 1.6;
}
.gs-newsletter-form {
    display: flex;
    gap: 6px;
    align-items: stretch;
}
.gs-newsletter-input {
    flex: 1;
    min-width: 0;
    background: #fff;
    border: 1px solid var(--color-border);
    border-radius: var(--panel-radius);
    color: #111;
    font-family: var(--font-mono);
    font-size: 11px;
    padding: 7px 10px;
    outline: none;
    transition: border-color 0.15s;
}
.gs-newsletter-input::placeholder {
    color: #888;
    opacity: 1;
}
.gs-newsletter-input:focus {
    border-color: var(--color-accent, #dc2626);
}
.gs-newsletter-btn {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 7px 12px;
    background: var(--color-accent, #dc2626);
    border: none;
    border-radius: var(--panel-radius);
    color: #fff;
    font-family: var(--font-mono);
    font-size: 11px;
    font-weight: 700;
    white-space: nowrap;
    cursor: pointer;
    transition: background 0.15s;
    flex-shrink: 0;
}
.gs-newsletter-btn:hover {
    background: var(--color-accent-hover, #b91c1c);
}
.gs-newsletter-btn:disabled {
    opacity: 0.55;
    cursor: not-allowed;
}
.gs-newsletter-btn-icon {
    flex-shrink: 0;
    transition: transform 0.15s;
}
.gs-newsletter-btn:hover .gs-newsletter-btn-icon {
    transform: translateX(2px);
}
.gs-newsletter-msg {
    font-family: var(--font-mono);
    font-size: 11px;
    padding: 7px 10px;
    border-radius: var(--panel-radius);
    margin-top: 8px;
    line-height: 1.5;
}
.gs-newsletter-msg--ok {
    background: rgba(22,163,74,0.1);
    border: 1px solid rgba(22,163,74,0.25);
    color: #16a34a;
}
.gs-newsletter-msg--err {
    background: rgba(220,38,38,0.08);
    border: 1px solid rgba(220,38,38,0.2);
    color: var(--color-accent, #dc2626);
}

/* ── Divider label inside panels ── */
.gs-divider {
    font-family: var(--font-mono);
    font-size: 8px;
    letter-spacing: 0.12em;
    text-transform: uppercase;
    color: var(--color-text-muted);
    border-top: 1px solid var(--color-border);
    padding-top: 10px;
    margin-top: 10px;
}

/* ── Share Modal ── */

/* Overlay backdrop */
.gs-share-overlay {
    position: fixed;
    inset: 0;
    z-index: 9999;
    background: rgba(0, 0, 0, 0.55);
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px;
    box-sizing: border-box;
    backdrop-filter: blur(2px);
    -webkit-backdrop-filter: blur(2px);
    opacity: 0;
    pointer-events: none;
    transition: opacity 0.18s ease;
}
.gs-share-overlay.gs-share-overlay--open {
    opacity: 1;
    pointer-events: auto;
}

/* Modal card */
.gs-share-modal {
    width: 100%;
    max-width: 360px;
    background: #ffffff;
    border: 1px solid var(--color-border);
    border-radius: calc(var(--panel-radius, 4px) + 2px);
    overflow: hidden;
    transform: translateY(12px) scale(0.97);
    transition: transform 0.18s ease, opacity 0.18s ease;
    opacity: 0;
}
.gs-share-overlay--open .gs-share-modal {
    transform: translateY(0) scale(1);
    opacity: 1;
}

/* Header row */
.gs-share-modal__header {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 12px 14px 10px;
    border-bottom: 1px solid #e8e8e8;
}
.gs-share-modal__title {
    display: flex;
    align-items: center;
    gap: 7px;
    font-family: var(--font-mono);
    font-size: 10px;
    font-weight: 700;
    letter-spacing: 0.08em;
    text-transform: uppercase;
    color: #888888;
}
.gs-share-modal__close {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 24px;
    height: 24px;
    border: 1px solid #dddddd;
    border-radius: 3px;
    background: transparent;
    color: #999999;
    cursor: pointer;
    transition: color 0.12s, border-color 0.12s, background 0.12s;
    padding: 0;
}
.gs-share-modal__close:hover {
    color: #333333;
    border-color: #aaaaaa;
    background: #f0f0f0;
}

/* URL strip */
.gs-share-modal__url-row {
    display: flex;
    align-items: center;
    gap: 8px;
    margin: 12px 14px;
    padding: 7px 10px;
    border: 1px solid #e0e0e0;
    border-radius: var(--panel-radius, 4px);
    background: #f5f5f5;
}
.gs-share-modal__url-label {
    flex: 1;
    font-family: var(--font-mono);
    font-size: 9px;
    color: #777777;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    letter-spacing: 0.02em;
}
.gs-share-modal__url-copy {
    display: flex;
    align-items: center;
    gap: 5px;
    padding: 3px 8px;
    border: 1px solid #cccccc;
    border-radius: 3px;
    background: #ffffff;
    color: #333333;
    font-family: var(--font-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.06em;
    text-transform: uppercase;
    cursor: pointer;
    flex-shrink: 0;
    transition: color 0.12s, border-color 0.12s, background 0.12s;
}
.gs-share-modal__url-copy:hover {
    color: var(--color-accent, var(--accent));
    border-color: var(--color-accent, var(--accent));
}
.gs-share-modal__url-copy.gs-copied {
    color: #27ae60;
    border-color: #27ae60;
}

/* Tile grid */
.gs-share-modal__grid {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 1px;
    background: #e8e8e8;
    border-top: 1px solid #e8e8e8;
}

.gs-share-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 8px;
    padding: 18px 8px;
    background: #ffffff;
    border: none;
    color: #111111;
    text-decoration: none;
    cursor: pointer;
    transition: background 0.12s, color 0.12s;
    font-family: var(--font-mono);
    font-size: 9px;
    font-weight: 700;
    letter-spacing: 0.07em;
    text-transform: uppercase;
    text-align: center;
}
.gs-share-tile:hover {
    background: #f0f0f0;
    color: var(--color-accent, var(--accent));
}
.gs-share-tile__icon {
    display: flex;
    align-items: center;
    justify-content: center;
    opacity: 0.75;
    transition: opacity 0.12s;
}
.gs-share-tile:hover .gs-share-tile__icon {
    opacity: 1;
}
.gs-share-tile__label { line-height: 1; }

/* Toggle button active state */
#shareToggleBtn[aria-expanded="true"] {
    border-color: var(--color-accent, var(--accent));
    color: var(--color-accent, var(--accent));
}

/* ── Mobile collapse ── */
@media (max-width: 900px) {
    .post-three-col {
        flex-direction: column;
        padding: 8px 0 20px;
        overflow: visible; 
    }
    .post-col {
        width: 100% !important;
        min-width: 0;
        max-width: 100%; 
        overflow: visible; 
    }
    .col-resize-handle { display: none; }
    
    /* ❌ Removed: .post-col--center { order: 3; } */
    /* ❌ Removed: .post-col--right  { order: 2; } */
}