/* Fresh design: WordPress / Cocoon integration only. Cocoon settings themselves stay unchanged. */
body.yomo-fresh { background: var(--bg); color: var(--ink); font-family: var(--font-body); font-size: 16px; line-height: 1.8; margin: 0; padding: 0; overflow-wrap: anywhere; }
/* Cocoon gives html and body overflow, which turns body into its own scroller and breaks the sticky header. */
body.yomo-fresh { overflow-x: clip; overflow-y: visible; }
body.yomo-fresh #main.wrap { width: min(var(--wrap), 100% - var(--gutter) * 2); max-width: none; float: none; margin: 0 auto; padding: 0; border: 0; box-shadow: none; background: transparent; min-height: 0; min-width: 0; }
body.yomo-fresh .wrap { width: min(var(--wrap), 100% - var(--gutter) * 2); margin-inline: auto; }
body.yomo-fresh a { color: inherit; text-decoration: none; }
body.yomo-fresh h1, body.yomo-fresh h2, body.yomo-fresh h3 { border: 0; background: transparent; padding: 0; color: var(--ink); font-family: var(--font-round); }
body.yomo-fresh .ybtn.ybtn-primary, body.yomo-fresh .yomo-ranking-button { color: #fff; }
body.yomo-fresh .tool-card .actions .ybtn.ybtn-primary { color: var(--accent-ink); }
body.yomo-fresh .tool-card .actions .ybtn.ybtn-primary:hover { color: #fff; }
body.yomo-fresh .toolbox-panel .ybtn { color: var(--ink); }
body.yomo-fresh .search-box input, body.yomo-fresh .search-field input { border: 0 !important; box-shadow: none !important; background: transparent; padding: 0; height: auto; width: 100%; min-width: 0; }
body.yomo-fresh .thumb img, body.yomo-fresh .cover img, body.yomo-fresh .stage-card img { margin: 0; max-width: 100%; }
body.yomo-fresh .post-feature .thumb img, body.yomo-fresh .post-row .thumb img { height: 100%; }

/* Article body: re-apply our heading style over Cocoon's defaults. */
body.yomo-fresh .article-body h2 { position: relative; margin-top: 2.6em; padding: 14px 18px 14px 22px; border-radius: 14px; background: var(--lav-50); font-size: clamp(20px, 2.2vw, 23px); line-height: 1.55; }
body.yomo-fresh .article-body h3 { margin-top: 2em; font-size: 19px; padding: 0 0 8px; border-bottom: 2px dotted var(--lav-300); }
body.yomo-fresh .article-body a { color: var(--accent-ink); text-decoration: underline; text-decoration-color: var(--lav-300); text-underline-offset: 4px; text-decoration-thickness: 2px; }
body.yomo-fresh .article-body a.blogcard-wrap, body.yomo-fresh .article-body .blogcard-wrap a { text-decoration: none; color: inherit; }
.yomo-fresh .article-body.entry-content { margin: 28px 0 0; padding: 0; }
.yomo-fresh .article-body iframe, .yomo-fresh .guide-content iframe { max-width: 100%; }
.yomo-fresh .article-body .blogcard-wrap { width: 100%; }
.yomo-fresh .article-body .table-scroll { font-size: 14px; }
.yomo-fresh .entry-content .table-scroll table { margin: 0; display: table; }
.yomo-fresh .table-scroll td, .yomo-fresh .table-scroll th { white-space: normal; }
/* Cocoon speech balloons: our balloon shape replaces Cocoon's tails. */
.yomo-fresh .article-body .speech-balloon::before, .yomo-fresh .article-body .speech-balloon::after { display: none; }
.yomo-fresh .article-body .speech-balloon { margin: 0; max-width: none; width: auto; border: 0; }
.yomo-fresh .article-body .speech-person { width: auto; margin: 0; }
.yomo-fresh .article-body .speech-name { font-size: 11px; text-align: center; color: var(--ink-3); }
.yomo-fresh .article-body .speech-wrap { max-width: 100%; }
.yomo-fresh .article-body .speech-wrap.sbp-r { flex-direction: row-reverse; }
.yomo-fresh .article-body .sbp-r .speech-balloon { border-radius: 18px 4px 18px 18px; background: var(--lav-100); }
.yomo-fresh .guide-content { overflow-wrap: anywhere; }
.yomo-fresh .wpcf7 input:not([type=submit]), .yomo-fresh .wpcf7 textarea { max-width: 100%; border: 1px solid var(--line-2); border-radius: 10px; padding: 10px; }
.yomo-ranking-template { margin: 36px 0 0; max-width: 100%; overflow-wrap: anywhere; }
.yomo-ranking-template img { max-width: 100%; height: auto; }
.yomo-fresh .post-edit-link { margin-left: auto; font-size: 12px; color: var(--ink-3); }

/* Ads: real Cocoon ad code gets a quiet frame; the admin preview keeps the dashed placeholder. */
.yomo-fresh .yomo-ad:not(.yomo-ad-preview) { display: block; min-height: 0; padding: 16px 0; background: none; border: 0; border-block: 1px solid var(--line); border-radius: 0; }
.yomo-fresh .yomo-ad .ad-area { margin: 0; width: 100%; padding: 0; }
.yomo-fresh .yomo-ad .ad-label { display: block; font-size: 11px; color: var(--ink-3); letter-spacing: .14em; margin: 0 0 12px; }
.yomo-fresh .yomo-ad .ad-wrap, .yomo-fresh .yomo-ad .ad-responsive { width: 100%; max-width: 100%; margin: 0; }
.yomo-fresh .article-body .yomo-ad { margin: 2.4em 0; }
.yomo-fresh .reading-card .yomo-ad { margin-top: 32px; }

/* Admin bar */
.yomo-fresh.admin-bar .site-header { top: 32px; }
.yomo-fresh.admin-bar .reading-progress { top: 32px; }
.yomo-fresh #wpadminbar { font-family: Arial, sans-serif; }
.yomo-fresh #wpadminbar a { color: #f0f0f1; }
@media (max-width: 782px) { .yomo-fresh.admin-bar .site-header, .yomo-fresh.admin-bar .reading-progress { top: 46px; } }
@media (max-width: 600px) { .yomo-fresh.admin-bar .site-header, .yomo-fresh.admin-bar .reading-progress { top: 0; } }

/* Keep navigation usable while Google's saved Auto Ads settings propagate. */
.yomo-fresh .site-header:has(.google-auto-placed) { position: relative; }
.yomo-fresh .header-inner:has(> .google-auto-placed) { flex-wrap: wrap; height: auto; min-height: var(--header-h); padding-block: 12px; }
.yomo-fresh .header-inner > .google-auto-placed { order: 10; flex-basis: 100%; }