/* PsyGuild source: progress.css */ /* One nonblocking progress language across public pages, Portal and native forms. */ .pg-request-progress{position:fixed;inset:var(--pg-admin-bar-offset,0px) 0 auto;z-index:2147483000;height:3px;overflow:hidden;pointer-events:none;background:color-mix(in srgb,var(--pg-primary) 12%,transparent)} .pg-request-progress[hidden]{display:none!important} .pg-request-progress__fill{display:block;height:100%;background:var(--pg-action-gradient);box-shadow:0 0 8px color-mix(in srgb,var(--pg-primary) 35%,transparent);transition:width .14s ease} .pg-request-progress.is-indeterminate .pg-request-progress__fill{animation:pg-request-sweep 1.25s ease-in-out infinite} .pg-request-progress.is-complete .pg-request-progress__fill{width:100%!important} .pg-request-progress.is-error .pg-request-progress__fill{width:100%!important;background:var(--pg-error,var(--pg-primary-deep));animation:none;transform:none} .pg-request-progress__status{position:absolute;width:1px;height:1px;clip-path:inset(50%);overflow:hidden;white-space:nowrap} .pg-has-request-progress .pg-navigation-feedback{display:none!important} .pg-has-request-progress #pg-auth-loading-modal .pg-progress-track{height:3px;border:0;background:color-mix(in srgb,var(--pg-primary) 12%,var(--pg-block-bg));border-radius:999px} .pg-has-request-progress #pg-auth-loading-modal .pg-progress-bar{width:35%!important;background:var(--pg-action-gradient);transition:none;animation:pg-request-sweep 1.25s ease-in-out infinite} .pg-has-request-progress #pg-auth-loading-modal .pg-progress-value{display:none} .pg-has-request-progress #pg-auth-loading-modal .pg-progress-meta{font:500 10px/1.7 var(--pg-interface-font);letter-spacing:.08em} @keyframes pg-request-sweep{0%{transform:translateX(-110%)}100%{transform:translateX(390%)}} @media(prefers-reduced-motion:reduce){.pg-request-progress__fill,.pg-has-request-progress #pg-auth-loading-modal .pg-progress-bar{animation:none!important;transition:none!important;transform:none}.pg-request-progress.is-indeterminate:not(.is-error) .pg-request-progress__fill,.pg-has-request-progress #pg-auth-loading-modal .pg-progress-bar{transform:translateX(100%)}} /* PsyGuild source: interface-fonts.css */ /* Self-hosted Be Vietnam Pro. Full Vietnamese/Latin glyphs; SIL OFL 1.1. * Editorial reader font choices remain separate from interface typography. */ @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-400.woff2") format('woff2');font-style:normal;font-weight:400;font-display:swap} @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-500.woff2") format('woff2');font-style:normal;font-weight:500;font-display:swap} @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-600.woff2") format('woff2');font-style:normal;font-weight:600;font-display:swap} @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-700.woff2") format('woff2');font-style:normal;font-weight:700;font-display:swap} @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-800.woff2") format('woff2');font-style:normal;font-weight:800;font-display:swap} @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-900.woff2") format('woff2');font-style:normal;font-weight:900;font-display:swap} @font-face{font-family:'Be Vietnam Pro';src:url("https://psyguild.com/wp-content/themes/psyguild-theme/assets/fonts/BeVietnamPro-400-italic.woff2") format('woff2');font-style:italic;font-weight:400;font-display:swap} :root{--pg-interface-font:'Be Vietnam Pro',system-ui,sans-serif;--pg-font-sans:var(--pg-interface-font);--pg-weight-copy:400;--pg-weight-label:500;--pg-weight-heading:600;--pg-weight-action:600;--pg-weight-strong:700;} body{--pg-font-sans:var(--pg-interface-font);font-family:var(--pg-interface-font);} /* PsyGuild source: theme.css */ @layer psyguild-clean-page; :root { --pg-font-sans: var(--pg-interface-font, "Be Vietnam Pro", system-ui, sans-serif); --pg-bg: #f4f8fc; --pg-bg-soft: #f8fbff; --pg-surface: rgba(255, 255, 255, 0.90); --pg-surface-strong: rgba(255, 255, 255, 0.98); --pg-auth-surface: #ffffff; --pg-border: rgba(28, 36, 52, 0.10); --pg-border-strong: rgba(28, 36, 52, 0.16); --pg-text: #1e293b; --pg-muted: #475569; --pg-primary: var(--pg-palette-blue); --pg-primary-light: var(--pg-palette-cyan); --pg-primary-deep: var(--pg-palette-blue); --pg-secondary: var(--pg-palette-cyan); --pg-secondary-deep: var(--pg-palette-blue-hover); --pg-stage-primary: var(--pg-primary); --pg-stage-secondary: var(--pg-secondary); --pg-action-stop: var(--pg-primary-deep); --pg-action-hover-stop: var(--pg-secondary-deep); --pg-accent: var(--pg-secondary); --pg-accent-light: var(--pg-primary-light); --pg-dark: #0f172a; --pg-action-text: #ffffff; --pg-action-hover-text: #ffffff; --pg-primary-deep-text: #ffffff; --pg-highlight-mid: var(--pg-palette-blue); --pg-highlight-mid-deep: var(--pg-palette-blue); --pg-brand-blue-on-dark: color-mix(in srgb, var(--pg-highlight-mid) 66%, white); --pg-highlight-edge: #d9f4ff; --pg-highlight-outline: linear-gradient(135deg, #ffffff, var(--pg-highlight-edge)); --pg-action-gradient: linear-gradient(130deg in srgb-linear, var(--pg-action-stop), var(--pg-highlight-mid-deep) 66%, var(--pg-action-hover-stop)); --pg-action-gradient-hover: linear-gradient(130deg in srgb-linear, color-mix(in srgb, var(--pg-action-stop) 87%, black), var(--pg-highlight-mid-deep) 54%, var(--pg-action-hover-stop)); --pg-highlight-text: var(--pg-action-text); --pg-wordmark-gradient: linear-gradient(135deg in srgb, var(--pg-primary) 0%, var(--pg-highlight-mid) 68%, var(--pg-secondary) 100%); --pg-highlight-gradient: var(--pg-action-gradient) padding-box, var(--pg-highlight-outline) border-box; --pg-highlight-gradient-hover: var(--pg-action-gradient-hover) padding-box, var(--pg-highlight-outline) border-box; --pg-gradient: var(--pg-action-gradient); --pg-gradient-hover: var(--pg-action-gradient-hover); --pg-section-bg: rgba(255, 255, 255, 0.72); --pg-block-bg: rgba(255, 255, 255, 0.92); --pg-header-bg: rgba(255, 255, 255, 0.92); --pg-footer-bg: #fff; --pg-comment-bg: var(--pg-bg-soft); --pg-link: var(--pg-highlight-mid-deep); --pg-link-hover: var(--pg-secondary-deep); --pg-radius-lg: 1rem; --pg-radius-xl: 1.4rem; --pg-radius-2xl: 2rem; --pg-radius-3xl: 2.6rem; --pg-shadow-soft: 0 18px 55px rgba(15, 23, 42, 0.08); --pg-shadow-strong: 0 30px 90px rgba(15, 23, 42, 0.12); /* The public canvas stays spacious on desktop while mobile keeps a compact 10px edge. Content modules align to this one shared frame. */ --pg-page-gutter: clamp(24px, 3vw, 56px); --pg-container: min(1800px, calc(100vw - (var(--pg-page-gutter) * 2))); } body { --pg-interactive-accent: var(--pg-link); } body.pg-theme-dark { --pg-link: var(--pg-brand-blue-on-dark); --pg-link-hover: var(--pg-stage-secondary); } @media (max-width: 767px) { :root { --pg-page-gutter: 10px; } } body.pg-theme-dark { --pg-bg: #020617; --pg-bg-soft: #050914; --pg-surface: rgba(2, 6, 23, 0.88); --pg-surface-strong: rgba(2, 6, 23, 0.96); --pg-auth-surface: #020617; --pg-border: rgba(255, 255, 255, 0.16); --pg-border-strong: rgba(255, 255, 255, 0.26); --pg-text: #ffffff; --pg-muted: rgba(255, 255, 255, 0.74); --pg-dark: #ffffff; --pg-section-bg: rgba(2, 6, 23, 0.72); --pg-block-bg: rgba(2, 6, 23, 0.9); --pg-header-bg: rgba(2, 6, 23, 0.92); --pg-footer-bg: #020617; --pg-comment-bg: rgba(2, 6, 23, 0.9); background-color: var(--pg-bg); background-image: var(--pg-body-bg-image), radial-gradient(circle at top left, color-mix(in srgb, var(--pg-primary) 14%, transparent) 0%, transparent 30%), linear-gradient(180deg, #07111f 0%, #0b1020 48%, #070b14 100%); background-size: cover, auto, auto; background-position: center top, left top, center; background-repeat: no-repeat, no-repeat, no-repeat; background-attachment: fixed, scroll, scroll; } *, *::before, *::after { box-sizing: border-box; } html { min-height: 100%; scroll-behavior: smooth; } body { display: flex; flex-direction: column; isolation: isolate; min-height: 100vh; min-height: 100dvh; margin: 0; overflow-x: hidden; background-color: var(--pg-bg); background-image: var(--pg-body-bg-image), radial-gradient(circle at top left, color-mix(in srgb, var(--pg-primary) 16%, transparent) 0%, transparent 30%), linear-gradient(180deg, var(--pg-bg) 0%, color-mix(in srgb, var(--pg-bg) 88%, var(--pg-primary)) 45%, var(--pg-bg) 100%); background-size: cover, auto, auto; background-position: center top, left top, center; background-repeat: no-repeat, no-repeat, no-repeat; background-attachment: fixed, scroll, scroll; color: var(--pg-text); font-family: var(--pg-font-sans); -webkit-font-smoothing: antialiased; -moz-osx-font-smoothing: grayscale; text-rendering: optimizeLegibility; } /* Logo watermark background. The image comes from WordPress Site Identity; this layer never captures clicks or participates in document layout. */ .pg-logo-watermark-bg { position: fixed; z-index: -1; inset: 0; overflow: hidden; pointer-events: none; user-select: none; contain: strict; } /* Glass surfaces use only the backdrop behind the page. The fixed starfield stays below this layer and never receives pointer input. */ body:not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-portal-card, .pg-admin-filter, .pg-admin-kpi, .pg-admin-panel, .pg-home-media__channel-card, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-single-sidebar, .pg-comments-area, .pg-comment-card) { backdrop-filter: blur(12px) saturate(1.12); -webkit-backdrop-filter: blur(12px) saturate(1.12); } .pg-logo-watermark-bg__image, .pg-logo-watermark-bg__canvas { position: absolute; left: 50%; top: 52%; display: block; transform: translate(-50%, -50%); } .pg-logo-watermark-bg__image { width: clamp(240px, 34vw, 620px); max-height: 62vh; object-fit: contain; opacity: var(--pg-logo-watermark-opacity, .14); filter: saturate(.9) drop-shadow(0 0 42px color-mix(in srgb, var(--pg-primary) 20%, transparent)); } .pg-logo-watermark-bg__canvas { inset: 0; left: 0; top: 0; width: 100%; height: 100%; opacity: 1; transform: none; } .pg-logo-watermark-bg--particles .pg-logo-watermark-bg__image { opacity: 0; animation: none; } .pg-logo-watermark-bg--particles.is-logo-unprocessed .pg-logo-watermark-bg__image { opacity: var(--pg-logo-watermark-opacity, .14); mix-blend-mode: multiply; } .pg-logo-watermark-bg--float .pg-logo-watermark-bg__image { animation: pgLogoWatermarkFloat 12s ease-in-out infinite; } @keyframes pgLogoWatermarkFloat { 0%, 100% { transform: translate(-50%, -50%) rotate(-1.25deg) scale(.98); } 50% { transform: translate(-50%, calc(-50% - 16px)) rotate(1.25deg) scale(1.035); } } @keyframes pgLogoWatermarkBreathe { 0%, 100% { transform: translate(-50%, -50%) scale(.97); } 50% { transform: translate(-50%, -50%) scale(1.04); } } body.pg-book-reader-active .pg-logo-watermark-bg, body.pg-link-preview-embed .pg-logo-watermark-bg { display: none; } @media (max-width: 767px) { .pg-logo-watermark-bg { contain: layout paint style; } .pg-logo-watermark-bg__canvas { display: none !important; } .pg-logo-watermark-bg--particles .pg-logo-watermark-bg__image, .pg-logo-watermark-bg--particles.is-static-mobile .pg-logo-watermark-bg__image { opacity: var(--pg-logo-watermark-opacity, .14); animation: none !important; filter: none; mix-blend-mode: normal; } .pg-logo-watermark-bg__image { top: 48%; width: min(68vw, 320px); max-height: 45vh; } } @media (prefers-reduced-motion: reduce) { .pg-logo-watermark-bg__image { animation: none !important; } } body > main, body > .main-content { flex: 1 0 auto; width: min(var(--pg-container), calc(100% - (var(--pg-page-gutter) * 2))); margin-left: auto; margin-right: auto; } body > .pg-site-footer { flex-shrink: 0; } /* Homepage sections must always contribute their real height. Deferring them with `content-visibility` reserved a 960px placeholder in some browsers, leaving a conspicuous blank block immediately before the footer. */ .pg-newsroom, .pg-home-media, .pg-services-section { content-visibility: visible; contain-intrinsic-size: auto; } ul, ol { list-style: none; padding: 0; margin: 0; } a { text-decoration: none; color: inherit; transition: color 0.2s ease; } a:hover { color: var(--pg-link-hover); } button { cursor: pointer; background: transparent; border: none; font: inherit; color: inherit; padding: 0; } input, textarea, select { font: inherit; } .pg-container { width: min(var(--pg-container), calc(100% - (var(--pg-page-gutter) * 2))); max-width: var(--pg-container); margin: 0 auto; padding-left: 0; padding-right: 0; } /* The generic main rule has higher specificity than `.pg-container`; repeat the shared canvas here so top-level page templates cannot expand to the viewport edge. */ body > main.pg-container, body > .main-content.pg-container { width: min(var(--pg-container), calc(100% - (var(--pg-page-gutter) * 2))); max-width: var(--pg-container); margin-left: auto; margin-right: auto; } .pg-text-gradient, .pg-side-header__title, .pg-newsroom__title, .pg-author-header__title { background: var(--pg-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent; display: inline-block; } .pg-card { border: 1px solid var(--pg-border); background: var(--pg-surface); border-radius: var(--pg-radius-2xl); box-shadow: var(--pg-shadow-soft); } .pg-card-strong { border: 1px solid var(--pg-border); background: var(--pg-surface-strong); border-radius: var(--pg-radius-3xl); box-shadow: var(--pg-shadow-strong); } .pg-img-16x9 { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; border-radius: var(--pg-radius-2xl); background: var(--pg-bg-soft); isolation: isolate; } .pg-img-16x9 img { width: 100%; height: 100%; object-fit: cover; display: block; border-radius: 0; } /* A thumbnail is always a 16:9 viewport. The image itself must not carry a second radius: the wrapper owns the crop and prevents the card surface from showing through at the rounded corners. */ .pg-card-post__media { position: relative; display: block; width: 100%; aspect-ratio: 16 / 9; overflow: hidden; background: var(--pg-bg-soft); isolation: isolate; } .pg-card-post__image { position: absolute; inset: 0; display: block; width: 100%; height: 100%; max-width: none; object-fit: cover; border-radius: 0; } .pg-card-post__media > :not(.pg-card-post__image) { z-index: 1; } /* Article lists on the homepage, blog index, archives, and author profile. */ .pg-article-grid { display: grid; grid-template-columns: minmax(0, 1fr); gap: 1.25rem; } .pg-article-grid > * { min-width: 0; } @media (min-width: 640px) { .pg-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (min-width: 900px) { .pg-article-grid { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (min-width: 1200px) { .pg-article-grid { grid-template-columns: repeat(4, minmax(0, 1fr)); } } .pg-btn { display: inline-flex; align-items: center; justify-content: center; min-height: 44px; border-radius: 0.75rem; clip-path: inset(0 round 0.75rem); padding: 0.65rem 1rem; font-weight: 700; font-size: 0.875rem; line-height: 1.2; text-decoration: none; white-space: nowrap; border: 1px solid transparent; background-clip: padding-box; transition: transform .22s ease, box-shadow .22s ease, background .22s ease, color .22s ease; } .pg-btn:hover { transform: translateY(-1px); } .pg-btn-sm { min-height: 32px; padding: 0.35rem 0.75rem; font-size: 0.75rem; } .pg-btn-primary { background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; box-shadow: 0 8px 18px rgba(59, 130, 246, 0.18); border-color: rgba(255, 255, 255, 0.24) !important; } .pg-btn-primary:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; box-shadow: 0 10px 24px rgba(59, 130, 246, 0.22); } .pg-btn-dark { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; box-shadow: 0 8px 18px rgba(15, 23, 42, 0.18); } .pg-btn-dark:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; } .pg-btn-soft { background: var(--pg-block-bg); color: var(--pg-text); border-color: var(--pg-border); } .pg-btn-soft:hover { background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; border-color: transparent !important; color: var(--pg-color-white, #fff) !important; } .pg-btn-icon { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 1rem; clip-path: inset(0 round 1rem); border: 1px solid transparent; background: linear-gradient(var(--pg-block-bg), var(--pg-block-bg)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 20%, transparent), color-mix(in srgb, var(--pg-secondary) 22%, transparent)) border-box; background-clip: padding-box, border-box; background-origin: padding-box, border-box; color: var(--pg-dark); box-shadow: 0 8px 18px color-mix(in srgb, var(--pg-dark) 5%, transparent); transition: color .2s ease, background .2s ease, box-shadow .2s ease, transform .2s ease; } .pg-btn-icon:hover, .pg-btn-icon[aria-expanded="true"], .pg-theme-toggle[aria-pressed="true"] { transform: translateY(-2px); border-color: transparent; background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff); box-shadow: 0 12px 26px color-mix(in srgb, var(--pg-primary) 28%, transparent); } .pg-btn-icon[aria-expanded="true"]:hover, .pg-theme-toggle[aria-pressed="true"]:hover { background: var(--pg-gradient-hover); color: var(--pg-color-white, #fff); } .pg-service-card__btn, .pg-news-card__read-btn, .pg-sidebar-cta__btn { background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; clip-path: inset(0 round 1rem); color: var(--pg-color-white, #fff) !important; } .pg-bottom-fab { background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; clip-path: inset(0 round 999px); color: var(--pg-color-white, #fff) !important; } .pg-service-card__btn:hover, .pg-news-card__read-btn:hover, .pg-sidebar-cta__btn:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; } .pg-bottom-fab:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; } .pg-single-main-column, .pg-single-article, .pg-article-content, .pg-comments-area { background: var(--pg-block-bg); color: var(--pg-text); } .pg-btn-icon-sm { width: 28px; height: 28px; border-radius: 0.75rem; box-shadow: none; } .pg-btn-icon-bg { border: none; background: var(--pg-bg-soft); } .pg-btn-icon-bg:hover { background: var(--pg-bg-soft); transform: none; } .pg-theme-toggle__moon { display: none; } body.pg-theme-dark .pg-theme-toggle__sun { display: none; } body.pg-theme-dark .pg-theme-toggle__moon { display: block; } .pg-scroll-top { position: fixed; right: 1.25rem; bottom: 6rem; z-index: 60; width: 44px; height: 44px; border-radius: 999px; clip-path: inset(0 round 999px); display: inline-flex; align-items: center; justify-content: center; background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff); box-shadow: 0 16px 32px rgba(15, 23, 42, 0.22); opacity: 0; pointer-events: none; transform: translateY(12px); transition: opacity 0.2s ease, transform 0.2s ease, background 0.2s ease; } .pg-scroll-top.is-visible { opacity: 1; pointer-events: auto; transform: translateY(0); } .pg-scroll-top:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; } /* HEADER */ .pg-site-header { position: sticky; top: 0; z-index: 50; border-bottom: 1px solid rgba(226, 232, 240, 0.8); background-color: var(--pg-header-bg); background-image: var(--pg-header-bg-image); background-size: cover; background-position: center; background-repeat: no-repeat; box-shadow: 0 1px 2px 0 rgba(226, 232, 240, 0.5); backdrop-filter: blur(24px); } .pg-site-header__inner { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 0; position: relative; } .pg-site-header__left { display: flex; align-items: center; gap: 0.75rem; } .pg-logo-link { display: flex; align-items: center; gap: 0.75rem; } .pg-logo-icon { display: flex; align-items: center; justify-content: center; width: 3.5rem; height: 3.5rem; background-color: var(--pg-dark); color: white; border-radius: 1rem; box-shadow: 0 10px 15px -3px rgba(15, 23, 42, 0.15); } .pg-logo-icon svg { width: 20px; height: 20px; object-fit: contain; } .pg-logo-img { width: 3.5rem; height: 3.5rem; object-fit: contain; border-radius: 999px; } .pg-logo-title { font-size: 1rem; font-weight: var(--pg-weight-strong,700); line-height: 1.25; text-transform: uppercase; letter-spacing: -0.025em; display: inline-block !important; width: fit-content !important; background: var(--pg-brand-gradient) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; margin: 0; } .pg-logo-desc { white-space: nowrap; font-size: 0.6875rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.22em; color: var(--pg-muted); margin: 0; } .pg-site-header__center { display: none; } @media (min-width: 1024px) { .pg-site-header__center { display: flex; flex: 1; justify-content: center; padding: 0 1rem; min-width: 0; } } .pg-main-nav { display: flex; align-items: center; } .pg-main-nav > li { position: relative; display: flex; align-items: center; } .pg-main-nav > li:not(:last-child)::after { content: "|"; margin: 0 0.5rem; color: var(--pg-border); font-size: 0.875rem; font-weight: 300; } .pg-main-nav a { border-radius: 9999px; clip-path: inset(0 round 9999px); padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-text); white-space: nowrap; border: 1px solid transparent; background: linear-gradient(transparent, transparent) padding-box, linear-gradient(135deg, transparent, transparent) border-box; background-clip: padding-box, border-box; background-origin: padding-box, border-box; transition: color 0.2s ease, background 0.2s ease, box-shadow 0.2s ease, transform 0.2s ease; } .pg-main-nav a:hover, .pg-main-nav li.current-menu-item > a, .pg-main-nav li.current_page_item > a { border-color: transparent; background: linear-gradient(color-mix(in srgb, var(--pg-primary) 8%, var(--pg-block-bg)), color-mix(in srgb, var(--pg-secondary) 8%, var(--pg-block-bg))) padding-box, var(--pg-gradient) border-box; background-clip: padding-box, border-box; background-origin: padding-box, border-box; color: var(--pg-link); box-shadow: 0 8px 18px color-mix(in srgb, var(--pg-primary) 12%, transparent); transform: translateY(-1px); } /* Header submenus: only shown on the desktop navigation, where there is room for a readable popover. They remain available with keyboard focus. */ @media (min-width: 1024px) { .pg-main-nav > .menu-item-has-children > a::after { content: ""; width: 0.42rem; height: 0.42rem; margin-left: 0.45rem; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-0.12rem) rotate(45deg); transition: transform 0.2s ease; } .pg-main-nav > .menu-item-has-children:hover > a::after, .pg-main-nav > .menu-item-has-children:focus-within > a::after, .pg-main-nav > .menu-item-has-children.is-open > a::after { transform: translateY(0.08rem) rotate(225deg); } .pg-main-nav .sub-menu { position: absolute; z-index: 90; top: calc(100% + 0.65rem); left: 50%; display: grid; width: max-content; min-width: 13.5rem; max-width: min(22rem, calc(100vw - 2rem)); margin: 0; padding: 0.45rem; list-style: none; border: 1px solid var(--pg-border); border-radius: 0.85rem; background: var(--pg-surface-strong); box-shadow: 0 18px 36px rgba(15, 48, 91, 0.16); opacity: 0; visibility: hidden; pointer-events: none; transform: translate(-50%, -0.45rem); transform-origin: top center; transition: opacity 0.16s ease, transform 0.16s ease, visibility 0.16s ease; } .pg-main-nav > .menu-item-has-children:hover > .sub-menu, .pg-main-nav > .menu-item-has-children:focus-within > .sub-menu, .pg-main-nav > .menu-item-has-children.is-open > .sub-menu { opacity: 1; visibility: visible; pointer-events: auto; transform: translate(-50%, 0); } .pg-main-nav .sub-menu li, .pg-main-nav .sub-menu li::after { display: block; content: none; margin: 0; } .pg-main-nav .sub-menu a { display: flex; align-items: center; min-height: 2.55rem; padding: 0.55rem 0.7rem; border: 0; border-radius: 0.55rem; clip-path: none; color: var(--pg-text); font-size: 0.78rem; font-weight: var(--pg-weight-strong,700); line-height: 1.35; white-space: normal; background: transparent; box-shadow: none; transform: none; } .pg-main-nav .sub-menu a:hover, .pg-main-nav .sub-menu .current-menu-item > a, .pg-main-nav .sub-menu .current_page_item > a { color: var(--pg-link); background: color-mix(in srgb, var(--pg-primary) 10%, var(--pg-bg-soft)); box-shadow: none; transform: none; } } .pg-site-header__right { display: flex; align-items: center; gap: 0.5rem; } .pg-search-wrapper { position: relative; } @media (min-width: 768px) { /* Search dropdown was previously restricted here */ } .pg-search-dropdown { position: absolute; right: 0; top: calc(100% + 12px); width: 340px; max-width: 80vw; background: var(--pg-surface-strong); border-radius: 1.4rem; border: 1px solid var(--pg-border); padding: 0.75rem; box-shadow: 0 25px 50px -12px rgba(15, 23, 42, 0.25); opacity: 0; visibility: hidden; transform: translateY(-10px); transition: all 0.2s ease; } .pg-search-dropdown.is-open { opacity: 1; visibility: visible; transform: translateY(0); } .pg-search-form { display: flex; align-items: center; gap: 0.75rem; background: var(--pg-bg-soft); border: 1px solid var(--pg-border); border-radius: 1rem; padding: 0.5rem 0.75rem; } .pg-search-form__icon { color: var(--pg-muted); } .pg-search-input { flex: 1; min-width: 0; background: transparent; border: none; outline: none; font-size: 0.875rem; font-weight: 600; color: var(--pg-dark); } @media (max-width: 767px) { .pg-hide-mobile { display: none !important; } .pg-site-header .pg-logo-link { position: absolute; left: 50%; transform: translateX(-50%); margin: 0; } } /* SIDEBAR DRAWER */ .pg-sidebar-overlay { position: fixed; inset: 0; z-index: 90; background: rgba(15, 23, 42, 0.4); backdrop-filter: blur(4px); opacity: 0; visibility: hidden; transition: opacity 0.3s ease; } .pg-sidebar-overlay.is-open { opacity: 1; visibility: visible; } .pg-sidebar-drawer { position: fixed; top: 0; bottom: 0; left: 0; z-index: 95; width: 330px; max-width: 88vw; background: var(--pg-surface-strong); padding: 1.25rem; box-shadow: 25px 0 50px -12px rgba(15, 23, 42, 0.25); transform: translateX(-100%); transition: transform 0.3s cubic-bezier(0.22, 1, 0.36, 1); display: flex; flex-direction: column; overflow-y: auto; } .pg-sidebar-drawer.is-open { transform: translateX(0); } body.admin-bar .pg-sidebar-overlay, body.admin-bar .pg-sidebar-drawer { top: 32px; } @media (max-width: 782px) { body.admin-bar .pg-sidebar-overlay, body.admin-bar .pg-sidebar-drawer { top: 46px; } } .pg-sidebar-drawer__header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; } .pg-sidebar-drawer__title { font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-sidebar-drawer__subtitle { font-size: 0.75rem; font-weight: 600; color: var(--pg-muted); margin: 0.25rem 0 0 0; } .pg-sidebar-drawer__nav { display: flex; flex-direction: column; gap: 0.5rem; flex: 1; } .pg-sidebar-menu { display: flex; flex-direction: column; gap: 0.5rem; list-style: none; margin: 0; padding: 0; } .pg-sidebar-menu li { margin: 0; } .pg-sidebar-menu a { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; padding: 0.9rem 1rem; border-radius: 1rem; color: var(--pg-dark); text-decoration: none; font-size: 0.95rem; font-weight: var(--pg-weight-strong,700); background: var(--pg-bg-soft); border: 1px solid var(--pg-border); transition: all 0.2s ease; } .pg-sidebar-menu a:hover, .pg-sidebar-menu li.current-menu-item > a { background: var(--pg-gradient); border-color: transparent; color: var(--pg-color-white, #fff); transform: translateX(2px); } .pg-sidebar-link { display: flex; align-items: center; justify-content: space-between; padding: 0.75rem 1rem; background: var(--pg-bg-soft); border: 1px solid var(--pg-border); border-radius: 1rem; font-size: 0.875rem; font-weight: 700; color: var(--pg-text); transition: all 0.2s ease; } .pg-sidebar-link:hover { background: var(--pg-bg-soft); border-color: var(--pg-primary); color: var(--pg-link); } .pg-sidebar-link__inner { display: flex; align-items: center; gap: 0.75rem; } .pg-sidebar-link__icon { display: flex; align-items: center; justify-content: center; width: 36px; height: 36px; background: var(--pg-surface-strong); border-radius: 1rem; color: var(--pg-link); box-shadow: 0 1px 2px rgba(0,0,0,0.05); } .pg-sidebar-link__arrow { color: var(--pg-muted); transition: color 0.2s ease; } .pg-sidebar-link:hover .pg-sidebar-link__arrow { color: var(--pg-link); } .pg-sidebar-install-app { width: 100%; appearance: none; border: 0; cursor: pointer; font: inherit; text-align: left; } .pg-sidebar-install-app__icon { color: var(--pg-link); } .pg-sidebar-install-app.is-installed { cursor: default; opacity: 0.72; } .pg-sidebar-install-app:disabled:hover { transform: none; background: transparent; } .pg-sidebar-install-app__status { margin: -0.1rem 0 0.4rem; padding: 0.55rem 0.7rem; border-radius: 0.7rem; background: rgba(62, 123, 250, 0.08); color: var(--pg-text); font-size: 0.75rem; font-weight: 600; line-height: 1.45; } .pg-sidebar-rank-form { padding: 0.9rem 1rem; border-radius: 1rem; border: 1px solid var(--pg-border); background: var(--pg-bg-soft); } .pg-sidebar-rank-form label { display: block; margin-bottom: 0.45rem; color: var(--pg-muted); font-size: 0.68rem; font-weight: var(--pg-weight-strong,700); letter-spacing: 0.08em; text-transform: uppercase; } .pg-sidebar-rank-form select { width: 100%; min-height: 42px; padding: 0.58rem 0.7rem; border: 1px solid var(--pg-border); border-radius: 0.75rem; background: var(--pg-surface-strong); color: var(--pg-dark); font-size: 0.82rem; font-weight: var(--pg-weight-strong,700); } .pg-sidebar-cta { margin-top: 1.25rem; background: var(--pg-dark); border-radius: 1.5rem; padding: 1rem; color: var(--pg-color-white, #fff); } .pg-sidebar-cta__label { font-size: 0.75rem; font-weight: 700; text-transform: uppercase; letter-spacing: 0.22em; color: var(--pg-primary-light); margin: 0 0 0.5rem 0; } .pg-sidebar-cta__title { font-size: 1.125rem; font-weight: var(--pg-weight-strong,700); margin: 0 0 0.5rem 0; } .pg-sidebar-cta__desc { font-size: 0.875rem; line-height: 1.5; color: color-mix(in srgb, var(--pg-color-white, #fff) 78%, transparent); margin: 0 0 1rem 0; } .pg-sidebar-contact-actions { display: flex !important; flex-wrap: wrap; gap: 0.625rem; margin-bottom: 1.25rem; } .pg-sidebar-contact-action { width: 55px !important; height: 55px !important; flex: 0 0 55px; aspect-ratio: 1 / 1 !important; display: inline-flex !important; align-items: center; justify-content: center; border-radius: 1rem; border: 1px solid var(--pg-border); background: var(--pg-bg-soft); transition: all 0.28s cubic-bezier(0.4, 0, 0.2, 1); box-sizing: border-box; } .pg-sidebar-contact-action svg { width: 18px !important; height: 18px !important; transition: transform 0.28s ease; } .pg-sidebar-contact-action:hover svg { transform: scale(1.08); } /* Zalo (Sidebar) */ .pg-sidebar-contact-action--zalo { color: #0068ff !important; border-color: rgba(0, 104, 255, 0.2); background: rgba(0, 104, 255, 0.05); } .pg-sidebar-contact-action--zalo svg { width: 24px !important; height: 24px !important; } .pg-sidebar-contact-action--zalo:hover { color: #ffffff !important; background: #0068ff !important; border-color: #0068ff !important; box-shadow: 0 6px 14px rgba(0, 104, 255, 0.25); transform: translateY(-2px) !important; } /* Phone (Sidebar) */ .pg-sidebar-contact-action--phone { color: #22c55e !important; border-color: rgba(34, 197, 94, 0.2); background: rgba(34, 197, 94, 0.05); } .pg-sidebar-contact-action--phone:hover { color: #ffffff !important; background: #22c55e !important; border-color: #22c55e !important; box-shadow: 0 6px 14px rgba(34, 197, 94, 0.25); transform: translateY(-2px) !important; } /* Email (Sidebar) */ .pg-sidebar-contact-action--email { color: #ea4335 !important; border-color: rgba(234, 67, 53, 0.2); background: rgba(234, 67, 53, 0.05); } .pg-sidebar-contact-action--email:hover { color: #ffffff !important; background: #ea4335 !important; border-color: #ea4335 !important; box-shadow: 0 6px 14px rgba(234, 67, 53, 0.25); transform: translateY(-2px) !important; } /* Facebook (Sidebar) */ .pg-sidebar-contact-action--facebook { color: #1877f2 !important; border-color: rgba(24, 119, 242, 0.2); background: rgba(24, 119, 242, 0.05); } .pg-sidebar-contact-action--facebook:hover { color: #ffffff !important; background: #1877f2 !important; border-color: #1877f2 !important; box-shadow: 0 6px 14px rgba(24, 119, 242, 0.25); transform: translateY(-2px) !important; } .pg-sidebar-cta__btn { display: flex; align-items: center; justify-content: center; gap: 0.5rem; width: 100%; background: var(--pg-surface-strong); color: var(--pg-dark); border-radius: 1rem; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); transition: transform 0.2s ease; } .pg-sidebar-cta__btn:hover { transform: translateY(-2px); } .pg-author-social-links { display: flex; flex-wrap: wrap; gap: 0.625rem; } .pg-author-social-link { display: inline-flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 0.75rem; clip-path: inset(0 round 0.75rem); border: 1px solid rgba(255, 255, 255, 0.25); background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: #fff; box-shadow: none; transition: transform 0.2s ease, background 0.2s ease; } .pg-author-social-link:hover { transform: translateY(-1px); background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff); } .pg-portal-social-label { display: inline-flex; align-items: center; gap: 0.5rem; font-size: 0.8125rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-muted); margin-bottom: 0.5rem; } .pg-portal-social-icon { display: inline-flex; align-items: center; justify-content: center; width: 28px; height: 28px; border-radius: 0.65rem; clip-path: inset(0 round 0.65rem); background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: #fff; flex: 0 0 auto; box-shadow: none; } .pg-portal-social-input { width: 100%; padding: 0.75rem 0.875rem; border: 1px solid var(--pg-border); border-radius: 0.5rem; background: var(--pg-surface-strong); color: var(--pg-text); } .pg-portal-social-input:focus { border-color: var(--pg-primary); box-shadow: 0 0 0 3px rgba(37,99,235,0.12); outline: none; } @media (max-width: 767px) { .pg-sidebar-drawer { padding-bottom: 6rem; max-height: 100dvh; } .pg-sidebar-drawer__nav { flex: 0 0 auto; } .pg-sidebar-cta { margin-bottom: 1.5rem; } } @keyframes pgSoftReveal { 0% { opacity: 0; transform: translate3d(0, 8px, 0) scale(0.992); filter: blur(6px); } 55% { opacity: 1; filter: blur(0); } 100% { opacity: 1; transform: translate3d(0, 0, 0) scale(1); filter: blur(0); } } .pg-soft-reveal { animation: pgSoftReveal 0.72s cubic-bezier(0.22, 1, 0.36, 1) both; } @media (prefers-reduced-motion: reduce) { * { animation-duration: 0.001ms !important; animation-iteration-count: 1 !important; scroll-behavior: auto !important; transition-duration: 0.001ms !important; } } /* SERVICES SECTION */ .pg-services-section { padding: 2.5rem var(--pg-page-gutter) 3.5rem; margin-top: var(--pg-page-gutter); background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-3xl); box-shadow: var(--pg-shadow-soft); } @media (max-width: 767px) { .pg-services-section { padding: 1.5rem var(--pg-page-gutter); border-radius: var(--pg-radius-2xl); } } /* HOMEPAGE MEDIA */ .pg-home-media { padding: 2rem var(--pg-page-gutter); margin-top: var(--pg-page-gutter); background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-3xl); box-shadow: var(--pg-shadow-soft); } .pg-home-media__header { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; } .pg-home-media__subtitle { margin-bottom: 0.45rem; color: var(--pg-link); font-size: 0.75rem; font-weight: var(--pg-weight-strong,700); letter-spacing: 0.15em; text-transform: uppercase; } .pg-home-media__title { margin: 0; color: var(--pg-dark); font-size: clamp(1.5rem, 3vw, 1.875rem); font-weight: var(--pg-weight-strong,700); } .pg-home-media__layout { display: grid; gap: 1.25rem; grid-template-columns: minmax(0, 1fr); } .pg-home-media__column-title { margin: 0 0 0.85rem; color: var(--pg-dark); font-size: 1rem; font-weight: var(--pg-weight-strong,700); } .pg-home-media__video-grid { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(min(100%, 13.5rem), 1fr)); } .pg-home-media__video { overflow: hidden; border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); background: var(--pg-surface-strong); } .pg-home-media__video-frame { aspect-ratio: 16 / 9; background: var(--pg-dark); } .pg-home-media__video-frame iframe, .pg-home-media__spotify iframe { display: block; width: 100%; border: 0; } .pg-home-media__video-frame iframe { height: 100%; } .pg-home-media__video-title { margin: 0; padding: 0.85rem 0.9rem 1rem; font-size: 0.92rem; font-weight: var(--pg-weight-strong,700); line-height: 1.45; } .pg-home-media__video-title a { color: var(--pg-dark); } .pg-home-media__video-title a:hover { color: var(--pg-link); } .pg-home-media__spotify { min-width: 0; } .pg-home-media__channels { min-width: 0; } .pg-home-media__channel-grid { display: grid; gap: 0.85rem; grid-template-columns: 1fr; } .pg-home-media__channel-card { border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); background: var(--pg-surface-strong); overflow: hidden; } .pg-home-media__channel-card a { display: flex; align-items: center; gap: 0.85rem; padding: 1rem; color: inherit; text-decoration: none; } .pg-home-media__channel-icon { width: 42px; height: 42px; border-radius: 0.85rem; display: inline-flex; align-items: center; justify-content: center; flex: 0 0 auto; color: var(--pg-color-white, #fff); background: var(--pg-gradient); } .pg-home-media__channel-title { display: block; color: var(--pg-dark); font-size: 0.95rem; font-weight: var(--pg-weight-strong,700); line-height: 1.35; } .pg-home-media__channel-kind { display: block; margin-top: 0.25rem; color: var(--pg-muted); font-size: 0.75rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; } .pg-pagination, .pg-pagination .nav-links { display: flex; align-items: center; justify-content: center; flex-wrap: wrap; gap: 0.5rem; } .pg-pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 2.5rem; min-height: 2.5rem; padding: 0 0.75rem; border: 1px solid var(--pg-border); border-radius: 0.75rem; background: var(--pg-surface-strong); color: var(--pg-text); font-size: 0.9rem; font-weight: var(--pg-weight-strong,700); line-height: 1; text-decoration: none; box-shadow: 0 8px 18px rgba(15, 23, 42, 0.06); transition: background 0.2s ease, border-color 0.2s ease, color 0.2s ease, transform 0.2s ease; } .pg-pagination a.page-numbers:hover { border-color: var(--pg-primary-light); background: var(--pg-bg-soft); color: var(--pg-link); transform: translateY(-1px); } .pg-pagination .page-numbers.current { border-color: var(--pg-primary); background: var(--pg-primary); color: var(--pg-color-white); box-shadow: 0 12px 24px rgba(20, 184, 166, 0.22); } .pg-pagination .page-numbers.dots { min-width: auto; padding: 0 0.25rem; border-color: transparent; background: transparent; box-shadow: none; color: var(--pg-muted); } .pg-pagination .page-numbers.prev, .pg-pagination .page-numbers.next { min-width: 3.25rem; } .pg-home-media__spotify iframe { height: 352px; border-radius: var(--pg-radius-xl); background: var(--pg-bg-soft); } @media (min-width: 1024px) { .pg-home-media__layout--has-youtube.pg-home-media__layout--has-spotify:not(.pg-home-media__layout--has-channels) { grid-template-columns: minmax(0, 1fr) minmax(22rem, 1fr); align-items: start; } .pg-home-media__layout--has-youtube.pg-home-media__layout--has-spotify.pg-home-media__layout--has-channels { grid-template-columns: minmax(0, 1.5fr) minmax(20rem, 0.9fr) minmax(14rem, 0.7fr); align-items: start; } .pg-home-media__layout--has-youtube.pg-home-media__layout--has-channels:not(.pg-home-media__layout--has-spotify), .pg-home-media__layout--has-spotify.pg-home-media__layout--has-channels:not(.pg-home-media__layout--has-youtube) { grid-template-columns: minmax(0, 1fr) minmax(14rem, 0.5fr); align-items: start; } } @media (max-width: 767px) { .pg-home-media { padding: 1.25rem; border-radius: var(--pg-radius-2xl); } .pg-home-media__header { align-items: flex-start; flex-direction: column; } } .pg-services__header { display: flex; flex-direction: column; gap: 1rem; margin-bottom: 2.5rem; } @media (min-width: 1024px) { .pg-services__header { flex-direction: row; align-items: center; justify-content: space-between; gap: 2rem; } } .pg-services__header-left { flex-shrink: 0; } .pg-services__subtitle { font-size: 0.75rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.15em; color: var(--pg-link); margin-bottom: 0.5rem; } .pg-services__title { font-size: 1.875rem; font-weight: var(--pg-weight-strong,700); background: var(--pg-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent; margin: 0; } .pg-services__desc { flex: 1; font-size: 0.875rem; line-height: 1.6; color: var(--pg-muted); margin: 0; max-width: 600px; } .pg-services__actions { flex-shrink: 0; } .pg-services__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; } @media (min-width: 640px) { .pg-services__grid > .pg-service-card { flex: 0 1 calc((100% - 1.5rem) / 2); } } @media (min-width: 1024px) { .pg-services__grid > .pg-service-card { flex: 0 1 calc((100% - 4.5rem) / 4); } } .pg-service-card { display: flex; flex: 0 1 100%; flex-direction: column; background: var(--pg-surface-strong); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-2xl); overflow: hidden; transition: all 0.25s ease; height: 100%; } .pg-service-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.1); border-color: var(--pg-primary-light); } .pg-service-card__img-wrap { aspect-ratio: 16 / 9; display: block; overflow: hidden; background: var(--pg-bg-soft); } .pg-service-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; } .pg-service-card:hover .pg-service-card__img { transform: scale(1.05); } .pg-service-card__body { display: flex; flex-direction: column; flex: 1; padding: 1.5rem; } .pg-service-card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--pg-bg-soft); color: var(--pg-link); border-radius: 1rem; margin-bottom: 1.25rem; border: 1px solid var(--pg-border); } .pg-service-card__icon svg { width: 24px; height: 24px; } .pg-service-card__title { font-size: 1.125rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0 0 0.75rem 0; line-height: 1.4; } .pg-service-card__excerpt { font-size: 0.875rem; line-height: 1.6; color: var(--pg-muted); margin: 0 0 1.5rem 0; flex: 1; /* Pushes the button to the bottom */ display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; } .pg-service-card__btn { width: 100%; justify-content: center; } /* FOOTER */ .pg-site-footer { position: relative; margin-top: 3rem; border-top: 1px solid rgba(226, 232, 240, 0.8); background-color: rgba(255, 255, 255, 0.9); padding: 2.5rem 0; box-shadow: 0 -18px 50px rgba(15, 23, 42, 0.05); } .pg-site-footer__overlay { position: absolute; inset: 0; background-color: rgba(255, 255, 255, 0.9); backdrop-filter: blur(8px); z-index: 1; } .pg-site-footer__inner { position: relative; z-index: 2; } .pg-footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(2, 1fr); } @media (min-width: 768px) { .pg-footer-grid { grid-template-columns: 1.2fr 0.8fr 0.8fr 0.8fr; } } .pg-footer-col--brand { text-align: left; } @media (min-width: 768px) { .pg-footer-col--brand { text-align: left; } } @media (min-width: 1024px) { .pg-footer-col--brand { text-align: center; } } .pg-footer-title { margin: 0 0 0.75rem 0; font-size: 1.25rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-footer-desc { margin: 0 auto; max-width: 28rem; font-size: 0.875rem; line-height: 1.75; color: var(--pg-muted); text-align: justify; text-align-last: left; } @media (min-width: 1024px) { .pg-footer-desc { text-align-last: center; } } .pg-footer-heading { margin: 0 0 0.75rem 0; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-footer-nav ul { display: grid; gap: 0.5rem; } .pg-footer-nav a { font-size: 0.875rem; font-weight: 600; color: var(--pg-muted); transition: color 0.2s; color: var(--pg-link); margin-bottom: 0.5rem; } .pg-services__title { font-size: 1.875rem; font-weight: var(--pg-weight-strong,700); background: var(--pg-gradient); -webkit-background-clip: text; -webkit-text-fill-color: transparent; background-clip: text; color: transparent; margin: 0; } .pg-services__desc { flex: 1; font-size: 0.875rem; line-height: 1.6; color: var(--pg-muted); margin: 0; max-width: 600px; } .pg-services__actions { flex-shrink: 0; } .pg-services__grid { display: flex; flex-wrap: wrap; justify-content: center; gap: 1.5rem; } @media (min-width: 640px) { .pg-services__grid > .pg-service-card { flex: 0 1 calc((100% - 1.5rem) / 2); } } @media (min-width: 1024px) { .pg-services__grid > .pg-service-card { flex: 0 1 calc((100% - 4.5rem) / 4); } } .pg-service-card { display: flex; flex: 0 1 100%; flex-direction: column; background: var(--pg-surface-strong); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-2xl); overflow: hidden; transition: all 0.25s ease; height: 100%; } .pg-service-card:hover { transform: translateY(-4px); box-shadow: 0 20px 40px -10px rgba(15, 23, 42, 0.1); border-color: var(--pg-primary-light); } .pg-service-card__img-wrap { aspect-ratio: 16 / 9; display: block; overflow: hidden; background: var(--pg-bg-soft); } .pg-service-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s ease; } .pg-service-card:hover .pg-service-card__img { transform: scale(1.05); } .pg-service-card__body { display: flex; flex-direction: column; flex: 1; padding: 1.5rem; } .pg-service-card__icon { display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; background: var(--pg-bg-soft); color: var(--pg-link); border-radius: 1rem; margin-bottom: 1.25rem; border: 1px solid var(--pg-border); } .pg-service-card__icon svg { width: 24px; height: 24px; } .pg-service-card__title { font-size: 1.125rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0 0 0.75rem 0; line-height: 1.4; } .pg-service-card__excerpt { font-size: 0.875rem; line-height: 1.6; color: var(--pg-muted); margin: 0 0 1.5rem 0; flex: 1; /* Pushes the button to the bottom */ } .pg-service-card__btn { width: 100%; justify-content: center; } /* FOOTER */ .pg-site-footer { position: relative; margin-top: 3rem; border-top: 1px solid var(--pg-border); background-color: var(--pg-footer-bg); background-image: var(--pg-footer-bg-image); background-size: cover; background-position: center; background-repeat: no-repeat; padding: 2.5rem 0; box-shadow: 0 -18px 50px rgba(15, 23, 42, 0.05); } .pg-site-footer__overlay { position: absolute; inset: 0; background-color: var(--pg-surface); backdrop-filter: blur(8px); z-index: 1; } /* Header action icon tooltips */ .pg-header-action { position: relative; } .pg-header-action--primary { background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; border-color: transparent !important; box-shadow: 0 12px 26px color-mix(in srgb, var(--pg-primary) 28%, transparent); } .pg-header-action--primary:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white, #fff) !important; box-shadow: 0 14px 30px color-mix(in srgb, var(--pg-secondary) 30%, transparent); } .pg-header-action:hover::after { content: attr(title); position: absolute; bottom: -2rem; left: 50%; transform: translateX(-50%); background: #1e293b; color: #fff; font-size: 0.6875rem; font-weight: 700; padding: 0.25rem 0.625rem; border-radius: 0.375rem; white-space: nowrap; pointer-events: none; z-index: 100; } .pg-site-footer__inner { position: relative; z-index: 2; } .pg-footer-grid { display: grid; gap: 2rem; grid-template-columns: repeat(2, 1fr); } @media (min-width: 768px) { .pg-footer-grid { grid-template-columns: 1.2fr 0.8fr 0.8fr 0.8fr; } } .pg-footer-col--brand { text-align: left; } @media (min-width: 768px) { .pg-footer-col--brand { text-align: left; } } @media (min-width: 1024px) { .pg-footer-col--brand { text-align: left; } } .pg-footer-title { margin: 0 0 0.75rem 0; font-size: 1.25rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-footer-desc { margin: 0; max-width: 28rem; font-size: 0.875rem; line-height: 1.75; color: var(--pg-muted); text-align: left; text-align-last: left; } @media (min-width: 1024px) { .pg-footer-desc { text-align-last: left; } } .pg-footer-heading { margin: 0 0 0.75rem 0; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-footer-nav ul { display: grid; gap: 0.5rem; } .pg-footer-nav a { font-size: 0.875rem; font-weight: 600; color: var(--pg-muted); transition: color 0.2s; } .pg-footer-nav a:hover { color: var(--pg-link); } /* Mobile header/footer refinements */ @media (max-width: 767px) { .pg-site-header__inner { justify-content: flex-start; gap: 0.75rem; } .pg-site-header__left { flex: 1; min-width: 0; gap: 0.65rem; } .pg-site-header .pg-logo-link { position: static; left: auto; transform: none; margin: 0; min-width: 0; flex: 1; } .pg-site-header .pg-logo-icon, .pg-site-header .pg-logo-img { width: 3.15rem; height: 3.15rem; flex: 0 0 auto; } .pg-site-header .pg-logo-text { min-width: 0; } .pg-site-header .pg-logo-title, .pg-site-header .pg-logo-desc { overflow: hidden; text-overflow: ellipsis; } .pg-site-header .pg-logo-desc { white-space: nowrap; letter-spacing: 0.18em; } .pg-site-header__right { flex: 0 0 auto; } .pg-site-footer { padding: 2rem 0 5rem; } .pg-footer-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 1.75rem 1.5rem; } .pg-footer-col--brand { grid-column: 1 / -1; text-align: left; } .pg-footer-col--brand .pg-logo-link { justify-content: flex-start; margin-bottom: 1rem !important; } .pg-footer-desc { margin: 0; max-width: none; text-align: left; text-align-last: left; } .pg-footer-heading { font-size: 1rem; } .pg-footer-nav ul { gap: 0.6rem; } } /* SUB HEADER */ .pg-sub-header-wrapper { position: sticky; top: 6.25rem; z-index: 40; } body.admin-bar .pg-sub-header-wrapper { top: calc(6.25rem + 32px); } @media (max-width: 782px) { body.admin-bar .pg-sub-header-wrapper { top: calc(6.25rem + 46px); } } #pgNewsroom, #pgHomeMedia, #pgServices { scroll-margin-top: 9rem; } body.admin-bar #pgNewsroom, body.admin-bar #pgHomeMedia, body.admin-bar #pgServices { scroll-margin-top: 11rem; } .pg-sub-header { margin-top: 5px; background: var(--pg-surface-strong); border-radius: 9999px; border: 1px solid var(--pg-border); padding: 0.35rem; box-shadow: var(--pg-shadow-soft); overflow-x: auto; -webkit-overflow-scrolling: touch; } .pg-sub-header::-webkit-scrollbar { display: none; } .pg-sub-nav { display: flex; align-items: center; justify-content: center; gap: 0.25rem; margin: 0; min-width: 100%; } @media (min-width: 768px) { .pg-sub-nav { justify-content: center; } } .pg-sub-nav li { flex-shrink: 0; } .pg-sub-nav a { display: inline-flex; align-items: center; justify-content: center; padding: 0.5rem 1.25rem; border-radius: 9999px; font-weight: var(--pg-weight-strong,700); font-size: 0.875rem; color: var(--pg-muted); white-space: nowrap; transition: all 0.2s ease; } .pg-sub-nav a:hover { background: var(--pg-bg-soft); color: var(--pg-dark); } .pg-sub-nav a.is-active, .pg-sub-nav li.current-menu-item > a { background: var(--pg-gradient); color: var(--pg-color-white); box-shadow: 0 4px 12px color-mix(in srgb, var(--pg-primary) 20%, transparent); } .pg-drag-scroll { cursor: grab; overflow-x: auto; overscroll-behavior-inline: contain; scroll-behavior: smooth; scrollbar-width: thin !important; scrollbar-color: var(--pg-secondary) rgba(34, 211, 238, 0.14); touch-action: pan-x; -webkit-overflow-scrolling: touch; } .pg-drag-scroll::-webkit-scrollbar { height: 6px; } .pg-drag-scroll::-webkit-scrollbar-track { background: linear-gradient(90deg, rgba(34, 211, 238, 0.12), color-mix(in srgb, var(--pg-secondary) 12%, transparent)); border-radius: 999px; } .pg-drag-scroll::-webkit-scrollbar-thumb { background: linear-gradient(90deg, #22d3ee, var(--pg-secondary)); border-radius: 999px; box-shadow: 0 0 10px rgba(34, 211, 238, 0.25); } .pg-drag-scroll::-webkit-scrollbar-thumb:hover { background: linear-gradient(90deg, #06b6d4, #34d3ac); } .pg-drag-scroll.is-dragging { cursor: grabbing; scroll-behavior: auto; user-select: none; } /* HOMEPAGE LAYOUT */ .pg-home-grid { display: flex; flex-direction: column; gap: var(--pg-page-gutter); margin-top: var(--pg-page-gutter); margin-bottom: var(--pg-page-gutter); } .pg-home-col--center { order: -1; } @media (min-width: 1024px) { .pg-home-grid { display: grid; grid-template-columns: 280px minmax(0, 1fr) 280px; align-items: stretch; } .pg-home-col--center { order: 0; } } @media (min-width: 1280px) { .pg-home-grid { grid-template-columns: 320px minmax(0, 1fr) 320px; } } /* CARDS SPECIFIC */ .pg-home-side-card { padding: 1.5rem; display: flex; flex-direction: column; gap: 1.25rem; height: 100%; } .pg-side-content { display: flex; flex-direction: column; gap: 0.75rem; flex: 1; } .pg-side-header { display: flex; flex-direction: column; align-items: flex-start; gap: 0.75rem; } .pg-side-header__subtitle { font-size: 0.6875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.1em; margin-bottom: 0.25rem; } .pg-side-header__subtitle--green { color: var(--pg-secondary); } .pg-side-header__subtitle--blue { color: var(--pg-link); } .pg-side-header__title { font-size: 1.25rem; font-weight: var(--pg-weight-strong,700); margin: 0; color: var(--pg-dark); } .pg-side-header__link { font-size: 0.75rem; font-weight: 700; color: var(--pg-dark); background: var(--pg-bg); padding: 0.25rem 0.75rem; border-radius: 9999px; transition: background 0.2s; } .pg-side-header__link:hover { background: var(--pg-bg-soft); } /* EVENT LIST */ .pg-event-item { display: block; padding: 1rem; border-radius: 1rem; background: var(--pg-block-bg); border: 1px solid var(--pg-border); transition: all 0.2s; } .pg-event-item:hover { background: var(--pg-brand-tint, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 8%, transparent), color-mix(in srgb, var(--pg-secondary) 10%, transparent))); border-color: var(--pg-primary-light); box-shadow: 0 4px 6px -1px rgba(0,0,0,0.05); transform: translateY(-2px); } .pg-event-item--highlight { background: var(--pg-brand-tint, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 12%, transparent), color-mix(in srgb, var(--pg-secondary) 14%, transparent))); border-color: color-mix(in srgb, var(--pg-primary) 32%, transparent); } .pg-event-item--highlight:hover { background: var(--pg-brand-tint, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 18%, transparent), color-mix(in srgb, var(--pg-secondary) 20%, transparent))); border-color: var(--pg-secondary); } .pg-event-item__title { font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-text); line-height: 1.4; margin: 0 0 0.5rem 0; } .pg-event-item__meta { font-size: 0.75rem; font-weight: 600; color: var(--pg-muted); } /* AUTHOR LIST */ .pg-author-item { display: flex; align-items: center; gap: 1rem; padding: 1rem; background: var(--pg-surface-strong); border: 1px solid var(--pg-border); border-radius: 1.25rem; transition: all 0.2s; } .pg-author-item:hover { border-color: var(--pg-primary-light); box-shadow: 0 4px 12px rgba(15,23,42,0.05); transform: translateY(-2px); } .pg-author-avatar { width: 48px; height: 48px; border-radius: 1rem; object-fit: cover; background: var(--pg-bg-soft); } .pg-author-info { flex: 1; min-width: 0; } .pg-author-name { font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0 0 0.15rem 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; } .pg-author-role { font-size: 0.75rem; font-weight: 500; color: var(--pg-muted); margin: 0 0 0.5rem 0; } .pg-author-ranks { display: flex; flex-wrap: wrap; gap: 0.35rem; margin: -0.1rem 0 0.5rem; } .pg-author-rank { display: inline-flex; align-items: center; padding: 0.18rem 0.45rem; border-radius: 999px; border: 1px solid color-mix(in srgb, var(--pg-primary) 22%, transparent); background: color-mix(in srgb, var(--pg-primary) 9%, transparent); color: var(--pg-link); font-size: 0.625rem; font-weight: var(--pg-weight-strong,700); line-height: 1.2; } .pg-author-rank--primary { border-color: transparent; background: var(--pg-gradient); color: #fff; } .pg-author-stats { display: flex; gap: 0.5rem; } .pg-author-stat { font-size: 0.6875rem; font-weight: 700; color: var(--pg-muted); background: var(--pg-bg); padding: 0.15rem 0.5rem; border-radius: 9999px; } /* HERO SECTION */ .pg-hero-wrap { display: flex; flex-direction: column; gap: 1.5rem; } .pg-hero-main { position: relative; aspect-ratio: 16 / 9; border-radius: var(--pg-radius-3xl); overflow: hidden; background: #1e293b; box-shadow: var(--pg-shadow-strong); } @media (max-width: 767px) { .pg-hero-main { aspect-ratio: 4 / 3; } } .pg-hero-bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; /* The hero artwork is the visual. Do not dim it with a parent colour. */ opacity: 1; } .pg-hero-bg--placeholder { background: radial-gradient(circle at 18% 18%, color-mix(in srgb, var(--pg-primary) 34%, transparent), transparent 34%), radial-gradient(circle at 80% 20%, color-mix(in srgb, var(--pg-secondary) 30%, transparent), transparent 32%), linear-gradient(135deg, var(--pg-dark), color-mix(in srgb, var(--pg-primary) 24%, var(--pg-dark))); } .pg-hero-overlay { position: absolute; inset: 0; /* Text already has its own shadow; leave the photo completely unobscured. */ background: transparent; } .pg-hero-content { position: absolute; inset: 0; display: flex; flex-direction: column; justify-content: flex-end; padding: 2.5rem 2.5rem 3.5rem 2.5rem; z-index: 30; pointer-events: none; } @media (max-width: 767px) { .pg-hero-content { padding: 1.5rem 1.5rem 2.75rem 1.5rem; } } .pg-hero-title { font-size: 1.875rem; font-weight: var(--pg-weight-strong,700); line-height: 1.25; color: #fff; margin: 0 0 0.75rem 0; max-width: 95%; /* Readable on a light or dark photograph without reintroducing a veil. */ text-shadow: 0 2px 4px rgba(3, 24, 46, 0.92), 0 8px 20px rgba(3, 24, 46, 0.58); } @media (max-width: 767px) { .pg-hero-title { font-size: 1.5rem; } } .pg-hero-desc { font-size: 0.9375rem; font-weight: 400; color: rgba(255, 255, 255, 0.9); margin: 0 0 1.5rem 0; max-width: 85%; line-height: 1.5; } @media (max-width: 767px) { .pg-hero-desc { font-size: 0.875rem; max-width: 100%; } } .pg-hero-actions { display: flex; align-items: center; gap: 0.75rem; flex-wrap: wrap; opacity: 0; transform: translateY(10px); pointer-events: none; transition: opacity 0.2s ease, transform 0.2s ease; } @media (hover: hover) and (pointer: fine) { .pg-hero-main:hover .pg-hero-slide.is-active .pg-hero-actions, .pg-hero-main:focus-visible .pg-hero-slide.is-active .pg-hero-actions, .pg-hero-slide.is-active .pg-hero-actions:focus-within { opacity: 1; transform: translateY(0); pointer-events: auto; } } @media (hover: none), (pointer: coarse) { .pg-hero-slide.is-active .pg-hero-actions { opacity: 1; transform: none; pointer-events: auto; } } .pg-hero-btn-primary { background: var(--pg-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; clip-path: inset(0 round 1rem); color: var(--pg-color-white, #fff) !important; border-radius: 1rem; box-shadow: 0 12px 28px color-mix(in srgb, var(--pg-primary) 28%, transparent); border: none; min-height: 46px; padding: 0.7rem 1.35rem; font-weight: 600; } .pg-hero-btn-primary:hover { background: var(--pg-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; transform: translateY(-2px); box-shadow: 0 15px 35px color-mix(in srgb, var(--pg-primary) 36%, transparent); } .pg-hero-btn-soft { background: var(--pg-surface-strong); color: var(--pg-dark); border-radius: 9999px; padding: 0.625rem 1.25rem; font-weight: 600; } .pg-hero-btn-soft:empty { display: none; } .pg-hero-btn-soft:hover { background: var(--pg-bg-soft); } .pg-hero-nav-area { position: absolute; top: 0; bottom: 0; width: 15%; min-width: 80px; z-index: 20; pointer-events: none; display: flex; align-items: center; cursor: pointer; opacity: 0; transition: opacity 0.3s; } .pg-hero-nav-area:hover { opacity: 1; } .pg-hero-nav-area--left { left: 0; justify-content: flex-start; padding-left: 1.5rem; background: linear-gradient(to right, rgba(0,0,0,0.3), transparent); } .pg-hero-nav-area--right { right: 0; justify-content: flex-end; padding-right: 1.5rem; background: linear-gradient(to left, rgba(0,0,0,0.3), transparent); } .pg-hero-arrow { width: 48px; height: 48px; pointer-events: auto; border-radius: 50%; background: rgba(255, 255, 255, 0.2); backdrop-filter: blur(8px); color: #fff; display: flex; align-items: center; justify-content: center; border: 1px solid rgba(255,255,255,0.4); transition: transform 0.2s, background 0.2s; } .pg-hero-nav-area:hover .pg-hero-arrow { background: rgba(255, 255, 255, 0.4); transform: scale(1.1); } /* HERO HIGHLIGHTS */ .pg-hero-highlights { display: grid; gap: 1.25rem; grid-template-columns: repeat(3, 1fr); } .pg-hero-highlights.pg-block-count-1 { grid-template-columns: minmax(0, 1fr); } .pg-hero-highlights.pg-block-count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); } @media (max-width: 767px) { .pg-hero-highlights { grid-template-columns: 1fr; } } .pg-highlight-card { display: flex; flex-direction: column; gap: 0.75rem; background: var(--pg-surface-strong); border: 1px solid var(--pg-border); border-radius: 1.25rem; padding: 0.75rem; transition: all 0.2s; } .pg-hero-highlights.pg-block-count-1 .pg-highlight-card { display: flex; flex-direction: row; align-items: center; gap: 1.25rem; min-height: 172px; padding: 1rem; overflow: hidden; } .pg-highlight-card:hover { border-color: var(--pg-primary-light); box-shadow: var(--pg-shadow-soft); transform: translateY(-2px); } .pg-highlight-img { aspect-ratio: 16 / 9; border-radius: 0.75rem; overflow: hidden; background: var(--pg-bg-soft); } .pg-highlight-img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.5s; } .pg-highlight-card:hover .pg-highlight-img img { transform: scale(1.05); } .pg-hero-highlights.pg-block-count-1 .pg-highlight-img { flex: 0 0 min(42%, 260px); height: 100%; min-height: 140px; } .pg-highlight-body { flex: 1 1 auto; min-width: 0; position: relative; z-index: 1; } .pg-highlight-img-placeholder { width: 100%; height: 100%; display: flex; align-items: center; justify-content: center; background: var(--pg-bg-soft); } .pg-highlight-cat { font-size: 0.6875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; color: var(--pg-link); letter-spacing: 0.05em; margin: 0; } .pg-hero-highlights.pg-block-count-1 .pg-highlight-cat { font-size: 0.75rem; } .pg-highlight-title { font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); line-height: 1.4; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .pg-hero-highlights.pg-block-count-1 .pg-highlight-title { font-size: clamp(1rem, 1.7vw, 1.28rem); line-height: 1.25; -webkit-line-clamp: 3; } .pg-highlight-excerpt { display: none; margin: 0.5rem 0 0; color: var(--pg-muted); font-size: 0.85rem; font-weight: 600; line-height: 1.5; text-shadow: 0 2px 10px rgba(3, 24, 46, 0.88); } .pg-highlight-cta { display: none; width: fit-content; margin-top: 0.85rem; color: var(--pg-link); font-size: 0.78rem; font-weight: var(--pg-weight-strong,700); } .pg-hero-highlights.pg-block-count-1 .pg-highlight-excerpt, .pg-hero-highlights.pg-block-count-1 .pg-highlight-cta { display: block; } @media (max-width: 767px) { .pg-hero-highlights.pg-block-count-1 .pg-highlight-card { display: flex; flex-direction: column; align-items: stretch; min-height: 0; } .pg-hero-highlights.pg-block-count-1 .pg-highlight-img { flex-basis: auto; min-height: 0; } } /* === CAROUSEL SLIDE SYSTEM === */ .pg-hero-slide { position: absolute; inset: 0; opacity: 0; visibility: hidden; transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1), transform 0.65s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 0.65s; transform: translateX(40px); z-index: 1; } .pg-hero-slide.is-active { opacity: 1; visibility: visible; transform: translateX(0); z-index: 2; transition: opacity 0.65s cubic-bezier(0.4,0,0.2,1), transform 0.65s cubic-bezier(0.4,0,0.2,1), visibility 0s linear 0s; } .pg-hero-slide.is-leaving { opacity: 0; transform: translateX(-40px); z-index: 1; } .pg-hero-cat-tag { display: inline-flex; align-items: center; margin-bottom: 1rem; padding: 0.25rem 0.85rem; border-radius: 9999px; font-size: 0.6875rem; font-weight: var(--pg-weight-strong,700); letter-spacing: 0.08em; text-transform: uppercase; color: #fff; background: rgba(255,255,255,0.18); border: 1px solid rgba(255,255,255,0.35); backdrop-filter: blur(6px); transition: background 0.2s; width: fit-content; } .pg-hero-cat-tag:hover { background: rgba(255,255,255,0.3); } .pg-hero-dots { position: absolute; bottom: 1.25rem; left: 50%; transform: translateX(-50%); display: flex; gap: 0.5rem; z-index: 25; } .pg-hero-dot { width: 8px; height: 8px; border-radius: 9999px; background: rgba(255,255,255,0.45); border: none; cursor: pointer; transition: width 0.35s, background 0.3s; padding: 0; } .pg-hero-dot.is-active { width: 28px; background: #fff; } .pg-author-online-dot { position: absolute; bottom: -2px; right: -2px; width: 14px; height: 14px; background: var(--pg-gradient); border: 2px solid #fff; border-radius: 50%; display: block; } @keyframes pgHighlightIn { from { opacity: 0; transform: translateY(12px); } to { opacity: 1; transform: translateY(0); } } .pg-highlight-card { animation: pgHighlightIn 0.5s cubic-bezier(0.22,1,0.36,1) both; } .pg-highlight-card:nth-child(2) { animation-delay: 0.08s; } .pg-highlight-card:nth-child(3) { animation-delay: 0.16s; } /* === BLOCK PAGINATION NAV === */ .pg-side-nav-row { display: flex; align-items: center; justify-content: space-between; width: 100%; gap: 0.25rem; } .pg-block-nav-btn { display: inline-flex; align-items: center; justify-content: center; width: 26px; height: 26px; border-radius: 50%; border: 1px solid var(--pg-border); background: var(--pg-surface-strong); color: var(--pg-text); font-size: 1rem; line-height: 1; cursor: pointer; transition: background 0.18s, border-color 0.18s, transform 0.18s; } .pg-block-nav-btn:hover { background: var(--pg-bg); border-color: var(--pg-primary-light); color: var(--pg-link); transform: scale(1.08); } .pg-block-nav-btn:disabled { opacity: 0.35; pointer-events: none; } .pg-block-nav-count { font-size: 0.6875rem; font-weight: 700; color: var(--pg-muted); min-width: 2.5rem; text-align: center; } .pg-block-loading { font-size: 0.8125rem; color: var(--pg-muted); padding: 1rem 0; text-align: center; } /* Block list container transitions (managed inline by JS) */ .pg-block-list { will-change: opacity, transform; } /* Highlights nav bar */ .pg-highlights-wrap { display: flex; flex-direction: column; gap: 0.75rem; } .pg-highlights-nav { display: flex; align-items: center; justify-content: space-between; } .pg-highlights-label { font-size: 0.75rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.08em; color: var(--pg-muted); } .pg-highlights-nav-btns { display: flex; align-items: center; gap: 0.25rem; } /* ------------------------------------------------------- SECTION 2: NEWSROOM ------------------------------------------------------- */ .pg-newsroom { margin-top: var(--pg-page-gutter); margin-bottom: var(--pg-page-gutter); padding: 2rem var(--pg-page-gutter); background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-3xl); box-shadow: var(--pg-shadow-soft); } .pg-newsroom__header { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 1.75rem; flex-wrap: wrap; gap: 1rem; } .pg-newsroom__subtitle { font-size: 0.6875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.1em; color: var(--pg-link); margin-bottom: 0.25rem; } .pg-newsroom__title { font-size: 1.5rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0; } .pg-newsroom__actions { display: flex; align-items: center; gap: 1rem; } .pg-newsroom__grid { gap: 1.25rem; } .pg-newsroom__pagination { margin-top: 2.25rem; } .pg-newsroom .pg-newsroom__grid { grid-template-columns: repeat(var(--pg-news-columns, 3), minmax(0, 1fr)); } .pg-newsroom__grid > [hidden] { display: none !important; } .pg-newsroom__slider-nav { display: flex; align-items: center; justify-content: center; gap: .9rem; margin-top: 1.5rem; } .pg-newsroom__slider-nav[hidden] { display: none !important; } .pg-newsroom__slide-button { width: 42px; height: 42px; border: 1px solid var(--pg-border); border-radius: 50%; background: var(--pg-surface-strong); color: var(--pg-link); font: inherit; font-size: 1.5rem; cursor: pointer; } .pg-newsroom__slide-button:hover, .pg-newsroom__slide-button:focus-visible { border-color: var(--pg-primary); background: var(--pg-bg-soft); outline-offset: 2px; } .pg-newsroom__slide-count { min-width: 3.5rem; color: var(--pg-muted); font-size: .875rem; font-weight: var(--pg-weight-strong,700); text-align: center; } @media (max-width: 900px) { .pg-newsroom .pg-newsroom__grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pg-newsroom[data-columns="1"] .pg-newsroom__grid { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 480px) { .pg-newsroom .pg-newsroom__grid { grid-template-columns: minmax(0, 1fr); } } /* Mobile newsroom layout handled in mobile block at end of file */ .pg-knowledge-page .pg-knowledge-grid { grid-template-columns: repeat(var(--pg-knowledge-columns, 4), minmax(0, 1fr)); } .pg-page-intro { max-width: 72ch; margin: 0 0 1.5rem; color: var(--pg-text); line-height: 1.65; } .pg-page-intro > :first-child { margin-top: 0; } .pg-page-intro > :last-child { margin-bottom: 0; } .pg-home-page-intro { margin-block: 1.5rem; } .pg-knowledge-grid > [hidden] { display: none !important; } .pg-article-slider-nav { display: flex; align-items: center; justify-content: center; gap: .9rem; margin-top: 1.5rem; } .pg-article-slider-nav[hidden] { display: none !important; } .pg-article-slider-nav button { width: 42px; height: 42px; border: 1px solid var(--pg-border); border-radius: 50%; background: var(--pg-surface-strong); color: var(--pg-link); font: inherit; font-size: 1.5rem; cursor: pointer; } .pg-article-slider-nav button:hover, .pg-article-slider-nav button:focus-visible { border-color: var(--pg-primary); background: var(--pg-bg-soft); outline-offset: 2px; } .pg-article-slider-nav span { min-width: 3.5rem; color: var(--pg-muted); font-size: .875rem; font-weight: var(--pg-weight-strong,700); text-align: center; } .pg-pagination--slider { display: flex; align-items: center; justify-content: center; gap: .9rem; margin-top: 2rem; } .pg-pagination--slider .page-numbers.prev, .pg-pagination--slider .page-numbers.next { display: inline-flex; width: 42px; height: 42px; min-width: 42px; align-items: center; justify-content: center; margin: 0; padding: 0; border: 1px solid var(--pg-border); border-radius: 50%; background: var(--pg-surface-strong); color: var(--pg-link); font-size: 1.5rem; text-decoration: none; } .pg-pagination--slider .page-numbers.is-disabled { opacity: .35; } .pg-pagination--slider .pg-pagination__count { min-width: 3.5rem; color: var(--pg-muted); font-size: .875rem; font-weight: var(--pg-weight-strong,700); text-align: center; } .pg-blog-index .pg-article-grid { grid-template-columns: repeat(var(--pg-blog-columns, 4), minmax(0, 1fr)); } @media (max-width: 900px) { .pg-blog-index .pg-article-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pg-blog-index[data-columns="1"] .pg-article-grid { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 900px) { .pg-knowledge-page .pg-knowledge-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); } .pg-knowledge-page[data-columns="1"] .pg-knowledge-grid { grid-template-columns: minmax(0, 1fr); } } @media (max-width: 480px) { .pg-knowledge-page .pg-knowledge-grid { grid-template-columns: minmax(0, 1fr); } } /* NEWSROOM CARD */ .pg-block-list > [hidden] { display: none !important; } .pg-author-avatar-wrap { position: relative; flex: 0 0 auto; } .pg-news-card { display: flex; flex-direction: column; background: var(--pg-surface-strong); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); overflow: hidden; transition: all 0.25s ease; } .pg-news-card:hover { border-color: var(--pg-primary-light); box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08); transform: translateY(-4px); } .pg-news-card__img { aspect-ratio: 16 / 9; overflow: hidden; background: var(--pg-bg-soft); position: relative; } .pg-news-card__img img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease; } .pg-news-card:hover .pg-news-card__img img { transform: scale(1.06); } .pg-news-card__img-placeholder { width: 100%; height: 100%; background: var(--pg-bg-soft); display: flex; align-items: center; justify-content: center; color: var(--pg-muted); font-size: 2rem; } .pg-news-card__body { padding: 1.25rem; display: flex; flex-direction: column; flex: 1; gap: 0.5rem; } .pg-news-card__cat { display: inline-flex; align-self: flex-start; font-size: 0.6875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.06em; color: var(--pg-link); background: color-mix(in srgb, var(--pg-primary) 8%, transparent); padding: 0.2rem 0.6rem; border-radius: 9999px; transition: background 0.2s; } .pg-news-card__cat:hover { background: color-mix(in srgb, var(--pg-primary) 16%, transparent); color: var(--pg-link); } .pg-news-card__title { font-size: 1rem; font-weight: 700; color: var(--pg-dark); line-height: 1.4; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .pg-news-card__excerpt { font-size: 0.8125rem; color: var(--pg-muted); line-height: 1.6; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; flex: 1; } .pg-news-card__footer { display: flex; align-items: center; justify-content: space-between; padding-top: 0.75rem; border-top: 1px solid var(--pg-border); margin-top: auto; } .pg-news-card__author { display: flex; align-items: center; gap: 0.5rem; min-width: 0; } .pg-news-card__author-img { width: 28px; height: 28px; border-radius: 50%; object-fit: cover; background: var(--pg-bg-soft); flex-shrink: 0; } .pg-news-card__author-name { font-size: 0.75rem; font-weight: 700; color: var(--pg-dark); white-space: normal; overflow-wrap: anywhere; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.2s; } .pg-news-card__author:hover .pg-news-card__author-name { color: var(--pg-link); } .pg-news-card__meta { display: flex; align-items: center; gap: 0.75rem; font-size: 0.6875rem; font-weight: 600; color: var(--pg-muted); flex-shrink: 0; } .pg-news-card__meta-item { display: inline-flex; align-items: center; gap: 0.25rem; } .pg-news-card__meta-icon { width: 13px; height: 13px; opacity: 0.6; } .pg-news-card__read-btn { display: inline-flex; align-items: center; justify-content: center; margin-top: 0.75rem; padding: 0.5rem 1rem; border-radius: 0.75rem; font-size: 0.8125rem; font-weight: 700; color: var(--pg-link); background: color-mix(in srgb, var(--pg-primary) 6%, transparent); border: 1px solid color-mix(in srgb, var(--pg-primary) 12%, transparent); transition: all 0.2s; text-align: center; } .pg-news-card__read-btn:hover { background: var(--pg-primary); color: #fff; border-color: var(--pg-primary); } /* SINGLE POST LAYOUT */ body.single-post:not(.pg-book-reader-active) .pg-entry-content { background: #fffdf9; border-color: #eadfce; box-shadow: 0 14px 36px rgba(92, 67, 37, 0.06); } body.single-post:not(.pg-book-reader-active) .pg-single-author-inline, body.single-post:not(.pg-book-reader-active) .pg-toc-widget, body.single-post:not(.pg-book-reader-active) .pg-share-widget { background-color: var(--pg-surface-strong); border-color: var(--pg-border); } .pg-single { padding-top: 2rem; padding-bottom: 4rem; } .pg-single-header { margin-bottom: 1.5rem; text-align: left; } .pg-single-title { font-size: 2rem; font-weight: var(--pg-weight-strong,700); line-height: 1.2; color: var(--pg-dark); margin: 0 0 1rem 0; } @media (min-width: 768px) { .pg-single-title { font-size: 2.5rem; } } @media (min-width: 1024px) { .pg-single-title { font-size: 2.75rem; } } /* Meta row: category left | views center | date right */ .pg-single-meta-row { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; font-size: 0.8125rem; font-weight: 700; color: var(--pg-muted); margin-bottom: 1rem; flex-wrap: wrap; } .pg-single-cat { display: inline-flex; align-items: center; background: color-mix(in srgb, var(--pg-primary) 8%, transparent); color: var(--pg-link); padding: 0.25rem 0.85rem; border-radius: 9999px; text-transform: uppercase; letter-spacing: 0.06em; font-size: 0.7rem; font-weight: var(--pg-weight-strong,700); transition: background 0.2s, color 0.2s; } a.pg-single-cat:hover { background: color-mix(in srgb, var(--pg-primary) 16%, transparent); color: var(--pg-link); } body.single-psyguild_service .pg-single-cat { background: transparent; border: 0; box-shadow: none; outline: 0; padding: 0; border-radius: 0; } body.single-psyguild_service a.pg-single-cat:hover, body.single-psyguild_service a.pg-single-cat:focus, body.single-psyguild_service a.pg-single-cat:focus-visible { background: transparent; border: 0; box-shadow: none; outline: 0; color: var(--pg-link); } /* Dedicated service detail โ€” intentionally separate from article metadata, audio, and share controls. */ body.single-psyguild_service .pg-single--service { padding-top: clamp(1.5rem, 4vw, 3rem); padding-bottom: clamp(2.5rem, 6vw, 5rem); } .pg-service-single-header { margin: 0 0 1.25rem; padding: clamp(1.5rem, 3vw, 2.5rem); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl, 1.5rem); background: var(--pg-surface-strong); } .pg-service-single-header__eyebrow { display: inline-flex; color: var(--pg-primary-deep, var(--pg-primary)); font-size: .75rem; font-weight: var(--pg-weight-strong,700); letter-spacing: .08em; text-transform: uppercase; } .pg-service-single-header__title { margin: .55rem 0 0; color: var(--pg-dark); font-size: clamp(2rem, 4vw, 3.25rem); font-weight: var(--pg-weight-strong,700); line-height: 1.12; } .pg-service-single-header__excerpt { max-width: 760px; margin: .85rem 0 0; color: var(--pg-muted); font-size: 1.05rem; line-height: 1.65; } .pg-single-views { font-size: 0.8125rem; font-weight: 600; color: var(--pg-muted); } .pg-single-date { font-size: 0.8125rem; font-weight: 600; color: var(--pg-muted); } .pg-single-excerpt { max-width: 800px; margin: 0 0 1rem 0; font-size: 1.0625rem; line-height: 1.7; color: var(--pg-muted); font-weight: 500; } /* Info row: reading time left | author right */ .pg-single-info-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin-bottom: 1.5rem; flex-wrap: wrap; } .pg-single-read-time { display: inline-flex; align-items: center; gap: 0.35rem; font-size: 0.8125rem; font-weight: 600; color: var(--pg-muted); } .pg-single-read-time svg { opacity: 0.55; flex-shrink: 0; } /* Inline author: circular avatar + name */ .pg-single-author-inline { display: inline-flex; align-items: center; gap: 0.6rem; padding: 0.3rem 0.85rem 0.3rem 0.3rem; border-radius: 9999px; background: var(--pg-bg-soft); border: 1px solid var(--pg-border); transition: all 0.2s ease; } .pg-single-author-inline:hover { background: var(--pg-surface-strong); border-color: var(--pg-primary-light); box-shadow: 0 2px 8px color-mix(in srgb, var(--pg-primary) 10%, transparent); } .pg-single-author-avatar { width: 32px; height: 32px; border-radius: 50%; object-fit: cover; flex-shrink: 0; background: var(--pg-bg-soft); } .pg-single-author-name { font-size: 0.8125rem; font-weight: 700; color: var(--pg-dark); white-space: nowrap; transition: color 0.2s; } .pg-single-author-inline:hover .pg-single-author-name { color: var(--pg-link); } .pg-single-featured-img { margin-bottom: 0; border-radius: var(--pg-radius-2xl); } @media (min-width: 768px) { .pg-single-featured-img { border-radius: var(--pg-radius-3xl); } } /* CONTENT GRID LAYOUT */ .pg-single-grid { display: grid; gap: 2rem; grid-template-columns: 1fr; align-items: start; } @media (min-width: 1024px) { .pg-single-grid { grid-template-columns: minmax(0, 3fr) minmax(260px, 1fr); gap: 2.5rem; } } /* Entry Content */ .pg-entry-content { background: var(--pg-surface-strong); padding: 2rem; border-radius: var(--pg-radius-2xl); border: 1px solid var(--pg-border); box-shadow: var(--pg-shadow-soft); font-size: 1.0625rem; line-height: 1.85; color: var(--pg-text); overflow-wrap: break-word; word-wrap: break-word; } @media (max-width: 639px) { .pg-entry-content { padding: 1.25rem; font-size: 1rem; border-radius: var(--pg-radius-xl); } } .pg-entry-content h2 { font-size: 1.625rem; font-weight: var(--pg-weight-strong,700); margin: 2.5rem 0 1rem 0; color: var(--pg-dark); line-height: 1.3; scroll-margin-top: 6rem; } .pg-entry-content h3 { font-size: 1.3rem; font-weight: var(--pg-weight-strong,700); margin: 2rem 0 0.75rem 0; color: var(--pg-dark); line-height: 1.35; scroll-margin-top: 6rem; } .pg-entry-content h4 { font-size: 1.125rem; font-weight: var(--pg-weight-strong,700); margin: 1.5rem 0 0.5rem 0; color: var(--pg-dark); } .pg-entry-content p { margin: 0 0 1.5rem 0; } .pg-entry-content ul, .pg-entry-content ol { margin: 0 0 1.5rem 0; padding-left: 1.5rem; list-style: revert; } .pg-entry-content li { margin-bottom: 0.35rem; } .pg-entry-content img { max-width: 100%; height: auto; border-radius: 1rem; margin: 1rem 0; } .pg-entry-content blockquote { border-left: 4px solid var(--pg-primary); margin: 1.5rem 0; padding: 1rem 1.5rem; background: color-mix(in srgb, var(--pg-primary) 4%, transparent); border-radius: 0 var(--pg-radius-lg) var(--pg-radius-lg) 0; color: #475569; font-style: italic; } .pg-entry-content blockquote p:last-child { margin-bottom: 0; } .pg-entry-content a { color: var(--pg-link); text-decoration: underline; text-underline-offset: 2px; transition: color 0.2s; } .pg-entry-content a:hover { color: var(--pg-link); } .pg-entry-content pre { background: var(--pg-surface-strong); color: var(--pg-text); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-lg); padding: 1.25rem; overflow-x: auto; font-size: 0.875rem; margin: 1.5rem 0; } .pg-entry-content code { background: var(--pg-bg-soft); padding: 0.15rem 0.4rem; border-radius: 0.375rem; font-size: 0.9em; } .pg-entry-content pre code { background: transparent; padding: 0; border-radius: 0; } .pg-entry-content table { width: 100%; border-collapse: collapse; margin: 1.5rem 0; font-size: 0.9375rem; } .pg-entry-content th, .pg-entry-content td { padding: 0.75rem 1rem; border: 1px solid var(--pg-border); text-align: left; } .pg-entry-content th { background: var(--pg-bg-soft); font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-entry-content hr { border: none; border-top: 1px solid var(--pg-border); margin: 2rem 0; } /* SIDEBAR STICKY */ .pg-single-sidebar { display: flex; flex-direction: column; gap: 1.5rem; } @media (min-width: 1024px) { .pg-single-sidebar { position: sticky; top: 5rem; max-height: calc(100vh - 6rem); overflow-y: auto; } /* Hide scrollbar but keep scroll */ .pg-single-sidebar::-webkit-scrollbar { width: 3px; } .pg-single-sidebar::-webkit-scrollbar-track { background: transparent; } .pg-single-sidebar::-webkit-scrollbar-thumb { background: var(--pg-border-strong); border-radius: 9999px; } } /* Table of Contents */ .pg-post-reactions { display: flex; align-items: center; flex-wrap: wrap; gap: .65rem; margin: 1.5rem 0; padding: 1rem; border: 1px solid var(--pg-border); border-radius: 1rem; background: var(--pg-surface, #fff); color: var(--pg-text); } .pg-post-reactions__label { margin-right: .35rem; font-weight: var(--pg-weight-strong,700); } .pg-post-reactions button { display: inline-flex; align-items: center; gap: .4rem; padding: .5rem .75rem; border: 1px solid var(--pg-border); border-radius: .7rem; background: var(--pg-surface-strong, #fff); color: var(--pg-text); font: inherit; font-weight: 700; cursor: pointer; } .pg-post-reactions button[aria-pressed="true"] { border-color: var(--pg-primary); background: var(--pg-primary-light); color: var(--pg-link); } .pg-post-reactions button:disabled { opacity: .6; cursor: wait; } .pg-post-reactions__status { flex-basis: 100%; font-size: .8rem; color: var(--pg-muted); } .pg-post-reactions__status:empty { display: none; } .pg-toc-widget { background: transparent; padding: 0 0 2rem 0; border: none; box-shadow: none; margin-bottom: 2rem; border-bottom: 1px dashed var(--pg-border-strong); } .pg-toc-header { display: flex; align-items: center; justify-content: space-between; gap: 0.75rem; margin-bottom: 1rem; } .pg-toc-title { font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.05em; margin: 0; color: var(--pg-muted); } .pg-toc-toggle { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; flex: 0 0 auto; border: 1px solid var(--pg-border); border-radius: 999px; background: var(--pg-surface-strong); color: var(--pg-text); transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease; } .pg-toc-toggle:hover { background: var(--pg-gradient); color: var(--pg-color-white, #fff); border-color: transparent; } .pg-toc-toggle svg { transition: transform 0.2s ease; } .pg-toc-body { display: grid; grid-template-rows: 1fr; overflow: hidden; transition: grid-template-rows 0.24s ease, opacity 0.2s ease; } .pg-toc-widget.is-collapsed .pg-toc-body { grid-template-rows: 0fr; opacity: 0; } .pg-toc-widget.is-collapsed .pg-toc-toggle svg { transform: rotate(-90deg); } .pg-toc-list { display: flex; flex-direction: column; list-style: none; padding: 0; margin: 0; border-left: 2px solid var(--pg-border); min-height: 0; } .pg-toc-item { position: relative; margin: 0; } .pg-toc-item a { display: block; padding: 0.5rem 1rem; font-size: 0.875rem; font-weight: 500; color: var(--pg-text); line-height: 1.4; text-decoration: none; border-left: 2px solid transparent; margin-left: -2px; transition: all 0.2s; } .pg-toc-item a:hover { color: var(--pg-link); background: var(--pg-bg-soft); } .pg-toc-item.is-active a { color: var(--pg-link); font-weight: 700; border-left-color: var(--pg-primary); background: color-mix(in srgb, var(--pg-primary) 5%, transparent); } .pg-toc-level-3 a { padding-left: 2rem; font-size: 0.8125rem; color: var(--pg-muted); } .pg-toc-level-4 a { padding-left: 2.75rem; font-size: 0.78rem; color: var(--pg-muted); } /* Related Posts Widget */ .pg-related-widget { background: var(--pg-surface-strong); padding: 1.5rem; border-radius: var(--pg-radius-2xl); border: 1px solid var(--pg-border); box-shadow: var(--pg-shadow-soft); } .pg-related-title { font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.08em; margin: 0 0 1.25rem 0; color: var(--pg-dark); display: flex; align-items: center; gap: 0.5rem; } .pg-related-title::before { content: ''; display: inline-block; width: 3px; height: 16px; background: var(--pg-accent); border-radius: 9999px; flex-shrink: 0; } .pg-related-list { display: flex; flex-direction: column; gap: 0.75rem; } .pg-related-card { display: flex; gap: 0.75rem; align-items: center; padding: 0.5rem; border-radius: 0.85rem; transition: background 0.2s, transform 0.2s; } .pg-related-card:hover { background: var(--pg-bg-soft); transform: translateX(2px); } .pg-related-thumb { width: 72px; height: 52px; flex-shrink: 0; border-radius: 0.65rem; overflow: hidden; background: var(--pg-bg-soft); } .pg-related-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; } .pg-related-post-title { font-size: 0.8125rem; font-weight: 700; line-height: 1.45; color: var(--pg-dark); display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; transition: color 0.2s; } .pg-related-card:hover .pg-related-post-title { color: var(--pg-link); } .pg-related-empty { font-size: 0.8125rem; color: var(--pg-muted); text-align: center; padding: 1rem 0; margin: 0; } /* ------------------------------------------------------- CAROUSEL SECTION - "Cรณ thแปƒ bแบกn bแป lแปก" ------------------------------------------------------- */ .pg-carousel-section { margin-top: 4rem; position: relative; } .pg-carousel-header { display: flex; align-items: center; justify-content: space-between; margin-bottom: 1.5rem; } .pg-carousel-title { font-size: 1.5rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0; } @media (min-width: 768px) { .pg-carousel-title { font-size: 1.75rem; } } /* Carousel horizontal scrolling track */ .pg-carousel-track { display: flex; gap: 1.25rem; overflow-x: auto; scroll-snap-type: x mandatory; -webkit-overflow-scrolling: touch; scroll-behavior: smooth; padding-bottom: 0.5rem; } .pg-carousel-track::-webkit-scrollbar { height: 4px; } .pg-carousel-track::-webkit-scrollbar-track { background: var(--pg-bg-soft); border-radius: 9999px; } .pg-carousel-track::-webkit-scrollbar-thumb { background: var(--pg-border-strong); border-radius: 9999px; } .pg-carousel-track::-webkit-scrollbar-thumb:hover { background: var(--pg-muted); } /* Carousel card */ .pg-carousel-card { flex: 0 0 280px; display: flex; flex-direction: column; background: var(--pg-surface-strong); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); overflow: hidden; scroll-snap-align: start; transition: all 0.25s ease; } @media (min-width: 640px) { .pg-carousel-card { flex: 0 0 300px; } } @media (min-width: 1024px) { .pg-carousel-card { flex: 0 0 320px; } } .pg-carousel-card:hover { border-color: var(--pg-primary-light); box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08); transform: translateY(-4px); } .pg-carousel-card__img-wrap { display: block; overflow: hidden; background: var(--pg-bg-soft); } .pg-carousel-card__img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform 0.5s ease; } .pg-carousel-card:hover .pg-carousel-card__img { transform: scale(1.06); } .pg-carousel-card__body { display: flex; flex-direction: column; gap: 0.5rem; padding: 1.25rem; flex: 1; } .pg-carousel-card__cat { align-self: flex-start; font-size: 0.65rem; margin: 0; } .pg-carousel-card__title { font-size: 0.9375rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); line-height: 1.4; margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .pg-carousel-card__title a { color: inherit; text-decoration: none; transition: color 0.2s; } .pg-carousel-card__title a:hover { color: var(--pg-link); } .pg-carousel-card__excerpt { font-size: 0.8125rem; line-height: 1.55; color: var(--pg-muted); margin: 0; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } /* Carousel nav buttons */ .pg-carousel-nav { display: flex; align-items: center; justify-content: center; gap: 0.75rem; margin-top: 1.5rem; } .pg-carousel-nav__btn { display: inline-flex; align-items: center; justify-content: center; width: 44px; height: 44px; border-radius: 50%; border: 1px solid var(--pg-border); background: var(--pg-surface-strong); color: var(--pg-text); cursor: pointer; transition: all 0.2s ease; box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06); } .pg-carousel-nav__btn:hover:not(:disabled) { border-color: var(--pg-primary-light); color: var(--pg-link); transform: scale(1.08); box-shadow: 0 4px 16px color-mix(in srgb, var(--pg-primary) 15%, transparent); } .pg-carousel-nav__btn:disabled { opacity: 0.35; cursor: not-allowed; } /* ------------------------------------------------------- MOBILE RESPONSIVE ------------------------------------------------------- */ @media (max-width: 767px) { .pg-single { padding-top: 1.25rem; padding-bottom: 2rem; } .pg-single-header { margin-bottom: 1.5rem; } .pg-single-excerpt { font-size: 1rem; margin-bottom: 1.5rem; } .pg-single-featured-img { border-radius: var(--pg-radius-xl); } .pg-carousel-section { margin-top: 2.5rem; } } /* ------------------------------------------------------- EVENTS ARCHIVE (CATEGORY-SU-KIEN) ------------------------------------------------------- */ .pg-events-archive { padding-top: 2.5rem; padding-bottom: 4rem; } .pg-events-wrapper { display: flex; flex-direction: column; gap: 3rem; } /* Event Tags */ .pg-event-meta-tags { display: flex; gap: 0.75rem; margin-bottom: 1rem; flex-wrap: wrap; } .pg-event-tag { padding: 0.25rem 0.75rem; border-radius: 9999px; font-weight: var(--pg-weight-strong,700); font-size: 0.75rem; text-transform: uppercase; } .pg-event-tag--status { background: var(--pg-primary-light); color: var(--pg-link); } .pg-event-tag--format { background: var(--pg-bg-soft); color: var(--pg-muted); } /* Featured Event */ .pg-featured-event { display: grid; grid-template-columns: 1fr; gap: 1.5rem; background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-2xl); overflow: hidden; box-shadow: var(--pg-shadow-soft); } @media (min-width: 1024px) { .pg-featured-event { grid-template-columns: 1.2fr 1fr; gap: 0; } } .pg-featured-event__image { aspect-ratio: 16/9; width: 100%; } @media (min-width: 1024px) { .pg-featured-event__image { aspect-ratio: auto; height: 100%; } } .pg-featured-event__image img { width: 100%; height: 100%; object-fit: cover; } .pg-featured-event__content { padding: 2rem; display: flex; flex-direction: column; justify-content: center; } .pg-featured-event__title { font-size: 1.75rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 1rem 0; line-height: 1.3; } .pg-featured-event__title a { color: inherit; text-decoration: none; transition: color 0.2s; } .pg-featured-event__title a:hover { color: var(--pg-link); } .pg-featured-event__excerpt { font-size: 1rem; color: var(--pg-muted); margin-bottom: 1.5rem; line-height: 1.6; } .pg-featured-event__actions { display: flex; gap: 1rem; margin-top: 1rem; flex-wrap: wrap; } /* Events Grid */ .pg-events-grid { display: grid; grid-template-columns: 1fr; gap: 2rem; } @media (min-width: 768px) { .pg-events-grid { grid-template-columns: repeat(2, 1fr); } } @media (min-width: 1024px) { .pg-events-grid { grid-template-columns: repeat(3, 1fr); } } .pg-event-card { display: flex; flex-direction: column; background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); overflow: hidden; box-shadow: var(--pg-shadow-soft); transition: transform 0.2s, box-shadow 0.2s; height: 100%; } .pg-event-card:hover { transform: translateY(-4px); box-shadow: 0 12px 32px rgba(15, 23, 42, 0.08); border-color: var(--pg-primary-light); } .pg-event-card__img { display: block; width: 100%; aspect-ratio: 16/9; background: var(--pg-bg-soft); overflow: hidden; } .pg-event-card__img img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; } .pg-event-card:hover .pg-event-card__img img { transform: scale(1.05); } .pg-event-card__body { padding: 1.5rem; display: flex; flex-direction: column; flex: 1; } .pg-event-card__title { font-size: 1.25rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0 0 1rem 0; line-height: 1.4; } .pg-event-card__title a { color: inherit; text-decoration: none; transition: color 0.2s; } .pg-event-card__title a:hover { color: var(--pg-link); } .pg-event-card__info { font-size: 0.875rem; color: var(--pg-muted); margin-bottom: 1.5rem; flex: 1; } .pg-event-card__info p { margin: 0 0 0.5rem 0; } .pg-event-card__info p:last-child { margin-bottom: 0; } .pg-event-card__info strong { color: var(--pg-text); } .pg-event-card__actions { display: flex; gap: 0.75rem; margin-top: auto; } .pg-btn-block { flex: 1; text-align: center; justify-content: center; padding: 0.6rem 1rem; } .pg-btn-disabled { background: var(--pg-bg-soft); color: var(--pg-muted); cursor: not-allowed; border: 1px solid var(--pg-border); } /* ========================================================================== SCROLL REVEAL & LAZY LOAD ANIMATIONS ========================================================================== */ /* Tr?nh gi?t layout */ .pg-reveal-pending { content-visibility: auto; contain-intrinsic-size: auto 300px; } @media (prefers-reduced-motion: no-preference) { /* Section Reveal Animation */ .pg-reveal-pending:not(.is-visible) { opacity: 0; transform: translateY(22px) scale(0.985); filter: blur(10px); } .pg-reveal-pending.is-visible { opacity: 1; transform: translateY(0) scale(1); filter: blur(0); transition: opacity 0.8s cubic-bezier(0.22, 1, 0.36, 1), transform 0.8s cubic-bezier(0.22, 1, 0.36, 1), filter 0.8s cubic-bezier(0.22, 1, 0.36, 1); will-change: transform, opacity, filter; } /* Lazy Load Image Animation */ img.pg-lazy-pending { opacity: 0; transform: scale(1.018); filter: blur(14px); } img.pg-lazy-pending.is-loaded { opacity: 1; transform: scale(1); filter: blur(0); transition: opacity 0.7s ease-out, transform 0.7s ease-out, filter 0.7s ease-out; will-change: transform, opacity, filter; } } /* MOBILE BOTTOM TAB BAR */ .pg-hide-desktop { display: none !important; } @media (max-width: 767px) { .pg-hide-desktop { display: flex !important; } body { padding-bottom: calc(86px + env(safe-area-inset-bottom)); } .pg-mobile-bottom-bar { position: fixed; bottom: 0; left: 0; right: 0; z-index: 100; background: rgba(255, 255, 255, 0.95); backdrop-filter: blur(12px); border-top: 1px solid var(--pg-border); box-shadow: 0 -4px 16px rgba(15, 23, 42, 0.05); padding-bottom: env(safe-area-inset-bottom); } .pg-bottom-bar__inner { display: flex; justify-content: space-around; align-items: center; height: 64px; padding: 0 0.5rem; width: 100%; } .pg-bottom-tab { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 0.25rem; color: var(--pg-muted); text-decoration: none; font-size: 0.625rem; font-weight: 700; flex: 1; transition: color 0.2s; } .pg-bottom-tab svg { width: 22px; height: 22px; } .pg-bottom-tab.is-active { color: var(--pg-link); } .pg-bottom-fab-wrapper { position: relative; display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: 100%; flex: 1.2; } .pg-bottom-fab { position: absolute; top: -24px; width: 56px; height: 56px; background: var(--pg-primary); color: #fff; border-radius: 50%; display: flex; align-items: center; justify-content: center; box-shadow: 0 8px 24px color-mix(in srgb, var(--pg-primary) 35%, transparent); transition: transform 0.2s, background 0.2s; } .pg-bottom-fab:hover { transform: scale(1.05); background: var(--pg-primary-deep); } .pg-bottom-fab svg { width: 24px; height: 24px; } .pg-bottom-fab-label { font-size: 0.625rem; font-weight: 700; color: var(--pg-muted); margin-bottom: 6px; } } /* โ•โ•โ• MOBILE HOMEPAGE LAYOUT (< 768px) โ•โ•โ• */ @media (max-width: 767px) { /* --- Section 1: Home Grid โ†’ 2 cแป™t (Sแปฑ kiแป‡n | Tรกc giแบฃ) --- */ .pg-home-grid { display: grid !important; grid-template-columns: 1fr 1fr !important; align-items: stretch; /* row-gap=5px tแบกo khoแบฃng cรกch Hero โ†’ 2 cแป™t; col-gap=5px tรกch 2 cแป™t */ gap: 5px 5px; margin-top: var(--pg-page-gutter); margin-bottom: var(--pg-page-gutter); /* Nแปn chung bแปc 2 cแป™t Sแปฑ kiแป‡n + Tรกc giแบฃ */ background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-2xl, 1.25rem); overflow: hidden; padding-bottom: 0.75rem; } /* Hero nแบฑm trรชn cรนng, nแปn trong suแป‘t, khรดng bo gรณc */ .pg-home-col--center { grid-column: 1 / -1; order: -1; background: transparent; border-radius: 0; margin: 0; } /* Sแปฑ kiแป‡n: cแป™t trรกi */ .pg-home-col--left { grid-column: 1 / 2; order: 1; } /* Tรกc giแบฃ: cแป™t phแบฃi */ .pg-home-col--right { grid-column: 2 / 3; order: 2; } /* Card trong suแป‘t โ€” nแปn lแบฅy tแปซ wrapper */ .pg-home-side-card { padding: 0.625rem 0.5rem; gap: 0.75rem; background: transparent; border: none; box-shadow: none; border-radius: 0; min-width: 0; } /* ฤฦฐแปng phรขn cรกch dแปc: border แปŸ bรชn phแบฃi cแป™t trรกi */ .pg-home-col--left .pg-home-side-card { border-right: 1px solid var(--pg-border); } .pg-side-header { gap: 0.35rem; padding-bottom: 0.6rem; border-bottom: 1px solid #d1d9e6; width: 100%; /* ร‰p cแบฃ 2 cแป™t cรนng chiแปu cao header โ†’ ฤ‘ฦฐแปng phรขn cรกch thแบณng hร ng */ min-height: 88px; justify-content: space-between; min-width: 0; } .pg-side-header__title { font-size: clamp(0.92rem, 4vw, 1rem); line-height: 1.2; } .pg-side-nav-row { flex-wrap: wrap; gap: 0.25rem; justify-content: center; } .pg-side-header__link { font-size: 0.625rem; padding: 0.15rem 0.5rem; } /* Compact event items */ .pg-event-item { display: flex; flex-direction: column; justify-content: center; padding: 0.625rem; border-radius: 0.75rem; min-height: 6.75rem; min-width: 0; } .pg-event-item__title { font-size: 0.8rem; margin-bottom: 0.25rem; overflow-wrap: anywhere; } .pg-event-item__meta { font-size: 0.65rem; overflow-wrap: anywhere; } /* Compact author items */ .pg-author-item { padding: 0.5rem; gap: 0.5rem; border-radius: 0.75rem; min-height: 6.75rem; min-width: 0; } .pg-author-avatar { width: 36px; height: 36px; border-radius: 0.625rem; flex: 0 0 36px; } .pg-author-name { font-size: 0.75rem; } .pg-author-role { font-size: 0.625rem; line-height: 1.25; margin-bottom: 0.35rem; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; } .pg-author-stats { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.25rem; } .pg-author-stat { min-width: 0; padding: 0.15rem 0.3rem; font-size: 0.6rem; text-align: center; overflow-wrap: anywhere; } /* Cฤƒn giแปฏa tiรชu ฤ‘แป trรชn mobile */ .pg-side-header { align-items: center; text-align: center; } .pg-home-col--left, .pg-home-col--right { min-width: 0; } /* Cฤƒn giแปฏa danh mแปฅc cแปงa cรกc thแบป bร i viแบฟt/khแป‘i trรชn mobile */ .pg-news-card__cat { align-self: center; } .pg-highlight-cat { text-align: center; display: block; } /* ฤฦฐแปng phรขn cรกch dฦฐแป›i tiรชu ฤ‘แป Newsroom (Section 2) */ .pg-newsroom__header { padding-bottom: 0.75rem; border-bottom: 1px solid var(--pg-border); margin-bottom: 1.25rem; } /* --- Section 2: Newsroom Bร i viแบฟt โ†’ 2 cแป™t card --- */ .pg-newsroom { margin-top: var(--pg-page-gutter); margin-bottom: var(--pg-page-gutter); padding: 1rem var(--pg-page-gutter); border-radius: var(--pg-radius-2xl); } .pg-newsroom__grid { grid-template-columns: repeat(2, 1fr) !important; gap: 0.75rem; } .pg-newsroom__title { font-size: 1.15rem; } /* Thu gแปn thumbnail bร i viแบฟt */ .pg-news-card__img { height: auto; } .pg-news-card__body { padding: 0.5rem 0.625rem; } .pg-news-card__title { font-size: 0.8rem; -webkit-line-clamp: 2; } .pg-news-card__excerpt { display: none; } .pg-news-card__footer { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; justify-content: stretch; gap: 0.45rem; padding: 0 0.625rem 0.625rem; } .pg-news-card__author { width: 100%; max-width: 100%; min-width: 0; } .pg-news-card__author-img { width: 26px; height: 26px; } .pg-news-card__author-name { font-size: 0.7rem; min-width: 0; max-width: 100%; } .pg-news-card__meta { font-size: 0.6rem; width: 100%; min-width: 0; flex-shrink: 1; justify-content: space-between; gap: 0.35rem; overflow: hidden; } .pg-news-card__meta-item { min-width: 0; gap: 0.18rem; white-space: nowrap; } .pg-news-card__meta-icon { width: 11px; height: 11px; flex: 0 0 auto; } } @media (max-width: 389px) { .pg-home-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 0; padding-bottom: 0; } .pg-home-col--left, .pg-home-col--right { grid-column: 1 / -1; } .pg-home-col--right { border-top: 1px solid var(--pg-border); } .pg-home-col--left .pg-home-side-card { border-right: 0; } .pg-home-side-card { padding: 0.875rem; gap: 0.75rem; } .pg-side-header { min-height: 0; align-items: stretch; text-align: left; display: grid; grid-template-columns: minmax(0, 1fr) auto; column-gap: 0.75rem; row-gap: 0.5rem; } .pg-side-nav-row { width: auto; justify-content: flex-end; align-self: center; } .pg-side-header__link { display: none; } .pg-side-content { display: grid; grid-template-columns: minmax(0, 1fr); } .pg-event-item, .pg-author-item { min-height: 0; } } @media (max-width: 380px) { .pg-newsroom { padding: 0.75rem; } .pg-newsroom__grid { gap: 0.6rem; } .pg-news-card__body { padding: 0.5rem; } .pg-news-card__footer { padding: 0 0.5rem 0.55rem; gap: 0.4rem; } .pg-news-card__author { gap: 0.35rem; } .pg-news-card__author-name { display: none; } .pg-news-card__meta { font-size: 0.58rem; } } /* UI hardening: horizontal tab rows must scroll, not squeeze labels into clipped pills. */ .pg-newsroom__tabs, .pg-hub-tabs, .pg-category-tabs, .pg-filter-tabs, .pg-tabs { min-width: 0; overscroll-behavior-inline: contain; scroll-padding-inline: 1rem; } .pg-newsroom__tabs > .pg-newsroom-tab, .pg-hub-tabs > .pg-hub-tab-btn, .pg-category-tabs > *, .pg-filter-tabs > *, .pg-tabs > * { flex: 0 0 auto !important; min-width: max-content; max-width: min(84vw, 22rem); } .pg-newsroom-tab, .pg-hub-tab-btn { overflow-wrap: normal; word-break: normal; } .pg-news-card, .pg-service-card, .pg-related-card, .pg-carousel-card { min-width: 0; } .pg-news-card__title, .pg-service-card__title, .pg-related-post-title, .pg-carousel-card__title, .pg-news-card__excerpt, .pg-service-card__excerpt, .pg-carousel-card__excerpt { overflow-wrap: anywhere; } /* ========================================================================== SECTION: Premium Celestial Round Logo Loading Modal (Interface & Effects) ========================================================================== */ .pg-auth-modal { position: fixed; inset: 0; display: flex; align-items: center; justify-content: center; z-index: 99999; opacity: 0; pointer-events: none; transition: opacity 0.4s ease; /* Core variables scaled from the cosmic page loader */ --pg-loader-cycle: 1.2s; --pg-loader-fast: 0.72s; --pg-loader-mid: 0.96s; --pg-loader-slow: 1.44s; --pg-loader-glow-a: color-mix(in srgb, var(--pg-primary) 20%, transparent); --pg-loader-glow-b: color-mix(in srgb, var(--pg-secondary) 18%, transparent); --pg-loader-base: color-mix(in srgb, var(--pg-bg, #ffffff) 92%, var(--pg-surface-strong, #fff)); --pg-loader-veil: color-mix(in srgb, var(--pg-loader-base) 72%, transparent); } body.pg-theme-dark .pg-auth-modal { --pg-loader-base: color-mix(in srgb, var(--pg-bg, #020617) 88%, #000); --pg-loader-glow-a: color-mix(in srgb, var(--pg-primary) 26%, transparent); --pg-loader-glow-b: color-mix(in srgb, var(--pg-secondary) 24%, transparent); --pg-loader-veil: color-mix(in srgb, var(--pg-loader-base) 62%, transparent); } .pg-auth-modal-backdrop { position: absolute; inset: 0; background: color-mix(in srgb, var(--pg-bg, #ffffff) 70%, transparent); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); } .pg-auth-modal-card { position: relative; width: 90%; max-width: 360px; background: var(--pg-surface, #ffffff); border: 1px solid var(--pg-border, rgba(0,0,0,0.1)); border-radius: 1.5rem; padding: 2.25rem 1.75rem; box-shadow: 0 25px 50px -12px rgba(0, 0, 0, 0.15); display: flex; flex-direction: column; align-items: center; text-align: center; z-index: 1; transform: scale(0.92); transition: transform 0.4s cubic-bezier(0.34, 1.56, 0.64, 1); overflow: hidden; /* Contain floating cosmic backgrounds securely */ } .pg-auth-modal.active { opacity: 1; pointer-events: auto; } .pg-auth-modal.active .pg-auth-modal-card { transform: scale(1); } /* Cosmic Page Loader Adapter Styles (scaled to 110px) */ .pg-loader-core { position: relative; width: 110px; height: 110px; display: flex; align-items: center; justify-content: center; margin-bottom: 1.75rem; z-index: 2; --pg-loader-fast: 0.72s; --pg-loader-mid: 0.96s; --pg-loader-slow: 1.44s; } /* Yin-Yang & Iris Floating background glow effect inside the modal card */ .pg-auth-modal .pg-loader-core::before { content: ""; position: absolute; width: 220px; height: 220px; border-radius: 50%; background: radial-gradient(circle at 50% 25%, var(--pg-loader-glow-a) 0 5%, transparent 17%), radial-gradient(circle at 50% 75%, var(--pg-loader-glow-b) 0 5%, transparent 17%), conic-gradient(from 0deg, var(--pg-loader-glow-a) 0deg 72deg, transparent 72deg 180deg, var(--pg-loader-glow-b) 180deg 252deg, transparent 252deg 360deg); top: 50%; left: 50%; transform: translate(-50%, -50%) rotate(0deg) scale(0.82); filter: blur(8px) saturate(1.25); opacity: 0.88; mix-blend-mode: multiply; animation: pg-loader-yinyang var(--pg-loader-cycle) cubic-bezier(0.45, 0, 0.2, 1) infinite; pointer-events: none; z-index: -2; } body.pg-theme-dark .pg-auth-modal .pg-loader-core::before { mix-blend-mode: screen; opacity: 0.72; } .pg-auth-modal .pg-loader-core::after { content: ""; position: absolute; width: 170px; height: 170px; border-radius: 50%; top: 50%; left: 50%; pointer-events: none; background: radial-gradient(circle at 50% 50%, transparent 0 15%, var(--pg-loader-veil) 34%, var(--pg-loader-base) 62%), conic-gradient(from 180deg at 50% 50%, transparent 0 130deg, color-mix(in srgb, var(--pg-loader-base) 86%, transparent) 130deg 230deg, transparent 230deg 360deg); transform: translate(-50%, -50%) rotate(0deg) scale(1); opacity: 0.58; animation: pg-loader-iris var(--pg-loader-mid) ease-in-out infinite; z-index: -1; } /* Premium Celestial Logo Container Button */ .pg-loader-logo-button { position: absolute; z-index: 4; width: 48px; height: 48px; border-radius: 50%; top: calc(50% - 24px); left: calc(50% - 24px); display: grid; place-items: center; background: color-mix(in srgb, var(--pg-surface-strong, #fff) 34%, transparent); border: 1.5px solid color-mix(in srgb, var(--pg-primary) 22%, transparent); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); animation: pg-logo-pulse 2s ease-in-out infinite; } body.pg-theme-dark .pg-loader-logo-button { background: color-mix(in srgb, var(--pg-bg, #020617) 55%, transparent); animation: pg-logo-pulse-dark 2s ease-in-out infinite; } .pg-loader-ring, .pg-loader-orbit { position: absolute; border-radius: 50%; will-change: transform; } .pg-loader-ring.outer { inset: -10px; background: conic-gradient(from 0deg, var(--pg-primary), color-mix(in srgb, var(--pg-primary) 50%, transparent) 12%, color-mix(in srgb, var(--pg-primary) 6%, transparent) 35%, transparent 100%); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px)); mask: radial-gradient(farthest-side, transparent calc(100% - 2.5px), #000 calc(100% - 2px)); filter: drop-shadow(0 0 6px color-mix(in srgb, var(--pg-primary) 35%, transparent)); } .pg-loader-ring.middle { inset: 6px; background: conic-gradient(from 200deg, var(--pg-secondary), color-mix(in srgb, var(--pg-secondary) 40%, transparent) 14%, color-mix(in srgb, var(--pg-secondary) 5%, transparent) 38%, transparent 100%); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px)); mask: radial-gradient(farthest-side, transparent calc(100% - 2px), #000 calc(100% - 1.5px)); filter: drop-shadow(0 0 5px color-mix(in srgb, var(--pg-secondary) 30%, transparent)); } .pg-loader-ring.inner { inset: 18px; background: conic-gradient(from 120deg, var(--pg-primary), color-mix(in srgb, var(--pg-primary) 30%, transparent) 10%, color-mix(in srgb, var(--pg-primary) 4%, transparent) 28%, transparent 100%); -webkit-mask: radial-gradient(farthest-side, transparent calc(100% - 1.5px), #000 calc(100% - 1px)); mask: radial-gradient(farthest-side, transparent calc(100% - 1.5px), #000 calc(100% - 1px)); filter: drop-shadow(0 0 4px color-mix(in srgb, var(--pg-primary) 25%, transparent)); } .pg-loader-orbit.orbit-1 { inset: -16px; } .pg-loader-orbit.orbit-1::before { content: ""; position: absolute; top: -3px; left: 50%; transform: translateX(-50%); width: 6px; height: 6px; background: var(--pg-primary); border-radius: 50%; box-shadow: 0 0 10px 3px color-mix(in srgb, var(--pg-primary) 60%, transparent), 0 0 20px 5px color-mix(in srgb, var(--pg-primary) 20%, transparent); } .pg-loader-orbit.orbit-2 { inset: 0px; } .pg-loader-orbit.orbit-2::before { content: ""; position: absolute; bottom: -3px; left: 50%; transform: translateX(-50%); width: 6px; height: 6px; background: var(--pg-secondary); border-radius: 50%; box-shadow: 0 0 10px 3px color-mix(in srgb, var(--pg-secondary) 60%, transparent), 0 0 20px 5px color-mix(in srgb, var(--pg-secondary) 20%, transparent); } .pg-loader-ring.outer { animation: pg-spin var(--pg-loader-mid, 0.96s) linear infinite; } .pg-loader-ring.middle { animation: pg-spin-reverse var(--pg-loader-fast, 0.72s) linear infinite; } .pg-loader-ring.inner { animation: pg-spin calc(var(--pg-loader-fast, 0.72s) * 0.76) linear infinite; } .pg-loader-orbit.orbit-1 { animation: pg-spin var(--pg-loader-slow, 1.44s) linear infinite; } .pg-loader-orbit.orbit-2 { animation: pg-spin-reverse calc(var(--pg-loader-slow, 1.44s) * 1.12) linear infinite; } /* Dynamic 3D Breathe Wobble Animation for Image Logos */ .pg-loader-logo { width: 34px; height: 34px; border-radius: 50%; object-fit: cover; background: transparent; display: block; transform-origin: center !important; will-change: transform, filter; animation: pg-logo-image-breathe 4s ease-in-out infinite !important; } /* Browser-Proof 360-degree Celestial Spin & Glow for SVG Fallbacks (Fixes browser scaling lock) */ .pg-loader-logo-fallback { width: 28px; height: 28px; color: var(--pg-text, #0f172a); display: block; transform-origin: center !important; transform-box: fill-box !important; will-change: transform, filter; animation: pg-logo-fallback-cosmic 6s ease-in-out infinite !important; } .pg-progress-meta { display: flex; justify-content: space-between; width: 100%; margin-bottom: 0.5rem; font-size: 0.75rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-muted, rgba(0,0,0,0.6)); text-transform: uppercase; letter-spacing: 0.05em; } .pg-progress-value { font-variant-numeric: tabular-nums; color: var(--pg-link); } .pg-progress-track { width: 100%; height: 6px; background: var(--pg-bg-soft, rgba(0,0,0,0.05)); border-radius: 9999px; margin-bottom: 1.25rem; overflow: hidden; border: 1px solid var(--pg-border, rgba(0,0,0,0.1)); } .pg-progress-bar { height: 100%; width: 0%; background: var(--pg-gradient, linear-gradient(135deg, var(--pg-primary) 0%, var(--pg-secondary) 100%)); border-radius: 9999px; transition: width 0.2s ease-out; } .pg-auth-modal-text { font-size: 0.875rem; font-weight: 600; color: var(--pg-text, #000000); line-height: 1.6; margin: 0; min-height: 2.4em; display: flex; align-items: center; justify-content: center; } /* Cosmic Animation Keyframes */ @keyframes pg-spin { 0% { transform: rotate(0deg); } 100% { transform: rotate(360deg); } } @keyframes pg-spin-reverse { 0% { transform: rotate(0deg); } 100% { transform: rotate(-360deg); } } /* Light Mode Border and Shadow Pulse */ @keyframes pg-logo-pulse { 0%, 100% { border-color: color-mix(in srgb, var(--pg-primary) 26%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 42%, transparent), 0 0 14px color-mix(in srgb, var(--pg-primary) 20%, transparent); } 50% { border-color: color-mix(in srgb, var(--pg-secondary) 50%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 55%, transparent), 0 0 24px color-mix(in srgb, var(--pg-secondary) 45%, transparent); } } /* Dark Mode Border and Shadow Pulse */ @keyframes pg-logo-pulse-dark { 0%, 100% { border-color: color-mix(in srgb, var(--pg-primary) 36%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 15%, transparent), 0 0 16px color-mix(in srgb, var(--pg-primary) 30%, transparent); } 50% { border-color: color-mix(in srgb, var(--pg-secondary) 65%, transparent); box-shadow: inset 0 0 0 1px color-mix(in srgb, #fff 25%, transparent), 0 0 26px color-mix(in srgb, var(--pg-secondary) 55%, transparent); } } /* Dynamic Wobble Breathe for Image Logos */ @keyframes pg-logo-image-breathe { 0%, 100% { transform: scale(1) rotate(0deg); filter: drop-shadow(0 0 4px color-mix(in srgb, var(--pg-primary) 20%, transparent)); } 50% { transform: scale(1.08) rotate(4deg); filter: drop-shadow(0 0 12px color-mix(in srgb, var(--pg-primary) 50%, transparent)) drop-shadow(0 0 6px color-mix(in srgb, var(--pg-secondary) 30%, transparent)); } } /* Cosmic Spin, Glow, and Breathe for SVG Fallbacks (Guarantees browser renders the transformations) */ @keyframes pg-logo-fallback-cosmic { 0% { transform: rotate(0deg) scale(1); filter: drop-shadow(0 0 4px color-mix(in srgb, var(--pg-primary) 25%, transparent)); } 50% { transform: rotate(180deg) scale(1.22); filter: drop-shadow(0 0 14px color-mix(in srgb, var(--pg-primary) 60%, transparent)) drop-shadow(0 0 4px color-mix(in srgb, var(--pg-secondary) 40%, transparent)); } 100% { transform: rotate(360deg) scale(1); filter: drop-shadow(0 0 4px color-mix(in srgb, var(--pg-primary) 25%, transparent)); } } /* Yin-Yang Clipping Nebula Morph Keyframes */ @keyframes pg-loader-yinyang { 0% { transform: translate(-50%, -50%) rotate(0deg) scale(0.78); clip-path: circle(24% at 50% 50%); } 28% { transform: translate(-50%, -50%) rotate(120deg) scale(0.92); clip-path: circle(58% at 50% 50%); } 58% { transform: translate(-50%, -50%) rotate(250deg) scale(1.04); clip-path: circle(72% at 50% 50%); } 100% { transform: translate(-50%, -50%) rotate(360deg) scale(0.78); clip-path: circle(24% at 50% 50%); } } /* Iris Pulsing Nebula Keyframes */ @keyframes pg-loader-iris { 0%, 100% { transform: translate(-50%, -50%) rotate(0deg) scale(1.06); opacity: 0.68; } 45% { transform: translate(-50%, -50%) rotate(-145deg) scale(0.94); opacity: 0.42; } 70% { transform: translate(-50%, -50%) rotate(-230deg) scale(1.01); opacity: 0.56; } } /* Performance cleanup: avoid scroll-time repaint-heavy effects. */ html, body, body.pg-theme-dark { background-attachment: scroll, scroll, scroll !important; } .pg-site-header, .pg-site-header__inner, .pg-sub-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-overlay, .pg-sidebar-drawer, .pg-site-footer__overlay, .pg-popup-overlay, .pg-newsroom, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-highlight-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-card, .pg-card-strong, .pg-home-side-card { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } .pg-soft-reveal { animation: none !important; filter: none !important; } @media (max-width: 767px) { .pg-reveal, .pg-reveal.is-visible, .pg-reveal-pending, .pg-reveal-pending.is-visible, img.pg-lazy, img.pg-lazy.is-loaded, img.pg-lazy-pending, img.pg-lazy-pending.is-loaded { opacity: 1 !important; transform: none !important; filter: none !important; transition: none !important; } } /* Mobile interaction budget: taps must be handed to controls immediately. * This also prevents a double-tap gesture from delaying a normal navigation * click in older mobile WebViews. */ @media (max-width: 767px) { html { scroll-behavior: auto; } a, button, input, select, textarea, [role="button"] { touch-action: manipulation; } } /* Keep below-the-fold content out of the first paint. Its DOM remains * accessible to crawlers and assistive tech; the browser simply delays its * layout and paint work until the reader gets near it. */ @supports (content-visibility: auto) { .pg-newsroom, .pg-home-media, .pg-services-section, .pg-knowledge-grid > .pg-card-post, .pg-events-list > .pg-event-card, .pg-search-results > .pg-search-card { content-visibility: auto; contain-intrinsic-size: auto 44rem; } @media (max-width: 767px) { .pg-newsroom, .pg-home-media, .pg-services-section { contain-intrinsic-size: auto 56rem; } } } /* Quiet page canvas: no logo, stars, fixed layers or full-page animation. Local card decoration, hover states and functional loading feedback remain. */ @layer psyguild-clean-page { html body.wp-theme-psyguild-theme { background-color:var(--pg-bg)!important; background-image:none!important; background-attachment:scroll!important; } html::before,html::after,html body.wp-theme-psyguild-theme::before,html body.wp-theme-psyguild-theme::after { content:none!important;display:none!important;animation:none!important; } html body.wp-theme-psyguild-theme .pg-logo-watermark-bg {display:none!important} } /* PsyGuild source: reader-audio.css */ .reader-audio-controls { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; margin: 14px 0 0; } .reader-audio-btn { display: inline-flex; align-items: center; justify-content: center; gap: 8px; min-height: 42px; padding: 10px 16px; border-radius: 999px; border: 1px solid rgba(18, 199, 244, 0.22); background: linear-gradient(135deg, rgba(18, 199, 244, 0.1), color-mix(in srgb, var(--pg-secondary) 10%, transparent)); color: #111827; font-family: var(--pg-font-body, var(--font-system, system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif)); font-size: 0.875rem; font-weight: 800; line-height: 1; cursor: pointer; transition: transform 0.18s ease, box-shadow 0.18s ease, border-color 0.18s ease, background 0.18s ease; } .reader-audio-btn:hover:not(:disabled) { transform: translateY(-1px); border-color: rgba(18, 199, 244, 0.42); box-shadow: 0 12px 28px rgba(15, 23, 42, 0.1); } .reader-audio-btn.is-playing, .reader-audio-btn.is-paused { background: linear-gradient(135deg, #12c7f4, var(--pg-secondary)); color: #fff; border-color: transparent; } .reader-audio-btn:disabled, .reader-audio-btn.is-disabled { cursor: not-allowed; opacity: 0.48; transform: none; box-shadow: none; } .reader-audio-btn--stop { min-width: 92px; background: rgba(255, 255, 255, 0.72); color: #374151; } body.pg-theme-dark .reader-audio-btn { border-color: rgba(18, 199, 244, 0.30); background: linear-gradient(135deg, rgba(18, 199, 244, 0.14), color-mix(in srgb, var(--pg-secondary) 14%, transparent)); color: var(--pg-text, #ffffff); } body.pg-theme-dark .reader-audio-btn:hover:not(:disabled) { box-shadow: 0 12px 28px rgba(0, 0, 0, 0.26); } body.pg-theme-dark .reader-audio-btn--stop { background: rgba(255, 255, 255, 0.08); color: var(--pg-muted, rgba(255, 255, 255, 0.74)); } .reader-audio-btn__icon { display: inline-flex; align-items: center; justify-content: center; min-width: 1.15em; font-style: normal; } .reader-audio-controls--single { justify-content: center; } .pg-audio-language-label { display: inline-flex; align-items: center; gap: .45rem; font-size: .8rem; font-weight: 700; color: var(--pg-text); } .pg-audio-language-label select { max-width: 100%; padding: .45rem .55rem; border: 1px solid var(--pg-border); border-radius: .6rem; background: var(--pg-surface-strong, #fff); color: var(--pg-text); font: inherit; } .pg-book-mobile-left-panel .pg-audio-language-label { padding: .5rem; grid-column: 1 / -1; justify-content: center; } .reader-audio-controls--book { width: 100%; margin-top: 0; } .reader-audio-controls--book .reader-audio-btn { flex: 1 1 auto; min-width: 0; font-size: 0.8rem; } .reader-audio-mobile-stop { opacity: 0.92; } .pg-book-mobile-left-btn:disabled { cursor: not-allowed; opacity: 0.5; } .pg-book-mobile-left-btn.is-playing, .pg-book-mobile-left-btn.is-paused { background: linear-gradient(135deg, rgba(18, 199, 244, 0.18), color-mix(in srgb, var(--pg-secondary) 18%, transparent)); border-color: rgba(18, 199, 244, 0.34); } /* This stylesheet is loaded by both the scrolling article and book reader. * The selection control must not depend on book-reader.css being present. */ .pg-book-selection-audio { position: fixed; z-index: 2147483000; display: inline-flex; align-items: center; gap: 0.45rem; width: max-content; max-width: calc(100vw - 16px); transform: translateX(-50%); padding: 0.52rem 0.72rem; border: 1px solid rgba(18, 199, 243, 0.55); border-radius: 999px; background: linear-gradient(135deg, #00bff3, #357df6); box-shadow: 0 10px 24px rgba(15, 94, 160, 0.28); color: #fff; font: 700 0.82rem/1.2 var(--pg-font-body, system-ui, sans-serif); cursor: pointer; touch-action: manipulation; } .pg-book-selection-audio[hidden] { display: none !important; } .pg-book-selection-audio:hover, .pg-book-selection-audio:focus-visible { filter: brightness(1.08); outline: 3px solid rgba(17, 199, 243, 0.25); outline-offset: 2px; } body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content, body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content *, .pg-book-layout-wrapper .pg-book-page-content, .pg-book-layout-wrapper .pg-book-page-content * { user-select: text; -webkit-user-select: text; } body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content a[href], .pg-book-layout-wrapper .pg-book-page-content a[href] { pointer-events: auto; cursor: pointer; } .read-sentence { border-radius: 0.38em; box-decoration-break: clone; -webkit-box-decoration-break: clone; cursor: pointer; padding: 0.02em 0.08em; margin: 0 -0.08em; transition: background-color 0.18s ease, box-shadow 0.18s ease, color 0.18s ease; } .read-sentence:hover, .read-sentence:focus-visible { background: rgba(18, 199, 244, 0.10); outline: none; } .read-sentence.is-reading { background: linear-gradient(135deg, rgba(18, 199, 244, 0.20), color-mix(in srgb, var(--pg-secondary) 18%, transparent)); box-shadow: 0 0 0 3px rgba(18, 199, 244, 0.07); color: inherit; } body.pg-theme-dark .read-sentence.is-reading, .pg-book-layout-wrapper.book-theme-dark .read-sentence.is-reading, .pg-book-layout-wrapper.book-theme-night .read-sentence.is-reading { background: linear-gradient(135deg, rgba(18, 199, 244, 0.24), color-mix(in srgb, var(--pg-secondary) 22%, transparent)); box-shadow: 0 0 0 3px rgba(18, 199, 244, 0.12); } @media (max-width: 640px) { .reader-audio-controls--single { justify-content: flex-start; } .reader-audio-btn { width: 100%; } .reader-audio-btn--stop { width: auto; min-width: 104px; } } @media print { .reader-audio-controls, [data-audio-action] { display: none !important; } .read-sentence, .read-sentence.is-reading { background: transparent !important; box-shadow: none !important; padding: 0 !important; margin: 0 !important; } } /* PsyGuild source: single.css */ /* ========================================================================== BLOG SINGLE POST STYLES ========================================================================== */ .pg-single { padding-top: 2rem; padding-bottom: 0; overflow-x: clip; } body.single-post .pg-site-footer { margin-top: var(--pg-page-gutter) !important; } /* HEADER */ .pg-single-header { margin-bottom: 2.5rem; text-align: left; min-width: 0; } .pg-single-header-inner { width: 100%; min-width: 0; } .pg-single-title { font-size: 2.5rem; font-weight: var(--pg-weight-strong,700); line-height: 1.2; color: var(--pg-dark); margin: 0 0 1rem 0; max-width: 100%; overflow-wrap: anywhere; word-break: normal; hyphens: auto; } @media (max-width: 1024px) { .pg-single-title { font-size: clamp(1.55rem, 7vw, 1.95rem); line-height: 1.18; } } .pg-single-meta-row { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .65rem 1rem; padding: .7rem .9rem; margin-bottom: 1rem; font-size: 0.875rem; color: var(--pg-muted); max-width: 100%; min-width: 0; border: 1px solid color-mix(in srgb, var(--pg-primary) 16%, var(--pg-border)); border-radius: 1rem; background: linear-gradient(135deg, color-mix(in srgb, var(--pg-primary-light) 56%, transparent), color-mix(in srgb, #fff 86%, transparent)); box-shadow: 0 .6rem 1.5rem rgba(15, 23, 42, .05); } .pg-single-cat { background: var(--pg-primary-light); color: var(--pg-dark); padding: 0.25rem 0.75rem; border-radius: 9999px; font-weight: 700; font-size: 0.75rem; text-transform: uppercase; text-decoration: none; } body.single-psyguild_service .pg-single-cat { background: transparent; border: 0; box-shadow: none; outline: 0; padding: 0; border-radius: 0; } body.single-psyguild_service a.pg-single-cat:hover, body.single-psyguild_service a.pg-single-cat:focus, body.single-psyguild_service a.pg-single-cat:focus-visible { background: transparent; border: 0; box-shadow: none; outline: 0; color: var(--pg-link); } .pg-single-author-inline { display: inline-flex; align-items: center; font-weight: 700; color: var(--pg-dark); text-decoration: none; min-width: 0; max-width: 100%; } .pg-single-meta-row > * { min-width: 0; } .pg-single-author-name { min-width: 0; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .reader-audio-controls--single { max-width: 100%; min-width: 0; } .reader-audio-controls--single .reader-audio-btn { min-width: 0; } .pg-single-reader-actions { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: .65rem; padding: .65rem; margin-bottom: 1.25rem; border: 1px solid color-mix(in srgb, var(--pg-primary) 16%, var(--pg-border)); border-radius: 1rem; background: color-mix(in srgb, #fff 86%, var(--pg-primary-light)); box-shadow: 0 .75rem 1.75rem rgba(15, 23, 42, .06); } .pg-single-reader-actions .reader-audio-controls--single { margin: 0; } .pg-single-print-btn { display: inline-flex; align-items: center; justify-content: center; gap: .55rem; min-height: 2.8rem; padding: .5rem .9rem; border: 1px solid var(--pg-border); border-radius: .7rem; background: var(--pg-surface-strong); color: var(--pg-link); font: inherit; font-size: .82rem; font-weight: var(--pg-weight-strong,700); cursor: pointer; } .pg-single-reader-actions .reader-audio-btn, .pg-single-reader-actions .pg-single-print-btn { min-height: 2.8rem; border-radius: .82rem; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .72); } .pg-single-action-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.85rem; height: 1.85rem; flex: 0 0 1.85rem; border: 1px solid color-mix(in srgb, currentColor 20%, transparent); border-radius: .58rem; background: color-mix(in srgb, currentColor 8%, transparent); } .pg-single-action-icon svg { width: 1.05rem; height: 1.05rem; } .pg-single-reader-actions .reader-audio-btn.is-playing .pg-single-action-icon, .pg-single-reader-actions .reader-audio-btn.is-paused .pg-single-action-icon { background: rgba(255, 255, 255, .2); border-color: rgba(255, 255, 255, .35); } .pg-single-print-btn:hover, .pg-single-print-btn:focus-visible { border-color: var(--pg-primary); background: var(--pg-primary-light); outline: none; } .pg-article-share { position: relative; display: inline-flex; } .pg-article-share-toggle { white-space: nowrap; } .pg-article-share-menu { position: absolute; z-index: 30; top: calc(100% + .45rem); right: 0; display: grid; min-width: 11.5rem; padding: .4rem; border: 1px solid var(--pg-border); border-radius: .7rem; background: var(--pg-surface, #fff); box-shadow: 0 .75rem 1.8rem rgba(15, 23, 42, .16); } /* The component starts with the HTML `hidden` attribute. The layout rule above must never override that state before its toggle is pressed. */ .pg-article-share-menu[hidden] { display: none !important; } body > .pg-article-share-menu--portal { position: fixed; z-index: 1300; right: auto; width: min(13rem, calc(100vw - 1.5rem)); max-height: calc(100dvh - 1.5rem); overflow-y: auto; } .pg-article-share-menu a, .pg-article-share-menu button { display: flex; align-items: center; width: 100%; min-height: 2.2rem; padding: .45rem .6rem; border: 0; border-radius: .45rem; background: transparent; color: var(--pg-text); font: inherit; font-size: .82rem; font-weight: 700; text-align: left; text-decoration: none; cursor: pointer; } .pg-article-share-menu a:hover, .pg-article-share-menu a:focus-visible, .pg-article-share-menu button:hover, .pg-article-share-menu button:focus-visible { background: var(--pg-primary-light); color: var(--pg-link); outline: none; } .pg-single-coauthors { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; margin: -0.75rem 0 1.5rem; color: var(--pg-muted); font-size: 0.875rem; line-height: 1.5; } .pg-single-coauthors span { color: var(--pg-dark); font-weight: var(--pg-weight-strong,700); } .pg-single-coauthors a { color: var(--pg-link); font-weight: var(--pg-weight-strong,700); text-decoration: none; overflow-wrap: anywhere; } .pg-single-read-time { display: inline-flex; align-items: center; font-weight: 600; color: var(--pg-muted); } .pg-single-excerpt { font-size: 1.125rem; line-height: 1.6; color: var(--pg-muted); max-width: 800px; margin-bottom: 2rem; } .pg-single-featured-img { width: 100%; max-width: 100%; margin: 0; aspect-ratio: 16 / 9; border-radius: 2rem; overflow: hidden; background: var(--pg-bg-soft); } .pg-single-featured-img img { width: 100%; height: 100%; object-fit: cover; display: block; } @media (max-width: 1024px) { .pg-single-featured-img { border-radius: 1.25rem; } } /* GRID LAYOUT */ .pg-single-grid { display: grid; gap: 2.5rem; align-items: start; min-width: 0; } @media (min-width: 1024px) { .pg-single-grid { grid-template-columns: 70% 25%; justify-content: space-between; gap: 5%; } } /* CONTENT COLUMN */ .pg-entry-content { font-size: 1.125rem; line-height: 1.75; color: var(--pg-text); width: 100%; max-width: 100%; min-width: 0; background: transparent; padding: 0; box-shadow: none; border: none; overflow-wrap: break-word; word-break: normal; } /* Keep the site's blue backdrop while giving the editorial text its own calm, paper-like reading surface. */ body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content { background: linear-gradient(145deg, #fffdf8 0%, #fff9ee 100%); border: 1px solid #eee1cd; border-radius: 1.5rem; padding: clamp(1.5rem, 3vw, 2.75rem); box-shadow: 0 18px 48px rgba(107, 78, 35, 0.08); } .pg-entry-content h2, .pg-entry-content h3, .pg-entry-content h4 { color: var(--pg-dark); font-weight: var(--pg-weight-strong,700); margin-top: 2.5rem; margin-bottom: 1rem; scroll-margin-top: calc(80px + 24px); /* Prevent header overlap */ } .pg-entry-content h2 { font-size: 1.75rem; } .pg-entry-content h3 { font-size: 1.5rem; } .pg-entry-content img { width: 100%; max-width: 100%; height: auto; border-radius: 0.5rem; margin: 1.5rem 0; display: block; } .pg-entry-content p { margin-bottom: 1.5rem; max-width: 100%; overflow-wrap: break-word; } .pg-entry-content a { color: var(--pg-link); text-decoration: underline; } .pg-entry-content blockquote { border-left: 4px solid var(--pg-primary); background: var(--pg-bg-soft); margin: 1.5rem 0; padding: 1rem 1.5rem; font-style: italic; color: var(--pg-dark); border-radius: 0 0.5rem 0.5rem 0; } .pg-entry-content ul, .pg-entry-content ol { margin-bottom: 1.5rem; padding-left: 1.5rem; } .pg-entry-content li { margin-bottom: 0.5rem; } .pg-entry-content table { width: 100%; max-width: 100%; border-collapse: collapse; margin-bottom: 1.5rem; display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; } .pg-entry-content th, .pg-entry-content td { border: 1px solid var(--pg-border); padding: 0.75rem; text-align: left; } .pg-entry-content th { background: var(--pg-bg-soft); font-weight: 700; } .pg-entry-content pre, .pg-entry-content code { max-width: 100%; white-space: pre-wrap; overflow-wrap: anywhere; } .pg-entry-content iframe, .pg-entry-content video, .pg-entry-content embed, .pg-entry-content object { max-width: 100%; } .pg-toc-title { display: inline-flex; align-items: center; gap: 0.55rem; } .pg-toc-title-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.75rem; height: 1.75rem; border-radius: 999px; background: color-mix(in srgb, var(--pg-primary) 10%, transparent); color: var(--pg-link); flex: 0 0 auto; } .pg-toc-toggle svg, .pg-toc-widget.is-collapsed .pg-toc-toggle svg { transform: rotate(0deg); } @media (max-width: 768px) { .pg-single { padding-top: 1rem; padding-bottom: 0; } .pg-single-header { margin-bottom: 1.25rem; } .pg-single-meta-row { display: grid; grid-template-columns: 1fr 1fr; gap: 0.5rem; align-items: stretch; font-size: 0.8125rem; padding: .65rem; text-align: center; } .pg-single-meta-row > :is(.pg-single-views, .pg-single-date, .pg-single-read-time, .pg-single-author-inline) { display: inline-flex; align-items: center; justify-content: center; min-height: 2.35rem; padding: .35rem .45rem; border: 1px solid color-mix(in srgb, var(--pg-primary) 12%, var(--pg-border)); border-radius: .7rem; background: rgba(255, 255, 255, .6); } .pg-single-reader-actions { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: .5rem; padding: .55rem; } .pg-single-reader-actions .reader-audio-controls--single { display: contents; } .pg-single-reader-actions > .pg-audio-language-label { grid-column: 1 / -1; justify-content: center; } .pg-single-reader-actions .reader-audio-btn, .pg-single-reader-actions .pg-single-print-btn, .pg-single-reader-actions .pg-article-share { width: 100%; min-width: 0; } .pg-single-reader-actions .pg-article-share .pg-single-print-btn { width: 100%; } .pg-single-reader-actions .reader-audio-btn, .pg-single-reader-actions .pg-single-print-btn { justify-content: center; padding-inline: .55rem; font-size: .77rem; } .pg-single-cat, .pg-single-views, .pg-single-date, .pg-single-read-time, .pg-single-author-inline { min-width: 0; max-width: 100%; overflow-wrap: anywhere; } .pg-single-author-name { overflow: hidden; text-overflow: ellipsis; } .pg-single-meta-divider { display: none; } .pg-single-featured-img { border-radius: 1rem; margin-bottom: 1rem; } .pg-entry-content { background: transparent !important; background-color: transparent !important; border: 1px solid var(--pg-border); border-radius: 1.25rem; padding: 1rem; box-shadow: var(--pg-shadow-soft); font-size: clamp(1rem, 4.15vw, 1.125rem); line-height: 1.72; } .pg-entry-content h2 { font-size: clamp(1.35rem, 6vw, 1.65rem); overflow-wrap: anywhere; } .pg-entry-content h3 { font-size: clamp(1.2rem, 5vw, 1.45rem); overflow-wrap: anywhere; } .pg-entry-content ul, .pg-entry-content ol { padding-left: 1.15rem; } .pg-toc-widget.pg-toc-widget--mobile { display: block; background: transparent; border: 1px solid var(--pg-border); border-radius: 1rem; box-shadow: var(--pg-shadow-soft); padding: 0.875rem 1rem; margin: 0 0 1.25rem 0; } .pg-toc-widget--mobile .pg-toc-header { margin-bottom: 0.625rem; } .pg-toc-widget--mobile.is-collapsed .pg-toc-header { margin-bottom: 0; } .pg-toc-widget--mobile .pg-toc-title { color: var(--pg-text); letter-spacing: 0.035em; } .pg-toc-widget--mobile .pg-toc-list { max-height: 42vh; overflow-y: auto; } } @media (max-width: 768px) { body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content { background: linear-gradient(145deg, #fffdf8 0%, #fff9ee 100%) !important; border-color: #eee1cd; /* The reading surface can span thousands of pixels. A large shadow forces its tiles to be repainted as the reader reverses scroll direction. */ box-shadow: none !important; } } /* SIDEBAR STICKY */ .pg-single-sidebar { position: sticky; top: calc(80px + 24px); display: flex; flex-direction: column; background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: 1.5rem; padding: 1.5rem; box-shadow: var(--pg-shadow-soft); gap: 0; /* Remove gap, we will use padding/margin for divider */ } /* TOC styles moved to theme.css */ /* RELATED POSTS WIDGET */ .pg-related-widget { background: transparent; border: none; padding: 0; box-shadow: none; margin-top: 0; } .pg-related-title { margin: 0 0 1rem 0; font-size: 0.875rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; letter-spacing: 0.05em; color: var(--pg-muted); } .pg-related-list { display: flex; flex-direction: column; gap: 1rem; } .pg-related-card { display: flex; align-items: flex-start; gap: 1rem; text-decoration: none; transition: transform 0.2s; } .pg-related-card:hover { transform: translateX(4px); } .pg-related-thumb { width: 110px; flex-shrink: 0; aspect-ratio: 16 / 9; border-radius: 0.5rem; overflow: hidden; background: var(--pg-bg-soft); } .pg-related-thumb img { width: 100%; height: 100%; object-fit: cover; display: block; } .pg-related-post-title { font-size: 0.875rem; font-weight: 700; color: var(--pg-dark); line-height: 1.4; margin: 0; } .pg-related-empty { font-size: 0.875rem; color: var(--pg-muted); } /* CAROUSEL */ .pg-carousel-section { margin-top: 4rem; padding-top: 2rem; border-top: 1px solid var(--pg-border); } .pg-carousel-header { margin-bottom: 1.5rem; } .pg-carousel-title { font-size: 1.5rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); margin: 0; } .pg-carousel-track { display: flex; gap: 1.5rem; overflow-x: auto; scroll-snap-type: x mandatory; padding-bottom: 1rem; scrollbar-width: none; /* Firefox */ } .pg-carousel-track::-webkit-scrollbar { display: none; /* Chrome */ } .pg-carousel-card { flex: 0 0 calc(25% - 1.125rem); /* Desktop: 4 cards */ scroll-snap-align: start; background: #ffffff; border: 1px solid var(--pg-border); border-radius: 1.5rem; overflow: hidden; } @media (min-width: 1400px) { .pg-carousel-card { flex: 0 0 calc((100% - 7.5rem) / 6); /* Six cards, five 1.5rem gaps */ } } body.pg-theme-dark .pg-carousel-card { background: #0b1d35; } @media (max-width: 1024px) { .pg-carousel-card { flex: 0 0 calc(50% - 0.75rem); /* Tablet: 2 cards */ } } @media (max-width: 640px) { .pg-carousel-card { flex: 0 0 85%; /* Mobile: 1.2 cards */ } } .pg-carousel-card__img-wrap { display: block; aspect-ratio: 16 / 9; overflow: hidden; background: #f8fbff; } body.pg-theme-dark .pg-carousel-card__img-wrap { background: #122844; } .pg-carousel-card__img { width: 100%; height: 100%; object-fit: cover; transition: transform 0.3s; } .pg-carousel-card:hover .pg-carousel-card__img { transform: scale(1.05); } .pg-carousel-card__body { padding: 1.25rem; } .pg-carousel-card__cat { display: inline-block; margin-bottom: 0.5rem; color: var(--pg-link); font-weight: 700; font-size: 0.75rem; text-transform: uppercase; } .pg-carousel-card__title { font-size: 1rem; font-weight: 700; color: var(--pg-dark); margin: 0 0 0.5rem 0; line-height: 1.4; } .pg-carousel-card__title a { text-decoration: none; } .pg-carousel-card__date { font-size: 0.75rem; color: var(--pg-muted); } .pg-carousel-nav { display: flex; gap: 0.5rem; margin-top: 1.5rem; justify-content: center; } .pg-carousel-nav__btn { width: 40px; height: 40px; border-radius: 50%; background: var(--pg-surface); border: 1px solid var(--pg-border); display: flex; align-items: center; justify-content: center; color: var(--pg-dark); transition: all 0.2s; cursor: pointer; } .pg-carousel-nav__btn:hover:not(:disabled) { background: var(--pg-primary); color: #fff; border-color: var(--pg-primary); } .pg-carousel-nav__btn:disabled { opacity: 0.5; cursor: not-allowed; } /* ========================================================================== EVENT SINGLE POST STYLES ========================================================================== */ .pg-event-header { text-align: center; margin-bottom: 2.5rem; padding: 2.5rem; background: var(--pg-block-bg); backdrop-filter: blur(10px); border: 1px solid var(--pg-border); border-radius: 2rem; box-shadow: var(--pg-shadow-soft); } .pg-event-meta-tags { display: flex; justify-content: center; gap: 0.75rem; margin-bottom: 1.5rem; } .pg-event-tag { padding: 0.25rem 0.75rem; border-radius: 9999px; font-weight: var(--pg-weight-strong,700); font-size: 0.75rem; text-transform: uppercase; } .pg-event-tag--status { background: var(--pg-primary-light); color: var(--pg-link); } .pg-event-tag--format { background: var(--pg-bg-soft); color: var(--pg-muted); } .pg-event-excerpt { font-size: 1.125rem; line-height: 1.6; color: var(--pg-muted); margin: 1.5rem auto 0; max-width: 600px; } .pg-event-info-block { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 2rem; background: var(--pg-surface); border: 1px solid var(--pg-border); border-radius: 1.5rem; padding: 2rem; box-shadow: var(--pg-shadow-soft); margin-top: 2.5rem; margin-bottom: 2.5rem; } .pg-event-info-left { display: flex; align-items: flex-start; gap: 1.5rem; } .pg-event-icon { width: 48px; height: 48px; background: var(--pg-primary-light); color: var(--pg-link); border-radius: 1rem; display: flex; align-items: center; justify-content: center; flex-shrink: 0; } .pg-event-info-text { display: flex; flex-direction: column; gap: 0.25rem; } .pg-event-org-label { font-size: 0.75rem; font-weight: var(--pg-weight-strong,700); text-transform: uppercase; color: var(--pg-muted); letter-spacing: 0.05em; } .pg-event-org-name { font-size: 1.125rem; font-weight: var(--pg-weight-strong,700); color: var(--pg-dark); } .pg-event-time-loc { font-size: 0.875rem; font-weight: 600; color: var(--pg-muted); margin-top: 0.25rem; } .pg-event-info-right { display: flex; flex-wrap: wrap; gap: 1rem; } @media (max-width: 768px) { .pg-event-info-block { flex-direction: column; align-items: flex-start; } .pg-event-info-right { width: 100%; } .pg-event-info-right .pg-btn { flex: 1; text-align: center; justify-content: center; } } /* Mobile overflow hardening for long Vietnamese titles, formulas, tables, and inline code. */ body.single-post .pg-single, body.single-post .pg-single-grid, body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner, body.single-post .pg-entry-content, body.single-post .pg-comments-area { min-width: 0; max-width: 100%; box-sizing: border-box; } body.single-post .pg-single-title, body.single-post .pg-single-excerpt, body.single-post .pg-single-meta-row, body.single-post .pg-single-coauthors, body.single-post .pg-entry-content, body.single-post .pg-entry-content :where(p, li, h1, h2, h3, h4, h5, h6, blockquote, figcaption, td, th, a, code) { max-width: 100%; overflow-wrap: anywhere; word-break: normal; } body.single-post .pg-entry-content :where(img, video, iframe, embed, object, svg) { max-width: 100%; height: auto; } body.single-post .pg-entry-content :where(pre, code) { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; } body.single-post .pg-entry-content :where(table, .wp-block-table) { max-width: 100%; } body.single-post .pg-entry-content .wp-block-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; } body.single-post .pg-entry-content table { width: max-content; min-width: 100%; } /* Tables inserted by the editor are wrapped by single-post.js for safe horizontal scrolling. */ body.single-post .pg-entry-table-wrap { display: block; max-width: 100%; margin: 1.5rem 0; overflow-x: auto; -webkit-overflow-scrolling: touch; border: 1px solid var(--pg-border); border-radius: 0.75rem; } body.single-post .pg-entry-table-wrap table { display: table; width: max-content; min-width: 100%; margin: 0; border-collapse: collapse; } body.single-post .pg-entry-table-wrap :is(th, td) { min-width: 8rem; padding: 0.7rem 0.85rem; border: 1px solid var(--pg-border); vertical-align: top; text-align: left; } @media (max-width: 1024px) { html:has(body.single-post), body.single-post { max-width: 100vw; overflow-x: hidden; } body.single-post .pg-single { width: 100%; max-width: 100%; overflow-x: hidden; padding-left: 1rem; padding-right: 1rem; box-sizing: border-box; } body.single-post .pg-container { min-width: 0; max-width: 100%; width: 100%; box-sizing: border-box; } body.single-post .pg-single-grid, body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; } body.single-post .pg-single-title { display: block; width: 100%; max-width: 100%; white-space: normal; font-size: clamp(1.35rem, 6vw, 1.72rem); line-height: 1.18; overflow-wrap: anywhere; word-break: break-word; } body.single-post .pg-entry-content { width: 100%; max-width: 100%; padding-inline: clamp(0.875rem, 4vw, 1.125rem); overflow-x: hidden; box-sizing: border-box; } body.single-post .pg-entry-content blockquote { margin-inline: 0; padding-inline: 1rem; } } /* Single policy documents should read like legal/reference pages, not blog posts. */ .pg-policy-single { width: min(100%, 1180px); margin: 0 auto; padding: clamp(1.25rem, 3vw, 2.5rem) 0 clamp(3rem, 6vw, 5rem); } .pg-policy-single__utility { display: flex; align-items: center; justify-content: space-between; gap: 1rem; margin: 0 0 1rem; } .pg-policy-single__back { display: inline-flex; align-items: center; gap: .5rem; color: var(--pg-primary-deep, var(--pg-primary)); font-size: .9rem; font-weight: var(--pg-weight-strong,700); text-decoration: none; } .pg-policy-single__back:hover, .pg-policy-single__back:focus-visible { text-decoration: underline; } .pg-policy-single__type, .pg-policy-single__eyebrow, .pg-policy-single__document-label { color: var(--pg-primary-deep, var(--pg-primary)); font-size: .74rem; font-weight: var(--pg-weight-strong,700); letter-spacing: .075em; text-transform: uppercase; } .pg-policy-single__type { padding: .4rem .7rem; border: 1px solid color-mix(in srgb, var(--pg-primary) 24%, var(--pg-border)); border-radius: 999px; background: color-mix(in srgb, var(--pg-primary) 7%, var(--pg-surface-strong)); } .pg-policy-single__article { min-width: 0; } .pg-policy-single__header { margin: 0; padding: clamp(1.5rem, 4vw, 3.5rem); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl, 1.5rem) var(--pg-radius-xl, 1.5rem) 0 0; background: var(--pg-surface-strong); box-shadow: 0 12px 30px color-mix(in srgb, var(--pg-dark) 5%, transparent); } .pg-policy-single__eyebrow { margin: 0 0 .65rem; } .pg-policy-single__title { margin: 0; color: var(--pg-dark); font-size: clamp(2rem, 4.2vw, 3.35rem); line-height: 1.12; font-weight: 950; letter-spacing: 0; } .pg-policy-single__excerpt { max-width: 820px; margin: 1rem 0 0; color: var(--pg-muted); font-size: 1.05rem; line-height: 1.65; } .pg-policy-single__document { padding: clamp(1.5rem, 4vw, 3.5rem); border: 1px solid var(--pg-border); border-top: 0; border-radius: 0 0 var(--pg-radius-xl, 1.5rem) var(--pg-radius-xl, 1.5rem); background: var(--pg-surface-strong); box-shadow: 0 14px 32px color-mix(in srgb, var(--pg-dark) 5%, transparent); } .pg-policy-single__document-label { display: flex; align-items: center; gap: .5rem; margin: 0 0 1.35rem; padding-bottom: .9rem; border-bottom: 1px solid var(--pg-border); } .pg-policy-single__content.pg-entry-content { max-width: 980px; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; background: transparent; color: var(--pg-text); font-size: clamp(1.05rem, 1.3vw, 1.2rem); line-height: 1.85; } .pg-policy-single__content.pg-entry-content > :first-child { margin-top: 0; } .pg-policy-single__content.pg-entry-content h2 { margin-top: clamp(2rem, 4vw, 3rem); font-size: clamp(1.45rem, 2.4vw, 2rem); line-height: 1.25; } .pg-policy-single__content.pg-entry-content h3 { margin-top: 2rem; font-size: clamp(1.2rem, 1.8vw, 1.45rem); } .pg-policy-single__content.pg-entry-content p, .pg-policy-single__content.pg-entry-content li { max-width: 920px; } @media (max-width: 768px) { .pg-policy-single { padding-top: 1rem; } .pg-policy-single__content.pg-entry-content { font-size: 1rem; line-height: 1.72; } .pg-policy-single__utility { align-items: flex-start; flex-direction: column; } .pg-policy-single__header, .pg-policy-single__document { padding: 1.35rem; } } /* PsyGuild source: design-system.css */ /* * PsyGuild design system. * This file is the single color/type normalization layer and is loaded last. */ :root { --pg-color-blue: var(--pg-primary); --pg-color-blue-strong: var(--pg-primary-deep); --pg-color-heal: var(--pg-secondary); --pg-color-heal-strong: var(--pg-secondary-deep); --pg-color-black: #020617; --pg-color-white: #ffffff; --pg-font-sans: var(--pg-interface-font, "Be Vietnam Pro", system-ui, sans-serif); --pg-font-roboto: "Roboto", sans-serif; --pg-font-noto: "Noto Sans", sans-serif; --pg-font-source: "Source Sans 3", sans-serif; --pg-color-text: var(--pg-color-black); --pg-color-muted: rgba(2, 6, 23, 0.72); --pg-color-page: #ffffff; --pg-color-surface: rgba(255, 255, 255, 0.92); --pg-color-surface-strong: #ffffff; --pg-color-border: rgba(2, 6, 23, 0.12); --pg-color-border-strong: rgba(2, 6, 23, 0.22); --pg-color-header: rgba(255, 255, 255, 0.94); --pg-color-footer: #ffffff; --pg-brand-gradient: var(--pg-action-gradient); --pg-brand-gradient-hover: var(--pg-action-gradient-hover); --pg-brand-tint: linear-gradient(135deg, color-mix(in srgb, var(--pg-color-blue) 12%, transparent), color-mix(in srgb, var(--pg-color-heal) 14%, transparent)); --pg-bg: var(--pg-color-page); --pg-bg-soft: rgba(2, 6, 23, 0.03); --pg-surface: var(--pg-color-surface); --pg-surface-strong: var(--pg-color-surface-strong); --pg-border: var(--pg-color-border); --pg-border-strong: var(--pg-color-border-strong); --pg-text: var(--pg-color-text); --pg-muted: var(--pg-color-muted); --pg-dark: var(--pg-color-black); --pg-section-bg: var(--pg-color-surface); --pg-block-bg: var(--pg-color-surface); --pg-header-bg: var(--pg-color-header); --pg-footer-bg: var(--pg-color-footer); --pg-comment-bg: var(--pg-color-surface); --pg-gradient: var(--pg-brand-gradient); --pg-gradient-hover: var(--pg-brand-gradient-hover); --pg-link: var(--pg-highlight-mid-deep); --pg-link-hover: var(--pg-color-heal-strong); --pg-accent: var(--pg-color-heal); --pg-accent-light: var(--pg-color-blue); } /* Final single-post mobile overflow guard. Keeps long text inside the article viewport. */ body.single-post .pg-single, body.single-post .pg-single-grid, body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner, body.single-post .pg-entry-content, body.single-post .pg-comments-area { min-width: 0; max-width: 100%; box-sizing: border-box; } body.single-post .pg-single-title, body.single-post .pg-single-excerpt, body.single-post .pg-single-meta-row, body.single-post .pg-single-coauthors, body.single-post .pg-entry-content, body.single-post .pg-entry-content :where(p, li, h1, h2, h3, h4, h5, h6, blockquote, figcaption, td, th, a, code) { max-width: 100%; overflow-wrap: anywhere; word-break: normal; } body.single-post .pg-entry-content :where(img, video, iframe, embed, object, svg) { max-width: 100%; height: auto; } body.single-post .pg-entry-content :where(pre, code) { white-space: pre-wrap; overflow-wrap: anywhere; word-break: break-word; } body.single-post .pg-entry-content :where(table, .wp-block-table) { max-width: 100%; } body.single-post .pg-entry-content .wp-block-table { display: block; overflow-x: auto; -webkit-overflow-scrolling: touch; } body.single-post .pg-entry-content table { width: max-content; min-width: 100%; } @media (max-width: 1024px) { html:has(body.single-post), body.single-post { max-width: 100vw !important; overflow-x: hidden !important; } body.single-post .pg-single { width: 100%; max-width: 100%; overflow-x: hidden; } body.single-post .pg-container { min-width: 0; max-width: 100%; } body.single-post .pg-single-title { font-size: clamp(1.45rem, 7vw, 2rem); line-height: 1.18; } body.single-post .pg-entry-content { padding-inline: clamp(0.875rem, 4vw, 1.125rem); overflow-x: hidden; } body.single-post .pg-entry-content blockquote { margin-inline: 0; padding-inline: 1rem; } } body.pg-theme-dark { --pg-color-text: var(--pg-color-white); --pg-color-muted: rgba(255, 255, 255, 0.74); --pg-color-page: var(--pg-color-black); --pg-color-surface: rgba(2, 6, 23, 0.9); --pg-color-surface-strong: rgba(2, 6, 23, 0.98); --pg-color-border: rgba(255, 255, 255, 0.16); --pg-color-border-strong: rgba(255, 255, 255, 0.28); --pg-color-header: rgba(2, 6, 23, 0.94); --pg-color-footer: var(--pg-color-black); --pg-bg-soft: rgba(255, 255, 255, 0.06); --pg-dark: var(--pg-color-white); background-color: var(--pg-bg); background-image: var(--pg-body-bg-image), radial-gradient(circle at top left, color-mix(in srgb, var(--pg-color-blue) 14%, transparent) 0%, transparent 31%), linear-gradient(180deg, var(--pg-color-black) 0%, #050914 48%, var(--pg-color-black) 100%); background-size: cover, auto, auto; background-position: center top, left top, center; background-repeat: no-repeat, no-repeat, no-repeat; background-attachment: fixed, scroll, scroll; } body { color: var(--pg-text); font-family: var(--pg-font-sans); } .pg-text-gradient, .pg-side-header__title, .pg-newsroom__title, .pg-author-header__title, .pg-services__title { background: var(--pg-brand-gradient); -webkit-background-clip: text; background-clip: text; -webkit-text-fill-color: transparent; color: transparent; } .pg-site-header, .pg-sub-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-drawer, .pg-site-footer, .pg-card, .pg-card-strong, .pg-home-side-card, .pg-event-item, .pg-author-item, .pg-news-card, .pg-service-card, .pg-single-sidebar, .pg-comments-area, .pg-comment-card, .pg-portal-card, .pg-author-card { background: var(--pg-block-bg); color: var(--pg-text); border-color: var(--pg-border); } .pg-site-header { background-color: var(--pg-header-bg); background-image: var(--pg-header-bg-image); background-size: cover; background-position: center; background-repeat: no-repeat; border-bottom-color: var(--pg-border); } .pg-site-footer { background-color: var(--pg-footer-bg); background-image: var(--pg-footer-bg-image); background-size: cover; background-position: center; background-repeat: no-repeat; } .pg-site-footer__overlay { background: var(--pg-brand-tint); } .pg-main-nav a, .pg-site-header a, .pg-site-header button, .pg-footer-title, .pg-footer-nav a, .pg-side-header__title, .pg-event-item__title, .pg-author-name, .pg-news-card__title, .pg-service-card__title, .pg-single-title, .pg-entry-content, .pg-entry-content p, .pg-entry-content li, .pg-entry-content h1, .pg-entry-content h2, .pg-entry-content h3, .pg-entry-content h4, .pg-entry-content h5, .pg-entry-content h6, .pg-comment-card, .pg-comment-card p { color: var(--pg-text); } .pg-logo-desc, .pg-footer-desc, .pg-footer-nav a, .pg-side-header__subtitle, .pg-event-item__meta, .pg-author-role, .pg-author-meta, .pg-news-card__excerpt, .pg-news-card__meta, .pg-service-card__excerpt, .pg-single-excerpt, .pg-single-meta-row, .pg-single-read-time, .pg-single-date, .pg-single-views { color: var(--pg-muted); } .pg-btn-primary, .pg-btn-dark, .pg-hero-btn-primary, .pg-service-card__btn, .pg-news-card__read-btn, .pg-sidebar-cta__btn, .pg-bottom-fab, .pg-scroll-top, .pg-portal-social-icon, .pg-author-social-link { background: var(--pg-brand-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white); border-color: transparent; } .pg-btn-primary:hover, .pg-btn-dark:hover, .pg-hero-btn-primary:hover, .pg-service-card__btn:hover, .pg-news-card__read-btn:hover, .pg-sidebar-cta__btn:hover, .pg-bottom-fab:hover, .pg-scroll-top:hover, .pg-author-social-link:hover { background: var(--pg-brand-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white); } .pg-btn-icon, .pg-btn-icon-sm, .pg-btn-icon-bg, .pg-btn-soft, .pg-hero-btn-soft, .pg-block-nav-btn, .pg-highlights-nav-btns button, .pg-search-form, .pg-sidebar-link { color: var(--pg-text); } .pg-btn-icon:hover, .pg-btn-icon-bg:hover, .pg-btn-soft:hover, .pg-hero-btn-soft:hover, .pg-block-nav-btn:hover, .pg-highlights-nav-btns button:hover, .pg-sidebar-link:hover, .pg-sidebar-menu a:hover, .pg-sidebar-menu li.current-menu-item > a { background: var(--pg-brand-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white); border-color: transparent; } .pg-site-header .pg-btn-icon:not(.pg-header-action--primary) { border-color: transparent; clip-path: inset(0 round 1rem); background: linear-gradient(var(--pg-block-bg), var(--pg-block-bg)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-color-blue) 22%, transparent), color-mix(in srgb, var(--pg-color-heal) 24%, transparent)) border-box; background-clip: padding-box, border-box; background-origin: padding-box, border-box; color: var(--pg-text); box-shadow: 0 8px 18px color-mix(in srgb, var(--pg-dark) 5%, transparent); } .pg-site-header .pg-btn-icon:not(.pg-header-action--primary):hover, .pg-site-header .pg-btn-icon[aria-expanded="true"]:not(.pg-header-action--primary), .pg-site-header .pg-theme-toggle[aria-pressed="true"] { background: var(--pg-brand-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white); border-color: transparent; box-shadow: 0 12px 26px color-mix(in srgb, var(--pg-color-blue) 28%, transparent); } .pg-site-header .pg-btn-icon[aria-expanded="true"]:not(.pg-header-action--primary):hover, .pg-site-header .pg-theme-toggle[aria-pressed="true"]:hover { background: var(--pg-brand-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; color: var(--pg-color-white); } .pg-single, .pg-single-main-column, .pg-single-article, .pg-article-content, .pg-entry-content, .pg-comments-area { background: transparent; color: var(--pg-text); } .pg-entry-content a, .pg-footer-nav a:hover, .pg-social-link:hover, .pg-toc-link.is-active, .pg-toc-link:hover, .pg-single-cat, .pg-side-header__subtitle--blue, .pg-side-header__subtitle--green { color: var(--pg-color-blue); } .pg-entry-content .pg-link-preview-card { margin: 1.75rem 0; padding: 0; border: 1px solid var(--pg-border); border-radius: 1rem; background: var(--pg-block-bg); box-shadow: var(--pg-shadow-soft); overflow: hidden; } .pg-entry-content .pg-link-preview-card__link { display: grid; grid-template-columns: minmax(180px, 34%) minmax(0, 1fr); color: inherit; text-decoration: none; } .pg-entry-content .pg-link-preview-card__link:hover .pg-link-preview-card__title, .pg-entry-content .pg-link-preview-card__link:focus-visible .pg-link-preview-card__title { color: var(--pg-color-blue); } .pg-entry-content .pg-link-preview-card__media { display: block; min-width: 0; aspect-ratio: 16 / 9; background: var(--pg-bg-soft); overflow: hidden; } .pg-entry-content .pg-link-preview-card__media img { width: 100%; height: 100%; margin: 0; border-radius: 0; object-fit: cover; transition: transform 0.22s ease; } .pg-entry-content .pg-link-preview-card__link:hover .pg-link-preview-card__media img { transform: scale(1.035); } .pg-entry-content .pg-link-preview-card__placeholder { display: flex; width: 100%; height: 100%; align-items: center; justify-content: center; color: var(--pg-muted); } .pg-entry-content .pg-link-preview-card__placeholder svg { width: 2.5rem; height: 2.5rem; } .pg-entry-content .pg-link-preview-card__body { display: flex; min-width: 0; flex-direction: column; justify-content: center; gap: 0.45rem; padding: 1.1rem 1.25rem; } .pg-entry-content .pg-link-preview-card__eyebrow { color: var(--pg-muted); font-size: 0.72rem; font-weight: 900; letter-spacing: 0.05em; text-transform: uppercase; } .pg-entry-content .pg-link-preview-card__title { display: block; color: var(--pg-dark); font-size: 1.05rem; font-weight: 900; line-height: 1.32; overflow-wrap: anywhere; transition: color 0.2s ease; } .pg-entry-content .pg-link-preview-card__excerpt { display: -webkit-box; color: var(--pg-muted); font-size: 0.9rem; line-height: 1.55; overflow: hidden; -webkit-line-clamp: 2; -webkit-box-orient: vertical; } @media (max-width: 768px) { .pg-entry-content .pg-link-preview-card__link { grid-template-columns: 1fr; } .pg-entry-content .pg-link-preview-card__body { padding: 1rem; } } .pg-entry-content blockquote { position: relative; border: 1px solid transparent; border-left: 0; border-radius: 1rem; clip-path: inset(0 round 1rem); background: linear-gradient(var(--pg-block-bg), var(--pg-block-bg)) padding-box, var(--pg-brand-gradient) border-box; background-clip: padding-box, border-box; background-origin: padding-box, border-box; color: var(--pg-text); } .pg-entry-content blockquote::before { content: ""; position: absolute; inset: 0 auto 0 0; width: 4px; border-radius: 1rem 0 0 1rem; background: var(--pg-brand-gradient); } .pg-entry-content blockquote p, .pg-entry-content blockquote cite { color: var(--pg-text); } .pg-single-cat, .pg-entry-content th, .pg-entry-content code, .pg-entry-content pre, .pg-related-thumb, .pg-news-card__img, .pg-news-card__img-placeholder, .pg-highlight-img-placeholder, .pg-service-card__img, .pg-author-avatar, .pg-event-icon { background: var(--pg-brand-tint); color: var(--pg-text); border-color: var(--pg-border); } .pg-author-online-dot, .pg-hero-dot.is-active { background: var(--pg-brand-gradient); border-color: var(--pg-color-white); } body.pg-theme-dark .pg-logo-img { background: transparent; } body.pg-theme-dark .pg-hero-slide, body.pg-theme-dark .pg-hero-title, body.pg-theme-dark .pg-hero-cat-tag, body.pg-theme-dark .pg-hero-actions a { color: var(--pg-color-white); } body.pg-theme-dark .pg-hero-btn-soft { background: var(--pg-color-white); color: var(--pg-color-black); } /* Comments currently include legacy inline CSS in comments.php, so this scoped layer must win. */ .pg-comments-area, .pg-comments-area .comment, .pg-comments-area .comment-body, .pg-comments-area .comment-respond, .pg-comments-area .comment-form { background: transparent !important; color: var(--pg-text) !important; border-color: var(--pg-border) !important; } .pg-comments-area input[type="text"], .pg-comments-area input[type="email"], .pg-comments-area input[type="url"], .pg-comments-area textarea { background: var(--pg-block-bg) !important; color: var(--pg-text) !important; border-color: var(--pg-border) !important; } .pg-comments-area input::placeholder, .pg-comments-area textarea::placeholder { color: var(--pg-muted) !important; } /* Typography Utility Classes */ .pg-font-roboto { font-family: var(--pg-font-roboto) !important; } .pg-font-noto { font-family: var(--pg-font-noto) !important; } .pg-font-source { font-family: var(--pg-font-source) !important; } /* Tailored logo title to always retain premium brand gradient */ .pg-logo-title { display: inline-block !important; width: fit-content !important; background: var(--pg-brand-gradient) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; } /* Beautiful footer headings matching the brand guidelines */ .pg-footer-heading { color: var(--pg-color-blue-strong) !important; font-size: 1rem !important; font-weight: 900 !important; text-transform: uppercase !important; letter-spacing: 0.05em !important; margin: 0 0 0.75rem 0 !important; } body.pg-theme-dark .pg-footer-heading { color: var(--pg-color-blue) !important; } /* Final cascade guard for mobile single-post overflow. */ body.single-post .pg-single, body.single-post .pg-single-grid, body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner, body.single-post .pg-entry-content, body.single-post .pg-comments-area { min-width: 0 !important; max-width: 100% !important; box-sizing: border-box !important; } body.single-post .pg-single-title, body.single-post .pg-single-excerpt, body.single-post .pg-single-meta-row, body.single-post .pg-single-coauthors, body.single-post .pg-entry-content, body.single-post .pg-entry-content :where(p, li, h1, h2, h3, h4, h5, h6, blockquote, figcaption, td, th, a, code) { max-width: 100% !important; overflow-wrap: anywhere !important; word-break: normal !important; } body.single-post .pg-entry-content :where(img, video, iframe, embed, object, svg) { max-width: 100% !important; height: auto; } body.single-post .pg-entry-content :where(pre, code) { white-space: pre-wrap !important; overflow-wrap: anywhere !important; word-break: break-word !important; } body.single-post .pg-entry-content .wp-block-table { display: block !important; max-width: 100% !important; overflow-x: auto !important; -webkit-overflow-scrolling: touch; } body.single-post .pg-entry-content table { width: max-content; min-width: 100%; max-width: 100%; } body.single-post .pg-single-meta-row > *, body.single-post .pg-single-author-inline, body.single-post .reader-audio-controls--single, body.single-post .reader-audio-controls--single .reader-audio-btn { min-width: 0 !important; max-width: 100% !important; } body.single-post .pg-single-author-name { min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } @media (max-width: 1024px) { body.single-post .pg-single { width: 100% !important; max-width: 100% !important; overflow-x: hidden !important; padding-left: 1rem !important; padding-right: 1rem !important; box-sizing: border-box !important; } body.single-post .pg-container { min-width: 0 !important; max-width: 100% !important; width: 100% !important; box-sizing: border-box !important; } body.single-post .pg-single-grid, body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; } body.single-post .pg-single-title { display: block !important; width: 100% !important; max-width: 100% !important; white-space: normal !important; font-size: clamp(1.35rem, 6vw, 1.72rem) !important; line-height: 1.18 !important; overflow-wrap: anywhere !important; word-break: break-word !important; } body.single-post .pg-entry-content { width: 100% !important; max-width: 100% !important; padding-inline: clamp(0.875rem, 4vw, 1.125rem) !important; overflow-x: hidden !important; box-sizing: border-box !important; } body.single-post .pg-entry-content blockquote { margin-inline: 0 !important; padding-inline: 1rem !important; } } /* Single scroll layout: compact left drawer for ToC and related reading links. */ body.single-post .pg-single-grid { grid-template-columns: minmax(0, 1fr) !important; gap: 0 !important; } body.single-post .pg-single-sidebar { position: fixed !important; top: calc(var(--pg-header-height, 80px) + 0.75rem) !important; bottom: 0.75rem !important; left: 0 !important; z-index: 1202 !important; width: min(25rem, calc(100dvw - 4rem)) !important; max-width: min(25rem, calc(100dvw - 4rem)) !important; max-height: none !important; overflow-y: auto !important; overscroll-behavior: contain; display: flex !important; flex-direction: column !important; gap: 1.35rem !important; padding: 1.25rem !important; border: 1px solid color-mix(in srgb, var(--pg-border) 82%, transparent) !important; border-left: 0 !important; border-radius: 0 1.35rem 1.35rem 0 !important; background: color-mix(in srgb, var(--pg-surface, #fff) 94%, transparent) !important; box-shadow: 0 22px 60px rgba(15, 23, 42, 0.18) !important; transform: translateX(calc(-100% - 1rem)) !important; transition: transform 0.26s ease, box-shadow 0.26s ease !important; } body.single-post .pg-single-sidebar.is-open { transform: translateX(0) !important; } body.single-post .pg-single-sidebar::-webkit-scrollbar { width: 5px; } body.single-post .pg-single-sidebar::-webkit-scrollbar-track { background: transparent; } body.single-post .pg-single-sidebar::-webkit-scrollbar-thumb { background: color-mix(in srgb, var(--pg-muted) 38%, transparent); border-radius: 999px; } body.single-post .pg-single-sidebar-tab { position: fixed; left: 0; top: 50%; z-index: 1203; transform: translateY(-50%); display: inline-flex; align-items: center; gap: 0.45rem; min-height: 3rem; padding: 0.7rem 0.8rem 0.7rem 0.7rem; border: 1px solid color-mix(in srgb, var(--pg-primary) 26%, var(--pg-border)); border-left: 0; border-radius: 0 999px 999px 0; background: color-mix(in srgb, var(--pg-surface, #fff) 92%, transparent); color: var(--pg-dark); box-shadow: 0 14px 32px rgba(15, 23, 42, 0.14); font-size: 0.85rem; font-weight: 900; line-height: 1; cursor: pointer; transition: left 0.26s ease, transform 0.24s ease, background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease; } body.single-post .pg-single-sidebar-tab:hover, body.single-post .pg-single-sidebar-tab.is-open { background: var(--pg-gradient); color: #fff; box-shadow: 0 18px 40px rgba(20, 184, 166, 0.22); } body.single-post .pg-single-sidebar-tab.is-open { left: min(25rem, calc(100dvw - 4rem)); } body.single-post .pg-single-sidebar-tab-icon { display: inline-flex; align-items: center; justify-content: center; width: 1.6rem; height: 1.6rem; border-radius: 999px; background: color-mix(in srgb, currentColor 12%, transparent); flex: 0 0 auto; } body.single-post .pg-single-sidebar-tab-label { white-space: nowrap; } body.single-post .pg-single-sidebar-overlay { position: fixed; inset: 0; z-index: 1201; pointer-events: none; opacity: 0; background: rgba(15, 23, 42, 0.18); backdrop-filter: blur(2px); transition: opacity 0.2s ease; } body.single-post .pg-single-sidebar-overlay.is-active { pointer-events: auto; opacity: 1; } body.single-post .pg-single-sidebar .pg-toc-widget { display: block; margin: 0; padding: 0 0 1.25rem; border: 0; border-bottom: 1px dashed color-mix(in srgb, var(--pg-border-strong, #cbd5e1) 72%, transparent); background: transparent; box-shadow: none; } body.single-post .pg-single-sidebar .pg-toc-header { margin-bottom: 0.85rem; } body.single-post .pg-single-sidebar .pg-toc-list { max-height: 38vh; overflow-y: auto; padding-right: 0.25rem; } body.single-post .pg-single-sidebar .pg-related-widget { margin: 0 !important; padding: 0 !important; border: 0 !important; background: transparent !important; box-shadow: none !important; } body.single-post .pg-single-sidebar .pg-related-title { margin-bottom: 0.85rem !important; } body.single-post .pg-single-sidebar .pg-related-card { box-sizing: border-box; min-width: 0; border-radius: 0.9rem; border: 1px solid color-mix(in srgb, var(--pg-border, #dbe4ee) 82%, transparent); background: color-mix(in srgb, var(--pg-bg-soft, #f8fafc) 74%, transparent); overflow: hidden; } body.single-post .pg-single-sidebar .pg-related-thumb { border-radius: 0.65rem; } body.single-post .pg-single-sidebar .pg-related-post-title { flex: 1 1 auto; min-width: 0; } @media (max-width: 767px) { body.single-post.pg-single-sidebar-open { overflow: hidden; } body.single-post .pg-single-sidebar { top: 0.75rem !important; bottom: 0.75rem !important; width: min(22rem, calc(100dvw - 3.25rem)) !important; max-width: min(22rem, calc(100dvw - 3.25rem)) !important; padding: 1rem !important; border-radius: 0 1.1rem 1.1rem 0 !important; } body.single-post .pg-single-sidebar .pg-related-list { gap: 0.75rem; } body.single-post .pg-single-sidebar .pg-related-card { align-items: center; gap: 0.7rem; padding: 0.45rem; } body.single-post .pg-single-sidebar .pg-related-thumb { flex: 0 0 clamp(5.25rem, 33vw, 6.875rem); width: clamp(5.25rem, 33vw, 6.875rem); border-radius: 0.65rem; } body.single-post .pg-single-sidebar-tab { top: auto; bottom: calc(4.75rem + env(safe-area-inset-bottom, 0px)); left: 0.75rem; transform: none; min-height: 2.75rem; border-left: 1px solid color-mix(in srgb, var(--pg-primary) 26%, var(--pg-border)); border-radius: 999px; padding: 0.62rem 0.72rem 0.62rem 0.58rem; } body.single-post .pg-single-sidebar-tab.is-open { left: min(22rem, calc(100dvw - 3.25rem)); } body.single-post .pg-single-sidebar-tab-label { display: none; } } /* Desktop single-post layout guard. Keep article content inside the header container while the global header sidebar control remains available on every viewport. */ @media (min-width: 1024px) { body.single-post .pg-single-sidebar-tab, body.single-post .pg-single-sidebar-overlay { display: none !important; } body.single-post .pg-single.pg-container { width: calc(100% - (var(--pg-page-gutter) * 2)) !important; max-width: none !important; margin-left: auto !important; margin-right: auto !important; padding-left: 1rem !important; padding-right: 1rem !important; overflow-x: clip !important; } body.single-post .pg-single-grid { grid-template-columns: minmax(0, 1fr) minmax(18rem, 22rem) !important; gap: clamp(2rem, 4vw, 3.5rem) !important; align-items: start !important; } body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner, body.single-post .pg-entry-content { width: 100% !important; max-width: 100% !important; } body.single-post .pg-single-sidebar { position: sticky !important; top: calc(var(--pg-header-height, 80px) + 1rem) !important; bottom: auto !important; left: auto !important; z-index: 1 !important; width: 100% !important; max-width: 22rem !important; max-height: calc(100dvh - var(--pg-header-height, 80px) - 2rem) !important; overflow-y: auto !important; display: flex !important; transform: none !important; border-left: 1px solid color-mix(in srgb, var(--pg-border) 82%, transparent) !important; border-radius: 1.35rem !important; box-shadow: var(--pg-shadow-soft) !important; } } @media (max-width: 1023px) { body.single-post { --pg-single-sidebar-mobile-width: min(22rem, calc(100dvw - 3.25rem)); } body.single-post .pg-single-sidebar { top: 0.75rem !important; bottom: 0.75rem !important; width: var(--pg-single-sidebar-mobile-width) !important; max-width: var(--pg-single-sidebar-mobile-width) !important; border-radius: 0 1.15rem 1.15rem 0 !important; } body.single-post .pg-single-sidebar-tab { top: 50% !important; bottom: auto !important; left: -0.35rem !important; transform: translateY(-50%) !important; width: 2.4rem !important; min-width: 2.4rem !important; height: 4rem !important; min-height: 4rem !important; padding: 0 !important; justify-content: center !important; gap: 0 !important; border-left: 0 !important; border-radius: 0 1rem 1rem 0 !important; background: color-mix(in srgb, var(--pg-surface, #fff) 96%, transparent) !important; color: var(--pg-dark) !important; box-shadow: 0 12px 26px rgba(15, 23, 42, 0.14) !important; overflow: visible !important; animation: pgSidebarTabBreathe 2.8s ease-in-out infinite; } body.single-post .pg-single-sidebar-tab.is-open { left: var(--pg-single-sidebar-mobile-width) !important; animation: none; } body.single-post .pg-single-sidebar-tab-label { display: none !important; white-space: nowrap !important; } body.single-post .pg-single-sidebar-tab-icon { width: 100% !important; height: 100% !important; background: transparent !important; color: var(--pg-link) !important; transition: transform 0.24s ease, color 0.2s ease !important; } body.single-post .pg-single-sidebar-tab.is-open .pg-single-sidebar-tab-icon { background: transparent !important; color: #fff !important; transform: rotate(180deg) !important; } body.single-post .pg-single-sidebar-tab:hover .pg-single-sidebar-tab-icon { transform: translateX(2px); } body.single-post .pg-single-sidebar-tab.is-open:hover .pg-single-sidebar-tab-icon { transform: rotate(180deg) translateX(2px) !important; } } @keyframes pgSidebarTabBreathe { 0%, 100% { transform: translateY(-50%) translateX(0); } 50% { transform: translateY(-50%) translateX(2px); } } @media (max-width: 1023px) { body.single-post .pg-single-grid, body.single-post .pg-single-main-column, body.single-post .pg-single-header, body.single-post .pg-single-header-inner, body.single-post .pg-entry-content { width: 100% !important; max-width: 100% !important; } body.single-post .pg-single-title { width: 100% !important; max-width: 100% !important; font-size: clamp(1.65rem, 6.4vw, 2.4rem) !important; line-height: 1.16 !important; } body.single-post .pg-entry-content { padding-inline: clamp(1rem, 4vw, 1.35rem) !important; } } /* Homepage and listing visual system: pastel space glass, scoped away from reader pages. */ :root { --psg-dark-bg-deep: #071426; --psg-dark-bg-main: #0B1D35; --psg-dark-bg-soft: #102645; --pg-space-light-base: #f7fcff; --pg-space-light-surface: rgba(246, 253, 255, 0.86); --pg-space-light-surface-strong: rgba(255, 255, 255, 0.94); --pg-space-light-border: rgba(0, 164, 204, 0.2); --pg-space-shadow-a: color-mix(in srgb, var(--pg-primary) 14%, transparent); --pg-space-shadow-b: color-mix(in srgb, var(--pg-primary-deep, #00a3cc) 10%, transparent); --pg-space-mint: var(--pg-secondary); --pg-space-cyan: #67e8f9; --pg-space-mint-soft: color-mix(in srgb, var(--pg-secondary) 7.5%, transparent); --pg-space-highlight: rgba(255, 255, 255, 0.78); } body.pg-theme-dark { --pg-color-page: var(--psg-dark-bg-deep); --pg-color-surface: rgba(16, 38, 69, 0.72); --pg-color-surface-strong: rgba(11, 29, 53, 0.86); --pg-color-header: rgba(11, 29, 53, 0.78); --pg-color-footer: var(--psg-dark-bg-main); --pg-bg: var(--psg-dark-bg-deep); --pg-bg-soft: var(--psg-dark-bg-soft); --pg-surface: rgba(16, 38, 69, 0.72); --pg-surface-strong: rgba(11, 29, 53, 0.88); --pg-block-bg: rgba(11, 29, 53, 0.74); --pg-section-bg: rgba(16, 38, 69, 0.58); --pg-header-bg: rgba(11, 29, 53, 0.82); --pg-footer-bg: var(--psg-dark-bg-main); --pg-border: rgba(148, 218, 255, 0.16); --pg-border-strong: rgba(178, 230, 255, 0.28); --pg-space-light-surface: rgba(16, 38, 69, 0.7); --pg-space-light-surface-strong: rgba(18, 48, 86, 0.88); --pg-space-light-border: color-mix(in srgb, var(--pg-primary) 22%, transparent); --pg-space-shadow-a: color-mix(in srgb, var(--pg-primary) 18%, transparent); --pg-space-shadow-b: color-mix(in srgb, var(--pg-secondary) 12%, transparent); --pg-space-mint-soft: color-mix(in srgb, var(--pg-secondary) 8%, transparent); --pg-space-highlight: rgba(255, 255, 255, 0.13); } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) { position: relative; isolation: isolate; /* A light veil rather than an opaque page slab: coloured stars remain visible on light mode without competing with readable content. */ background-color: transparent; background-image: radial-gradient(circle at 18% 12%, color-mix(in srgb, var(--pg-primary) 12%, transparent) 0 12rem, transparent 28rem), radial-gradient(circle at 78% 18%, rgba(103, 232, 249, 0.1) 0 11rem, transparent 30rem), radial-gradient(circle at 52% 82%, color-mix(in srgb, var(--pg-space-mint) 9%, transparent) 0 12rem, transparent 32rem), radial-gradient(circle at 92% 72%, color-mix(in srgb, var(--pg-space-mint) 5%, transparent) 0 10rem, transparent 28rem), linear-gradient(180deg, rgba(251, 253, 255, 0.62) 0%, rgba(238, 252, 255, 0.5) 46%, rgba(245, 255, 251, 0.54) 100%) !important; background-attachment: fixed, fixed, fixed, scroll; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) { background-color: var(--psg-dark-bg-deep); background-image: radial-gradient(circle at 18% 10%, color-mix(in srgb, var(--pg-primary) 18%, transparent) 0 10rem, transparent 29rem), radial-gradient(circle at 80% 20%, rgba(56, 189, 248, 0.13) 0 11rem, transparent 31rem), radial-gradient(circle at 50% 88%, color-mix(in srgb, var(--pg-secondary) 12%, transparent) 0 12rem, transparent 34rem), radial-gradient(circle at 92% 70%, var(--pg-space-mint-soft) 0 10rem, transparent 30rem), linear-gradient(180deg, var(--psg-dark-bg-deep) 0%, var(--psg-dark-bg-main) 48%, var(--psg-dark-bg-deep) 100%) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::before, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { content: ""; position: fixed; pointer-events: none; z-index: 0; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::before { inset: -18vmax; background: radial-gradient(circle at 18% 30%, color-mix(in srgb, var(--pg-primary) 18%, transparent) 0 10rem, transparent 26rem), radial-gradient(circle at 84% 22%, rgba(103, 232, 249, 0.14) 0 9rem, transparent 25rem), radial-gradient(circle at 44% 78%, color-mix(in srgb, var(--pg-space-mint) 15%, transparent) 0 9rem, transparent 27rem), radial-gradient(circle at 82% 70%, var(--pg-space-mint-soft) 0 7rem, transparent 24rem); filter: blur(10px) saturate(1.03); opacity: 0.34; transform: translate3d(0, 0, 0); animation: pgPastelSpaceDrift 22s ease-in-out infinite alternate; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { inset: 0; opacity: 0.38; background-image: linear-gradient(115deg, transparent 0 45%, rgba(255, 255, 255, 0.36) 48%, transparent 54%), radial-gradient(circle at 20% 20%, rgba(255, 255, 255, 0.45) 0 1px, transparent 2px), radial-gradient(circle at 74% 38%, rgba(255, 255, 255, 0.36) 0 1px, transparent 2px), radial-gradient(circle at 44% 82%, rgba(255, 255, 255, 0.28) 0 1px, transparent 2px); background-size: 220% 220%, 19rem 19rem, 23rem 23rem, 31rem 31rem; animation: pgSpaceSheen 18s linear infinite; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { opacity: 0.26; background-image: linear-gradient(115deg, transparent 0 45%, rgba(159, 230, 255, 0.14) 48%, transparent 54%), radial-gradient(circle at 20% 20%, rgba(178, 230, 255, 0.36) 0 1px, transparent 2px), radial-gradient(circle at 74% 38%, rgba(125, 211, 252, 0.24) 0 1px, transparent 2px), radial-gradient(circle at 44% 82%, rgba(125, 255, 219, 0.18) 0 1px, transparent 2px); } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) > :where(main, .main-content, .pg-site-footer) { position: relative; z-index: 1; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-site-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-drawer) { background: linear-gradient(135deg, color-mix(in srgb, var(--pg-space-light-surface-strong) 92%, transparent), color-mix(in srgb, var(--pg-space-light-surface) 88%, transparent)) padding-box, linear-gradient(135deg, rgba(255, 255, 255, 0.72), color-mix(in srgb, var(--pg-primary) 28%, transparent), color-mix(in srgb, var(--pg-space-mint) 18%, transparent), var(--pg-space-mint-soft)) border-box !important; border-color: transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; backdrop-filter: blur(22px) saturate(1.18); -webkit-backdrop-filter: blur(22px) saturate(1.18); box-shadow: 0 18px 60px color-mix(in srgb, var(--pg-primary) 9%, transparent), inset 0 1px 0 var(--pg-space-highlight); } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card) { position: relative; background: linear-gradient(145deg, rgba(255, 255, 255, 0.62), color-mix(in srgb, var(--pg-primary) 8%, rgba(255,255,255,.5)), color-mix(in srgb, var(--pg-space-mint) 7%, rgba(255,255,255,.48))) padding-box, linear-gradient(145deg, rgba(255, 255, 255, 0.74), color-mix(in srgb, var(--pg-primary) 30%, transparent), color-mix(in srgb, var(--pg-space-mint) 22%, transparent), var(--pg-space-mint-soft)) border-box !important; border: 1px solid transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; backdrop-filter: blur(18px) saturate(1.16); -webkit-backdrop-filter: blur(18px) saturate(1.16); box-shadow: 0 18px 48px color-mix(in srgb, var(--pg-dark) 7%, transparent), 0 14px 44px var(--pg-space-shadow-a), inset 0 1px 0 var(--pg-space-highlight), inset 0 -1px 0 color-mix(in srgb, var(--pg-space-mint) 9%, transparent) !important; transform-style: preserve-3d; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card)::before { content: ""; position: absolute; inset: 1px; border-radius: inherit; pointer-events: none; background: linear-gradient(150deg, rgba(255, 255, 255, 0.55), transparent 32%), radial-gradient(circle at 18% 0%, color-mix(in srgb, var(--pg-primary) 12%, transparent), transparent 42%), radial-gradient(circle at 92% 12%, color-mix(in srgb, var(--pg-space-mint) 8%, transparent), transparent 36%); opacity: 0.62; mix-blend-mode: screen; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card)::before { opacity: 0.24; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card) { background: linear-gradient(145deg, rgba(18, 48, 86, 0.66), rgba(16, 38, 69, 0.54)) padding-box, linear-gradient(145deg, rgba(178, 230, 255, 0.22), color-mix(in srgb, var(--pg-primary) 26%, transparent), color-mix(in srgb, var(--pg-secondary) 18%, transparent), var(--pg-space-mint-soft)) border-box !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-search-card, .pg-author-item, .pg-event-item, .pg-highlight-card) { transition: transform 0.28s cubic-bezier(0.22, 1, 0.36, 1), box-shadow 0.28s ease, filter 0.28s ease !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-search-card, .pg-author-item, .pg-event-item, .pg-highlight-card):hover { transform: translateY(-5px) perspective(900px) rotateX(1deg) !important; filter: saturate(1.04); box-shadow: 0 24px 70px color-mix(in srgb, var(--pg-dark) 9%, transparent), 0 18px 54px var(--pg-space-shadow-a), 0 8px 28px var(--pg-space-shadow-b), inset 0 1px 0 var(--pg-space-highlight) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-news-card__img, .pg-highlight-img, .pg-event-card__img, .pg-card-post [style*="aspect-ratio: 16/9"], .pg-service-card__img-wrap, .pg-featured-event__image) { border-bottom: 1px solid color-mix(in srgb, var(--pg-primary) 14%, transparent); box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.44); } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-news-card__cat, .pg-highlight-cat, .pg-event-tag, .pg-author-stat, .pg-single-cat, .pg-newsroom-tab, .pg-hub-tab-btn) { background: color-mix(in srgb, var(--pg-primary) 10%, rgba(255, 255, 255, 0.54)) !important; border: 1px solid color-mix(in srgb, var(--pg-primary) 18%, transparent); box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.46); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-news-card__cat, .pg-highlight-cat, .pg-event-tag, .pg-author-stat, .pg-single-cat, .pg-newsroom-tab, .pg-hub-tab-btn) { background: rgba(16, 38, 69, 0.72) !important; border-color: color-mix(in srgb, var(--pg-primary) 20%, transparent); } @keyframes pgPastelSpaceDrift { from { transform: translate3d(-1.6rem, -0.8rem, 0) scale(1); } to { transform: translate3d(1.2rem, 1rem, 0) scale(1.04); } } @keyframes pgSpaceSheen { from { background-position: 0% 0%, 0 0, 0 0, 0 0; } to { background-position: 100% 100%, 4rem 3rem, -3rem 4rem, 2rem -3rem; } } @media (prefers-reduced-motion: reduce) { body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::before, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { animation: none !important; } } @media (max-width: 767px) { body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) { background-attachment: scroll, scroll, scroll, scroll, scroll !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card) { backdrop-filter: blur(14px) saturate(1.12); -webkit-backdrop-filter: blur(14px) saturate(1.12); box-shadow: 0 12px 34px color-mix(in srgb, var(--pg-dark) 6%, transparent), 0 8px 24px var(--pg-space-shadow-a), inset 0 1px 0 var(--pg-space-highlight) !important; } } /* Clear, responsive interaction states for tabs and navigation. */ body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-site-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-drawer) { backdrop-filter: blur(14px) saturate(1.1) !important; -webkit-backdrop-filter: blur(14px) saturate(1.1) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card) { backdrop-filter: blur(10px) saturate(1.08) !important; -webkit-backdrop-filter: blur(10px) saturate(1.08) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-newsroom-tab, .pg-hub-tab-btn, .pg-category-tabs > *, .pg-filter-tabs > *, .pg-tabs > *) { color: #071426 !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.92), rgba(231, 252, 255, 0.9)) padding-box, linear-gradient(135deg, rgba(0, 164, 204, 0.32), color-mix(in srgb, var(--pg-secondary) 28%, transparent)) border-box !important; border: 1px solid transparent !important; box-shadow: 0 8px 18px rgba(7, 20, 38, 0.06), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important; opacity: 1 !important; text-shadow: none !important; transition: transform 0.16s cubic-bezier(0.22, 1, 0.36, 1), background 0.16s ease, box-shadow 0.16s ease, color 0.16s ease !important; will-change: transform; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-newsroom-tab:hover, .pg-hub-tab-btn:hover, .pg-category-tabs > *:hover, .pg-filter-tabs > *:hover, .pg-tabs > *:hover) { color: #052032 !important; background: linear-gradient(180deg, rgba(255, 255, 255, 0.98), rgba(218, 250, 255, 0.96)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 58%, transparent), color-mix(in srgb, var(--pg-secondary) 42%, transparent), color-mix(in srgb, var(--pg-highlight-mid) 12%, transparent)) border-box !important; transform: translateY(-2px) !important; box-shadow: 0 12px 28px rgba(0, 164, 204, 0.13), inset 0 1px 0 rgba(255, 255, 255, 0.82) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-newsroom-tab.is-active, .pg-newsroom-tab[aria-current="true"], .pg-hub-tab-btn.is-active, .pg-category-tabs > .is-active, .pg-filter-tabs > .is-active, .pg-tabs > .is-active) { color: #ffffff !important; background: var(--pg-action-gradient) !important; border-color: transparent !important; box-shadow: 0 14px 32px rgba(0, 164, 204, 0.2), 0 6px 18px color-mix(in srgb, var(--pg-secondary) 16%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.86) !important; transform: translateY(-1px) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) .pg-tab-progress { height: 3px !important; background: linear-gradient(90deg, #00a3cc 0%, var(--pg-primary) 45%, var(--pg-secondary) 100%) !important; box-shadow: 0 0 14px color-mix(in srgb, var(--pg-primary) 38%, transparent) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) .pg-main-nav a { color: #071426 !important; transition: transform 0.16s cubic-bezier(0.22, 1, 0.36, 1), color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) .pg-main-nav a:hover, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) .pg-main-nav li.current-menu-item > a, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) .pg-main-nav li.current_page_item > a { color: #031725 !important; background: linear-gradient(135deg, rgba(255, 255, 255, 0.96), rgba(228, 252, 255, 0.92)) padding-box, linear-gradient(135deg, var(--pg-primary), var(--pg-secondary), color-mix(in srgb, var(--pg-highlight-mid) 18%, transparent)) border-box !important; border-color: transparent !important; box-shadow: 0 10px 26px rgba(0, 164, 204, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important; transform: translateY(-2px) !important; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-newsroom-tab, .pg-hub-tab-btn, .pg-category-tabs > *, .pg-filter-tabs > *, .pg-tabs > *) { color: rgba(236, 253, 255, 0.92) !important; background: linear-gradient(180deg, rgba(16, 38, 69, 0.9), rgba(11, 29, 53, 0.86)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 34%, transparent), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-newsroom-tab.is-active, .pg-newsroom-tab[aria-current="true"], .pg-hub-tab-btn.is-active, .pg-category-tabs > .is-active, .pg-filter-tabs > .is-active, .pg-tabs > .is-active) { color: #ffffff !important; background: var(--pg-action-gradient) !important; } /* Global header upgrade: dark tech glass capsule inspired by the supplied reference. */ .pg-site-header { --pg-header-shell: rgba(255, 255, 255, 0.82); --pg-header-shell-soft: rgba(235, 252, 255, 0.72); --pg-header-line: rgba(0, 164, 204, 0.26); --pg-header-text: rgba(7, 20, 38, 0.78); --pg-header-text-strong: #071426; --pg-header-glow: color-mix(in srgb, var(--pg-primary) 22%, transparent); /* Keep the global navigation attached to the viewport. Some page templates establish their own scrolling context, where `sticky` can scroll away. */ position: fixed !important; /* A fixed header must not keep an additional flex slot in the document. Its dedicated spacer below is the only element that reserves its height. */ flex: 0 0 0 !important; margin: 0 !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; z-index: 80 !important; padding: 5px 0 0.7rem !important; border: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body.pg-theme-dark .pg-site-header { --pg-header-shell: rgba(7, 20, 38, 0.82); --pg-header-shell-soft: rgba(11, 29, 53, 0.72); --pg-header-line: rgba(103, 232, 249, 0.28); --pg-header-text: rgba(231, 249, 255, 0.84); --pg-header-text-strong: #ffffff; --pg-header-glow: color-mix(in srgb, var(--pg-primary) 36%, transparent); } .pg-site-header::before { content: none !important; } body.admin-bar { /* JavaScript sets this only when the WordPress toolbar is visible. Keeping the default at zero prevents a hidden toolbar from leaving a blank band above the mobile header. */ --pg-admin-bar-offset: 0px; } body.admin-bar .pg-site-header { /* The toolbar itself is fixed. Anchor the capsule immediately beneath it, without adding its height again as header padding. */ top: var(--pg-admin-bar-offset, 0px) !important; padding-top: 5px !important; } /* The header is fixed, so retain only its compact visual height in document flow. This prevents page titles and hero content from sitting under it. */ .pg-site-header-spacer { height: 5rem; /* The fixed header's outer padding remains in the flex flow. Cancel that duplicate 1.2rem reservation so this spacer starts at the viewport top. */ margin-bottom: -1.2rem; } .pg-site-header__inner { max-width: min(var(--pg-container), calc(100vw - (var(--pg-page-gutter) * 2))) !important; min-height: 4rem !important; padding: 0.48rem 0.72rem !important; border: 1px solid transparent !important; border-radius: 1.05rem !important; background: linear-gradient(135deg, var(--pg-header-shell), var(--pg-header-shell-soft)) padding-box, linear-gradient(135deg, rgba(125, 211, 252, 0.34), rgba(255, 255, 255, 0.12), color-mix(in srgb, var(--pg-primary) 30%, transparent)) border-box !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; box-shadow: 0 18px 48px color-mix(in srgb, var(--pg-header-text-strong) 12%, transparent), 0 0 28px var(--pg-header-glow), inset 0 1px 0 rgba(255, 255, 255, 0.64), inset 0 -1px 0 color-mix(in srgb, var(--pg-header-line) 55%, transparent) !important; backdrop-filter: blur(18px) saturate(1.18) !important; -webkit-backdrop-filter: blur(18px) saturate(1.18) !important; overflow: visible; } /* Align the desktop header capsule with the shared page/footer canvas. Mobile keeps its dedicated safe-area rules below. */ @media (min-width: 768px) { .pg-site-header { padding-left: 0 !important; padding-right: 0 !important; } body.admin-bar .pg-site-header { padding-top: 5px !important; } } .pg-site-header__inner::after { content: ""; position: absolute; inset: auto 1.5rem -1px; height: 1px; pointer-events: none; background: linear-gradient(90deg, transparent, color-mix(in srgb, var(--pg-primary) 56%, transparent), color-mix(in srgb, var(--pg-secondary) 36%, transparent), transparent); opacity: 0.86; } .pg-site-header__left, .pg-site-header__right, .pg-site-header__center { position: relative; z-index: 1; } .pg-logo-link { gap: 0.58rem !important; min-width: max-content; } .pg-logo-img, .pg-logo-icon { width: 2.45rem !important; height: 2.45rem !important; border-radius: 0.68rem !important; background: radial-gradient(circle at 35% 20%, color-mix(in srgb, var(--pg-secondary) 38%, transparent), transparent 48%), color-mix(in srgb, var(--pg-header-shell) 88%, var(--pg-header-text-strong) 12%) !important; box-shadow: 0 0 0 1px rgba(103, 232, 249, 0.22), 0 0 22px color-mix(in srgb, var(--pg-primary) 24%, transparent) !important; } .pg-logo-title { font-size: clamp(1rem, 1.6vw, 1.18rem) !important; letter-spacing: 0 !important; text-transform: none !important; background: linear-gradient(90deg, #67e8f9 0%, var(--pg-primary) 42%, var(--pg-secondary) 78%, #bdf8e9 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; text-shadow: 0 0 18px color-mix(in srgb, var(--pg-primary) 18%, transparent); } .pg-logo-desc { display: none !important; } .pg-site-header__center { padding-inline: clamp(0.75rem, 2vw, 1.75rem) !important; } .pg-main-nav { gap: clamp(0.15rem, 0.6vw, 0.55rem) !important; } .pg-main-nav li:not(:last-child)::after { display: none !important; } .pg-main-nav a { position: relative !important; padding: 0.68rem clamp(0.62rem, 1.1vw, 1rem) !important; border: 0 !important; border-radius: 0.8rem !important; clip-path: none !important; color: var(--pg-header-text) !important; background: transparent !important; font-size: clamp(0.76rem, 0.85vw, 0.88rem) !important; font-weight: 700 !important; line-height: 1 !important; text-shadow: 0 0 12px color-mix(in srgb, var(--pg-primary) 8%, transparent); transition: color 0.16s ease, transform 0.16s ease, background 0.16s ease, text-shadow 0.16s ease !important; } .pg-main-nav a::after { content: ""; position: absolute; left: 50%; right: auto; bottom: 0.08rem; width: 1.8rem; height: 3px; border-radius: 999px; background: linear-gradient(90deg, transparent, var(--pg-primary), var(--pg-secondary), transparent); box-shadow: 0 0 18px color-mix(in srgb, var(--pg-primary) 66%, transparent); opacity: 0; transform: translateX(-50%) scaleX(0.55); transition: opacity 0.18s ease, transform 0.18s ease; } .pg-main-nav a:hover, .pg-main-nav li.current-menu-item > a, .pg-main-nav li.current_page_item > a { color: var(--pg-header-text-strong) !important; background: rgba(103, 232, 249, 0.08) !important; box-shadow: none !important; transform: translateY(-1px) !important; text-shadow: 0 0 16px color-mix(in srgb, var(--pg-primary) 26%, transparent); } .pg-main-nav a:hover::after, .pg-main-nav li.current-menu-item > a::after, .pg-main-nav li.current_page_item > a::after { opacity: 1; transform: translateX(-50%) scaleX(1); } .pg-site-header__right { gap: 0.62rem !important; } .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), .pg-site-header .pg-header-action--reader { width: 2.55rem !important; min-width: 2.55rem !important; height: 2.55rem !important; border-radius: 0.82rem !important; clip-path: none !important; color: var(--pg-header-text) !important; background: linear-gradient(135deg, color-mix(in srgb, var(--pg-header-shell) 82%, #ffffff 18%), color-mix(in srgb, var(--pg-header-shell-soft) 88%, #ffffff 12%)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-header-line) 88%, transparent), rgba(255, 255, 255, 0.22)) border-box !important; border: 1px solid transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; transition: transform 0.16s ease, color 0.16s ease, background 0.16s ease, box-shadow 0.16s ease !important; } .pg-site-header .pg-btn-icon:not(.pg-header-action--primary):hover, .pg-site-header .pg-btn-icon[aria-expanded="true"]:not(.pg-header-action--primary), .pg-site-header .pg-theme-toggle[aria-pressed="true"], .pg-site-header .pg-header-action--reader:hover { color: var(--pg-header-text-strong) !important; background: linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 18%, var(--pg-header-shell)), color-mix(in srgb, var(--pg-space-mint, var(--pg-secondary)) 10%, var(--pg-header-shell-soft))) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 62%, transparent), color-mix(in srgb, var(--pg-secondary) 32%, transparent)) border-box !important; box-shadow: 0 0 22px color-mix(in srgb, var(--pg-primary) 22%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.18) !important; transform: translateY(-1px) !important; } .pg-site-header .pg-header-action--primary:not(.pg-header-action--reader) { width: auto !important; min-width: 0 !important; height: 2.55rem !important; padding: 0 1.05rem !important; gap: 0.48rem !important; border-radius: 999px !important; clip-path: none !important; color: #ffffff !important; background: linear-gradient(135deg, var(--pg-primary) 0%, var(--pg-highlight-mid) 58%, var(--pg-secondary) 100%) padding-box, linear-gradient(135deg, rgba(255, 255, 255, 0.68), color-mix(in srgb, var(--pg-primary) 50%, transparent)) border-box !important; border: 1px solid transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; box-shadow: 0 0 0 1px rgba(103, 232, 249, 0.14), 0 12px 28px rgba(0, 117, 255, 0.34), inset 0 1px 0 rgba(255, 255, 255, 0.36) !important; font-size: 0.82rem !important; font-weight: 800 !important; white-space: nowrap; transition: transform 0.16s ease, box-shadow 0.16s ease, filter 0.16s ease !important; } .pg-site-header .pg-header-action--primary:not(.pg-header-action--reader) > svg:first-child { display: none !important; } .pg-site-header .pg-header-action--primary:not(.pg-header-action--reader):hover { filter: saturate(1.08); transform: translateY(-2px) !important; box-shadow: 0 0 0 1px rgba(103, 232, 249, 0.18), 0 16px 34px rgba(0, 117, 255, 0.42), 0 0 28px color-mix(in srgb, var(--pg-primary) 26%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.42) !important; } .pg-header-action__label, .pg-header-action__arrow { display: inline-flex; } .pg-header-action__arrow { transition: transform 0.16s ease; } .pg-site-header .pg-header-action--primary:hover .pg-header-action__arrow { transform: translateX(2px); } /* Signed-in account action: a branded, role-aware entrance to PsyGuild. */ .pg-header-account { position: relative; z-index: 24; } .pg-header-account__toggle { cursor: pointer; } .pg-header-account__avatar, .pg-header-account__menu-avatar { display: block; flex: 0 0 auto; object-fit: cover; border-radius: 999px; background: rgba(255, 255, 255, 0.92); } .pg-header-account__avatar { width: 1.75rem; height: 1.75rem; margin-left: -0.62rem; border: 2px solid rgba(255, 255, 255, 0.82); box-shadow: 0 3px 10px rgba(3, 33, 62, 0.2); } .pg-header-account__label { display: inline-flex; line-height: 1; } .pg-header-account__chevron { flex: 0 0 auto; transition: transform 0.18s ease; } .pg-header-account__toggle[aria-expanded="true"] .pg-header-account__chevron { transform: rotate(180deg); } .pg-header-account__menu { position: absolute; top: calc(100% + 0.7rem); right: 0; width: min(18rem, calc(100vw - 1.25rem)); padding: 0.72rem; color: var(--pg-dark); background: #f8fdff; background-image: none; border: 1px solid #8edff0; border-radius: 1rem; box-shadow: 0 24px 52px rgba(4, 37, 65, 0.3), 0 0 0 1px rgba(255, 255, 255, 0.92) inset; backdrop-filter: none; -webkit-backdrop-filter: none; isolation: isolate; } .pg-header-account__identity { display: flex; align-items: center; gap: 0.7rem; padding: 0.35rem 0.38rem 0.58rem; } .pg-header-account__menu-avatar { width: 2.75rem; height: 2.75rem; border: 2px solid color-mix(in srgb, var(--pg-primary) 52%, #ffffff 48%); } .pg-header-account__identity div { min-width: 0; } .pg-header-account__identity strong, .pg-header-account__identity span { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pg-header-account__identity strong { font-size: 0.86rem; color: var(--pg-dark); } .pg-header-account__identity span { margin-top: 0.16rem; font-size: 0.7rem; color: var(--pg-muted); } .pg-header-account__brand { margin: 0 0.35rem 0.45rem; padding-top: 0.52rem; border-top: 1px solid var(--pg-border); color: var(--pg-link); font-size: 0.65rem; font-weight: 900; letter-spacing: 0.12em; text-transform: uppercase; } .pg-header-account__links { display: grid; gap: 0.18rem; } .pg-header-account__links a, .pg-header-account__logout { display: flex; align-items: center; gap: 0.62rem; min-height: 2.38rem; padding: 0.52rem 0.64rem; border-radius: 0.62rem; color: var(--pg-dark) !important; font-size: 0.76rem; font-weight: 750; text-decoration: none; transition: color 0.16s ease, background 0.16s ease, transform 0.16s ease; } .pg-header-account__links a span { width: 1rem; color: var(--pg-link); text-align: center; } .pg-header-account__links a:hover, .pg-header-account__links a:focus-visible { color: var(--pg-link) !important; background: color-mix(in srgb, var(--pg-primary) 10%, transparent); transform: translateX(2px); } .pg-header-account__logout { justify-content: center; margin-top: 0.48rem; border-top: 1px solid var(--pg-border); border-radius: 0 0 0.62rem 0.62rem; color: #c62828 !important; } .pg-header-account__logout:hover, .pg-header-account__logout:focus-visible { background: rgba(198, 40, 40, 0.08); } body.pg-theme-dark .pg-header-account__menu { color: #e7f9ff; background: #0d2b48; background-image: none; border-color: #20789b; box-shadow: 0 24px 56px rgba(0, 0, 0, 0.38), inset 0 1px 0 rgba(255, 255, 255, 0.1); } body.pg-theme-dark .pg-header-account__identity strong, body.pg-theme-dark .pg-header-account__links a { color: #e7f9ff !important; } body.pg-theme-dark .pg-header-account__identity span { color: rgba(218, 242, 249, 0.68); } body.pg-theme-dark .pg-header-account__brand { color: #67e8f9; border-color: rgba(103, 232, 249, 0.18); } @media (max-width: 767px) { .pg-header-account__toggle { width: 2rem !important; min-width: 2rem !important; height: 2rem !important; padding: 0 !important; justify-content: center !important; } .pg-header-account__avatar { width: 1.72rem; height: 1.72rem; margin: 0; } .pg-header-account__label, .pg-header-account__chevron { display: none; } .pg-header-account__menu { position: fixed; top: calc(var(--pg-admin-bar-offset, 0px) + 3.55rem); right: 0.62rem; } } .pg-search-dropdown { top: calc(100% + 0.75rem) !important; background: linear-gradient(145deg, color-mix(in srgb, var(--pg-header-shell) 94%, #ffffff 6%), color-mix(in srgb, var(--pg-header-shell-soft) 94%, #ffffff 6%)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 32%, transparent), color-mix(in srgb, var(--pg-secondary) 18%, transparent)) border-box !important; border: 1px solid transparent !important; color: var(--pg-header-text-strong) !important; backdrop-filter: blur(18px) saturate(1.15) !important; -webkit-backdrop-filter: blur(18px) saturate(1.15) !important; } .pg-search-form { background: color-mix(in srgb, var(--pg-header-shell) 72%, transparent) !important; border-color: var(--pg-header-line) !important; color: var(--pg-header-text-strong) !important; } .pg-search-input { color: var(--pg-header-text-strong) !important; } .pg-search-input::placeholder { color: color-mix(in srgb, var(--pg-header-text) 72%, transparent) !important; } @media (min-width: 1024px) { .pg-site-header .pg-container.pg-site-header__inner { width: calc(100% - (var(--pg-page-gutter) * 2)) !important; } } /* Header cascade guard for pages that have their own listing/home nav overrides. */ .pg-site-header .pg-main-nav a { color: var(--pg-header-text) !important; background: transparent !important; box-shadow: none !important; } .pg-site-header .pg-main-nav a:hover, .pg-site-header .pg-main-nav li.current-menu-item > a, .pg-site-header .pg-main-nav li.current_page_item > a { color: var(--pg-header-text-strong) !important; background: rgba(103, 232, 249, 0.08) !important; box-shadow: none !important; } .pg-site-header .pg-main-nav a:hover::after, .pg-site-header .pg-main-nav li.current-menu-item > a::after, .pg-site-header .pg-main-nav li.current_page_item > a::after { opacity: 1 !important; transform: translateX(-50%) scaleX(1) !important; } @media (max-width: 1023px) { .pg-site-header { padding-top: 0.25rem !important; padding-bottom: 0.35rem !important; } .pg-site-header__inner { min-height: 3.35rem !important; border-radius: 0.95rem !important; padding: 0.34rem 0.5rem !important; } .pg-logo-img, .pg-logo-icon { width: 2.35rem !important; height: 2.35rem !important; } .pg-logo-title { font-size: 1rem !important; } .pg-site-header__right { gap: 0.45rem !important; } } @media (max-width: 767px) { .pg-site-header { padding: 0.12rem 0.45rem 0.28rem !important; } .pg-site-header__inner { max-width: calc(100vw - 1rem) !important; min-height: 3.05rem !important; padding: 0.28rem 0.42rem !important; } .pg-logo-text { max-width: 38vw; } .pg-logo-title { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), .pg-site-header .pg-header-action--reader { width: 2.25rem !important; min-width: 2.25rem !important; height: 2.25rem !important; } } /* Dark theme background: PsyGuild cosmic mindscape, applied to theme and portal. */ body.pg-theme-dark:not(.pg-book-reader-active) { --pg-cosmic-deep: #020817; --pg-cosmic-main: #071426; --pg-cosmic-blue: #0b2b66; --pg-cosmic-cyan: var(--pg-primary); --pg-cosmic-mint: var(--pg-secondary); --pg-cosmic-blue-soft: color-mix(in srgb, var(--pg-highlight-mid) 18%, transparent); --pg-color-page: var(--pg-cosmic-deep); --pg-bg: var(--pg-cosmic-deep); --pg-bg-soft: rgba(8, 31, 68, 0.72); --pg-section-bg: rgba(8, 31, 68, 0.52); --pg-block-bg: rgba(7, 20, 38, 0.72); --pg-surface: rgba(7, 20, 38, 0.72); --pg-surface-strong: rgba(11, 29, 53, 0.86); --pg-border: rgba(103, 232, 249, 0.18); --pg-border-strong: rgba(103, 232, 249, 0.3); background-color: var(--pg-cosmic-deep) !important; background-image: radial-gradient(circle at 76% 18%, color-mix(in srgb, var(--pg-primary) 24%, transparent) 0 0.12rem, transparent 0.24rem), radial-gradient(circle at 9% 12%, rgba(125, 211, 252, 0.6) 0 1px, transparent 2px), radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.34) 0 1px, transparent 2px), radial-gradient(circle at 68% 30%, color-mix(in srgb, var(--pg-secondary) 42%, transparent) 0 1px, transparent 2px), radial-gradient(circle at 86% 13%, rgba(255, 255, 255, 0.46) 0 1px, transparent 2px), radial-gradient(ellipse at 82% 28%, rgba(0, 132, 255, 0.3) 0 7rem, transparent 24rem), radial-gradient(ellipse at 88% 48%, color-mix(in srgb, var(--pg-primary) 18%, transparent) 0 6rem, transparent 23rem), radial-gradient(ellipse at 52% 92%, color-mix(in srgb, var(--pg-primary) 16%, transparent) 0 4rem, transparent 18rem), linear-gradient(164deg, transparent 0 58%, color-mix(in srgb, var(--pg-primary) 9%, transparent) 59%, transparent 63%), linear-gradient(172deg, transparent 0 66%, color-mix(in srgb, var(--pg-secondary) 7%, transparent) 67%, transparent 71%), linear-gradient(180deg, #020817 0%, #061433 42%, #021026 72%, #020817 100%) !important; background-size: auto, 17rem 17rem, 23rem 23rem, 31rem 31rem, 41rem 41rem, auto, auto, auto, auto, auto, auto !important; background-position: center, 0 0, 2rem 3rem, -3rem 4rem, 5rem -2rem, center, center, center, center, center, center !important; background-attachment: fixed !important; } body.pg-theme-dark:not(.pg-book-reader-active)::before, body.pg-theme-dark:not(.pg-book-reader-active)::after { content: none !important; } body.pg-theme-dark:not(.pg-book-reader-active)::before { background-image: radial-gradient(circle at 7% 7%, rgba(125, 211, 252, 0.7) 0 1px, transparent 2px), radial-gradient(circle at 19% 19%, rgba(255, 255, 255, 0.48) 0 1px, transparent 2px), radial-gradient(circle at 34% 11%, color-mix(in srgb, var(--pg-primary) 52%, transparent) 0 1px, transparent 2px), radial-gradient(circle at 56% 8%, rgba(255, 255, 255, 0.42) 0 1px, transparent 2px), radial-gradient(circle at 68% 33%, color-mix(in srgb, var(--pg-secondary) 60%, transparent) 0 1px, transparent 2px), radial-gradient(circle at 88% 14%, rgba(255, 255, 255, 0.56) 0 1px, transparent 2px), radial-gradient(circle at 12% 70%, color-mix(in srgb, var(--pg-primary) 42%, transparent) 0 1px, transparent 2px), radial-gradient(circle at 82% 78%, rgba(125, 211, 252, 0.48) 0 1px, transparent 2px), linear-gradient(108deg, transparent 0 52%, color-mix(in srgb, var(--pg-primary) 8%, transparent) 54%, transparent 59%), linear-gradient(156deg, transparent 0 63%, color-mix(in srgb, var(--pg-secondary) 8%, transparent) 65%, transparent 70%); background-size: 17rem 17rem, 23rem 23rem, 29rem 29rem, 31rem 31rem, 37rem 37rem, 41rem 41rem, 19rem 19rem, 27rem 27rem, 100% 100%, 100% 100%; opacity: 0.72; animation: pgCosmicStarsDrift 34s linear infinite; } body.pg-theme-dark:not(.pg-book-reader-active)::after { background: radial-gradient(ellipse at 82% 30%, color-mix(in srgb, var(--pg-primary) 22%, transparent) 0 9rem, transparent 26rem), radial-gradient(ellipse at 88% 46%, color-mix(in srgb, var(--pg-secondary) 14%, transparent) 0 6rem, transparent 20rem), radial-gradient(ellipse at 55% 96%, color-mix(in srgb, var(--pg-primary) 26%, transparent) 0 3rem, transparent 16rem), linear-gradient(169deg, transparent 0 57%, color-mix(in srgb, var(--pg-primary) 12%, transparent) 58%, transparent 62%), linear-gradient(174deg, transparent 0 65%, color-mix(in srgb, var(--pg-secondary) 10%, transparent) 66%, transparent 70%); filter: saturate(1.22); opacity: 0.92; } body.pg-theme-dark:not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-home-side-card, .pg-event-item, .pg-author-item, .pg-highlight-card, .pg-comments-area, .pg-single-sidebar, .pg-portal-card, .pg-portal-filterbar, .pg-portal-sidebar) { background: linear-gradient(145deg, rgba(11, 29, 53, 0.82), rgba(7, 20, 38, 0.7)) padding-box, linear-gradient(145deg, rgba(103, 232, 249, 0.24), color-mix(in srgb, var(--pg-primary) 16%, transparent), color-mix(in srgb, var(--pg-secondary) 10%, transparent)) border-box !important; border-color: transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; box-shadow: 0 18px 56px rgba(0, 0, 0, 0.28), 0 0 30px color-mix(in srgb, var(--pg-primary) 9%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important; backdrop-filter: blur(14px) saturate(1.12); -webkit-backdrop-filter: blur(14px) saturate(1.12); } body.pg-theme-dark:not(.pg-book-reader-active) :where(.pg-portal, .pg-portal-main) { background: transparent !important; } body.pg-theme-dark:not(.pg-book-reader-active) :where(.pg-portal-nav-item, .pg-sidebar-link, .pg-btn-soft, .pg-portal-toggle) { color: rgba(231, 249, 255, 0.82) !important; background: rgba(11, 29, 53, 0.46) !important; border-color: rgba(103, 232, 249, 0.16) !important; } body.pg-theme-dark:not(.pg-book-reader-active) :where(.pg-portal-nav-item:hover, .pg-portal-nav-item.is-active, .pg-sidebar-link:hover, .pg-sidebar-menu li.current-menu-item > a, .pg-portal-toggle:hover) { color: #ffffff !important; background: color-mix(in srgb, var(--pg-primary) 12%, transparent) !important; border-color: color-mix(in srgb, var(--pg-primary) 42%, transparent) !important; box-shadow: 0 0 22px color-mix(in srgb, var(--pg-primary) 12%, transparent) !important; } @keyframes pgCosmicStarsDrift { from { background-position: 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0, 0 0; } to { background-position: 7rem 4rem, -5rem 6rem, 4rem -8rem, -9rem -4rem, 8rem 5rem, -6rem 7rem, 5rem -3rem, -4rem 5rem, 0 0, 0 0; } } @media (max-width: 767px) { body.pg-theme-dark:not(.pg-book-reader-active) { background-attachment: scroll !important; } body.pg-theme-dark:not(.pg-book-reader-active)::before { animation: none; opacity: 0.5; } body.pg-theme-dark:not(.pg-book-reader-active)::after { opacity: 0.66; } } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors, .page-template-page-author-portal):not(.single-post):not(.pg-book-reader-active) { background-color: var(--pg-cosmic-deep) !important; background-image: radial-gradient(circle at 76% 18%, color-mix(in srgb, var(--pg-primary) 24%, transparent) 0 0.12rem, transparent 0.24rem), radial-gradient(circle at 9% 12%, rgba(125, 211, 252, 0.6) 0 1px, transparent 2px), radial-gradient(circle at 28% 22%, rgba(255, 255, 255, 0.34) 0 1px, transparent 2px), radial-gradient(circle at 68% 30%, color-mix(in srgb, var(--pg-secondary) 42%, transparent) 0 1px, transparent 2px), radial-gradient(circle at 86% 13%, rgba(255, 255, 255, 0.46) 0 1px, transparent 2px), radial-gradient(ellipse at 82% 28%, rgba(0, 132, 255, 0.3) 0 7rem, transparent 24rem), radial-gradient(ellipse at 88% 48%, color-mix(in srgb, var(--pg-primary) 18%, transparent) 0 6rem, transparent 23rem), radial-gradient(ellipse at 52% 92%, color-mix(in srgb, var(--pg-primary) 16%, transparent) 0 4rem, transparent 18rem), linear-gradient(164deg, transparent 0 58%, color-mix(in srgb, var(--pg-primary) 9%, transparent) 59%, transparent 63%), linear-gradient(172deg, transparent 0 66%, color-mix(in srgb, var(--pg-secondary) 7%, transparent) 67%, transparent 71%), linear-gradient(180deg, #020817 0%, #061433 42%, #021026 72%, #020817 100%) !important; background-attachment: fixed !important; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors, .page-template-page-author-portal):not(.single-post):not(.pg-book-reader-active)::before { content: none !important; } body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors, .page-template-page-author-portal):not(.single-post):not(.pg-book-reader-active)::after { content: none !important; } @media (max-width: 767px) { body.pg-theme-dark:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors, .page-template-page-author-portal):not(.single-post):not(.pg-book-reader-active) { background-attachment: scroll !important; } } /* Visual repair pass for header, top tabs, and first-screen hierarchy. */ :root { --pg-role-bg-light: #f7fcff; --pg-role-bg-glow: color-mix(in srgb, var(--pg-primary) 14%, transparent); --pg-role-accent: var(--pg-primary); --pg-role-accent-strong: #00a3cc; --pg-role-heal: var(--pg-secondary); --pg-role-mint-whisper: color-mix(in srgb, var(--pg-secondary) 8%, transparent); --pg-role-cta: linear-gradient(135deg, var(--pg-primary) 0%, var(--pg-highlight-mid) 68%, var(--pg-secondary) 100%); --pg-role-active: linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 18%, transparent), color-mix(in srgb, var(--pg-secondary) 12%, transparent)); } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) { background-color: var(--pg-role-bg-light) !important; background-image: radial-gradient(circle at 16% 9%, color-mix(in srgb, var(--pg-primary) 16%, transparent) 0 10rem, transparent 28rem), radial-gradient(circle at 84% 11%, color-mix(in srgb, var(--pg-secondary) 13%, transparent) 0 9rem, transparent 28rem), radial-gradient(circle at 64% 72%, var(--pg-role-mint-whisper) 0 11rem, transparent 34rem), radial-gradient(circle at 12% 60%, rgba(103, 232, 249, 0.08) 0 8rem, transparent 28rem), linear-gradient(180deg, #fbfeff 0%, #f1fcff 38%, #f8fffc 100%) !important; background-attachment: fixed, fixed, scroll, scroll, scroll !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::before, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { content: none !important; } .pg-site-header { padding-bottom: 0.7rem !important; background: transparent !important; } .pg-site-header__inner { background: linear-gradient(135deg, color-mix(in srgb, var(--pg-header-shell) 94%, transparent), color-mix(in srgb, var(--pg-header-shell-soft) 92%, transparent)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 34%, transparent), rgba(255, 255, 255, 0.26), color-mix(in srgb, var(--pg-secondary) 18%, transparent)) border-box !important; box-shadow: 0 16px 40px color-mix(in srgb, var(--pg-header-text-strong) 10%, transparent), 0 0 22px color-mix(in srgb, var(--pg-role-accent) 18%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.46) !important; } @media (max-width: 767px) { .pg-site-header { padding: 0.12rem 0.45rem 0.28rem !important; } .pg-site-header__inner { min-height: 3.05rem !important; padding: 0.28rem 0.42rem !important; } } .pg-site-header .pg-main-nav { justify-content: center !important; } .pg-site-header .pg-main-nav a { color: color-mix(in srgb, var(--pg-header-text-strong) 76%, transparent) !important; font-weight: 760 !important; } .pg-site-header .pg-main-nav a:hover, .pg-site-header .pg-main-nav li.current-menu-item > a, .pg-site-header .pg-main-nav li.current_page_item > a, .pg-site-header .pg-main-nav a[aria-current="page"] { color: var(--pg-header-text-strong) !important; background: var(--pg-role-active) !important; text-shadow: 0 0 16px color-mix(in srgb, var(--pg-primary) 28%, transparent) !important; } .pg-site-header .pg-header-action--primary:not(.pg-header-action--reader) { background: var(--pg-role-cta) padding-box, linear-gradient(135deg, rgba(255, 255, 255, 0.7), color-mix(in srgb, var(--pg-primary) 44%, transparent)) border-box !important; } .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), .pg-site-header .pg-header-action--reader { box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.16), 0 8px 18px color-mix(in srgb, var(--pg-header-text-strong) 8%, transparent) !important; } .pg-logo-icon { width: 2.25rem !important; height: 2.25rem !important; border-radius: 0.72rem !important; } .pg-logo-title { font-weight: 900 !important; } .pg-logo-monogram { display: inline-flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: #dffcff; font-size: 0.78rem; font-weight: 900; letter-spacing: 0; text-shadow: 0 0 12px color-mix(in srgb, var(--pg-primary) 58%, transparent); } .pg-sub-header-wrapper { background: transparent !important; box-shadow: none !important; } .pg-sub-header { width: min(100%, 1100px); margin: 0.35rem auto 0 !important; background: linear-gradient(135deg, rgba(255, 255, 255, 0.68), rgba(235, 252, 255, 0.55)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 24%, transparent), color-mix(in srgb, var(--pg-secondary) 14%, transparent)) border-box !important; border: 1px solid transparent !important; box-shadow: 0 16px 38px rgba(0, 164, 204, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.52) !important; backdrop-filter: blur(16px) saturate(1.1); -webkit-backdrop-filter: blur(16px) saturate(1.1); } body.pg-theme-dark .pg-sub-header { background: linear-gradient(135deg, rgba(11, 29, 53, 0.76), rgba(7, 20, 38, 0.64)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 28%, transparent), color-mix(in srgb, var(--pg-secondary) 14%, transparent)) border-box !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.22), 0 0 24px color-mix(in srgb, var(--pg-primary) 8%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.08) !important; } /* The Knowledge Hub renders many cards. Cards outside the viewport can wait until readers scroll near them, while preserving a stable grid footprint. */ @supports (content-visibility: auto) { .pg-knowledge-grid > .pg-card-post { content-visibility: auto; contain-intrinsic-size: auto 430px; } .pg-hub-grid > .pg-hub-card { content-visibility: auto; contain-intrinsic-size: auto 390px; } .pg-authors-grid > .pg-author-directory-item { content-visibility: auto; contain-intrinsic-size: auto 400px; } } .pg-sub-nav a, .pg-knowledge-tab-btn, .pg-newsroom-tab, .pg-hub-tab-btn, .pg-category-tabs > *, .pg-filter-tabs > *, .pg-tabs > * { color: color-mix(in srgb, var(--pg-text) 80%, transparent) !important; background: transparent !important; border: 1px solid transparent !important; box-shadow: none !important; font-weight: 760 !important; } .pg-sub-nav a:hover, .pg-knowledge-tab-btn:hover:not(.is-active), .pg-newsroom-tab:hover, .pg-hub-tab-btn:hover, .pg-category-tabs > *:hover, .pg-filter-tabs > *:hover, .pg-tabs > *:hover { color: var(--pg-dark) !important; background: color-mix(in srgb, var(--pg-primary) 8%, transparent) !important; border-color: color-mix(in srgb, var(--pg-primary) 18%, transparent) !important; } .pg-sub-nav a.is-active, .pg-sub-nav li.current-menu-item > a, .pg-knowledge-tab-btn.is-active, .pg-newsroom-tab.is-active, .pg-newsroom-tab[aria-current="true"], .pg-hub-tab-btn.is-active, .pg-category-tabs > .is-active, .pg-filter-tabs > .is-active, .pg-tabs > .is-active { color: #ffffff !important; background: var(--pg-action-gradient) !important; border: 1px solid transparent !important; box-shadow: 0 10px 22px rgba(0, 164, 204, 0.12), inset 0 1px 0 rgba(255, 255, 255, 0.7) !important; } body.pg-theme-dark :where(.pg-sub-nav a, .pg-knowledge-tab-btn, .pg-newsroom-tab, .pg-hub-tab-btn, .pg-category-tabs > *, .pg-filter-tabs > *, .pg-tabs > *) { color: rgba(231, 249, 255, 0.76) !important; } body.pg-theme-dark :where(.pg-sub-nav a:hover, .pg-knowledge-tab-btn:hover:not(.is-active), .pg-newsroom-tab:hover, .pg-hub-tab-btn:hover, .pg-category-tabs > *:hover, .pg-filter-tabs > *:hover, .pg-tabs > *:hover) { color: #ffffff !important; background: color-mix(in srgb, var(--pg-primary) 10%, transparent) !important; border-color: color-mix(in srgb, var(--pg-primary) 28%, transparent) !important; } body.pg-theme-dark :where(.pg-sub-nav a.is-active, .pg-sub-nav li.current-menu-item > a, .pg-knowledge-tab-btn.is-active, .pg-newsroom-tab.is-active, .pg-newsroom-tab[aria-current="true"], .pg-hub-tab-btn.is-active, .pg-category-tabs > .is-active, .pg-filter-tabs > .is-active, .pg-tabs > .is-active) { color: #ffffff !important; background: var(--pg-action-gradient) !important; box-shadow: 0 10px 26px color-mix(in srgb, var(--pg-primary) 12%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; } .pg-tab-progress { background: linear-gradient(90deg, var(--pg-role-accent-strong), var(--pg-role-accent), var(--pg-role-heal)) !important; box-shadow: 0 0 12px color-mix(in srgb, var(--pg-primary) 32%, transparent) !important; } .pg-drag-scroll { scrollbar-color: var(--pg-role-accent) color-mix(in srgb, var(--pg-primary) 12%, transparent) !important; } .pg-drag-scroll::-webkit-scrollbar-track { background: linear-gradient(90deg, color-mix(in srgb, var(--pg-primary) 10%, transparent), color-mix(in srgb, var(--pg-secondary) 8%, transparent)) !important; } .pg-drag-scroll::-webkit-scrollbar-thumb { background: linear-gradient(90deg, var(--pg-role-accent), var(--pg-role-heal)) !important; } body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.single-post) :where(.pg-card, .pg-home-side-card, .pg-newsroom, .pg-service-card, .pg-news-card, .pg-highlight-card) { background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(239, 253, 255, 0.88)) padding-box, linear-gradient(145deg, color-mix(in srgb, var(--pg-primary) 22%, transparent), color-mix(in srgb, var(--pg-secondary) 12%, transparent)) border-box !important; } body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.single-post) .pg-hero-main { background: radial-gradient(circle at 24% 18%, color-mix(in srgb, var(--pg-primary) 22%, transparent), transparent 34%), linear-gradient(135deg, #09264a 0%, #0d4f78 52%, #07344b 100%) !important; box-shadow: 0 24px 60px rgba(0, 88, 132, 0.18), inset 0 1px 0 rgba(255, 255, 255, 0.12) !important; } .pg-event-item__meta, .pg-author-role, .pg-news-card__excerpt, .pg-service-card__excerpt, .pg-highlight-excerpt, .pg-side-header__subtitle { font-weight: 560 !important; } @media (max-width: 767px) { body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) { background-attachment: scroll !important; } .pg-sub-header { width: calc(100% - 1rem); } } /* Header tone synchronization: the outer header is always transparent. */ body .pg-site-header, body.pg-theme-dark .pg-site-header, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors, .page-template-page-author-portal) .pg-site-header { background: transparent !important; background-color: transparent !important; background-image: none !important; border-color: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body .pg-site-header__inner { background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(234, 251, 255, 0.78)) padding-box, linear-gradient(135deg, rgba(0, 164, 204, 0.42), rgba(103, 232, 249, 0.24), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; box-shadow: 0 14px 34px rgba(0, 92, 128, 0.12), 0 0 18px color-mix(in srgb, var(--pg-primary) 12%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; } body.pg-theme-dark .pg-site-header__inner { background: linear-gradient(135deg, rgba(7, 27, 54, 0.94), rgba(7, 20, 38, 0.9)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 72%, transparent), rgba(103, 232, 249, 0.3), color-mix(in srgb, var(--pg-secondary) 24%, transparent)) border-box !important; box-shadow: 0 16px 38px rgba(0, 0, 0, 0.32), 0 0 24px color-mix(in srgb, var(--pg-primary) 20%, transparent), inset 0 1px 0 rgba(186, 244, 255, 0.18), inset 0 -1px 0 color-mix(in srgb, var(--pg-primary) 14%, transparent) !important; } body .pg-site-header .pg-main-nav a { color: rgba(7, 20, 38, 0.84) !important; text-shadow: none !important; } body.pg-theme-dark .pg-site-header .pg-main-nav a { color: rgba(230, 248, 255, 0.88) !important; text-shadow: 0 0 10px color-mix(in srgb, var(--pg-primary) 10%, transparent) !important; } body .pg-site-header .pg-main-nav a:hover, body .pg-site-header .pg-main-nav li.current-menu-item > a, body .pg-site-header .pg-main-nav li.current_page_item > a, body .pg-site-header .pg-main-nav a[aria-current="page"] { color: #05263b !important; background: color-mix(in srgb, var(--pg-primary) 10%, transparent) !important; } body.pg-theme-dark .pg-site-header .pg-main-nav a:hover, body.pg-theme-dark .pg-site-header .pg-main-nav li.current-menu-item > a, body.pg-theme-dark .pg-site-header .pg-main-nav li.current_page_item > a, body.pg-theme-dark .pg-site-header .pg-main-nav a[aria-current="page"] { color: #ffffff !important; background: color-mix(in srgb, var(--pg-primary) 14%, transparent) !important; text-shadow: 0 0 16px color-mix(in srgb, var(--pg-primary) 40%, transparent) !important; } body.pg-theme-dark .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), body.pg-theme-dark .pg-site-header .pg-header-action--reader { color: rgba(231, 249, 255, 0.94) !important; background: linear-gradient(135deg, rgba(21, 59, 91, 0.88), rgba(11, 38, 69, 0.78)) padding-box, linear-gradient(135deg, rgba(103, 232, 249, 0.48), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16), inset 0 1px 0 rgba(255, 255, 255, 0.16) !important; } body.pg-theme-dark .pg-site-header .pg-btn-icon:not(.pg-header-action--primary):hover, body.pg-theme-dark .pg-site-header .pg-btn-icon[aria-expanded="true"]:not(.pg-header-action--primary), body.pg-theme-dark .pg-site-header .pg-theme-toggle[aria-pressed="true"], body.pg-theme-dark .pg-site-header .pg-header-action--reader:hover { color: #ffffff !important; background: linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 30%, transparent), color-mix(in srgb, var(--pg-secondary) 16%, transparent)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 78%, transparent), color-mix(in srgb, var(--pg-secondary) 40%, transparent)) border-box !important; box-shadow: 0 0 22px color-mix(in srgb, var(--pg-primary) 30%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.22) !important; } body.pg-theme-dark .pg-logo-title { background: linear-gradient(90deg, #dffcff 0%, #67e8f9 32%, var(--pg-primary) 66%, var(--pg-secondary) 100%) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; text-shadow: 0 0 18px color-mix(in srgb, var(--pg-primary) 28%, transparent); } /* Keep the light header shell visually separate without a tinted page-wide strip. */ body:not(.pg-theme-dark) .pg-site-header { background: transparent !important; background-color: transparent !important; background-image: none !important; border: 0 !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body:not(.pg-theme-dark) .pg-site-header__inner { box-shadow: 0 8px 22px rgba(0, 92, 128, 0.08), 0 0 10px color-mix(in srgb, var(--pg-primary) 8%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.78) !important; } /* Author profile posts are one joined surface: remove the stale split gap. */ .pg-author-page .pg-posts-tab-header { margin-bottom: 0 !important; } /* One action color system: all primary controls follow the header CTA. */ :root { --pg-brand-gradient: var(--pg-action-gradient); --pg-brand-gradient-hover: var(--pg-action-gradient-hover); --pg-gradient: var(--pg-action-gradient); --pg-gradient-hover: var(--pg-action-gradient-hover); --pg-role-cta: var(--pg-action-gradient); } :where( .pg-btn-primary, .pg-btn-dark, .pg-hero-btn-primary, .pg-service-card__btn, .pg-news-card__read-btn, .pg-sidebar-cta__btn, .pg-bottom-fab, .pg-scroll-top, .pg-author-social-link, .pg-portal-social-icon, .pg-header-action--primary:not(.pg-header-action--reader), .pg-filter-btn.is-active, .pg-author-tab.is-active, .pg-sub-nav a.is-active, .pg-sub-nav li.current-menu-item > a, .pg-knowledge-tab-btn.is-active, .pg-newsroom-tab.is-active, .pg-newsroom-tab[aria-current="true"], .pg-hub-tab-btn.is-active, .pg-category-tabs > .is-active, .pg-filter-tabs > .is-active, .pg-tabs > .is-active ) { color: #ffffff !important; background: var(--pg-action-gradient) !important; background-clip: border-box !important; background-origin: border-box !important; border-color: rgba(255, 255, 255, 0.34) !important; box-shadow: 0 10px 24px rgba(0, 164, 204, 0.2), 0 5px 16px color-mix(in srgb, var(--pg-highlight-mid) 14%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; } :where( .pg-btn-primary, .pg-btn-dark, .pg-hero-btn-primary, .pg-service-card__btn, .pg-news-card__read-btn, .pg-sidebar-cta__btn, .pg-bottom-fab, .pg-scroll-top, .pg-author-social-link, .pg-header-action--primary:not(.pg-header-action--reader), .pg-filter-btn.is-active, .pg-author-tab.is-active, .pg-sub-nav a.is-active, .pg-knowledge-tab-btn.is-active, .pg-newsroom-tab.is-active, .pg-hub-tab-btn.is-active, .pg-category-tabs > .is-active, .pg-filter-tabs > .is-active, .pg-tabs > .is-active ):hover { color: #ffffff !important; background: var(--pg-action-gradient-hover) !important; background-clip: border-box !important; background-origin: border-box !important; } /* Shared footer capsule: use the same glass language as the global header. */ .pg-site-footer { width: min(calc(100% - (var(--pg-page-gutter) * 2)), var(--pg-container)); margin: 10px auto !important; padding: 0 !important; overflow: hidden; border: 1px solid color-mix(in srgb, var(--pg-primary) 28%, transparent) !important; border-radius: 1.25rem; background: transparent !important; background-image: none !important; box-shadow: 0 18px 44px color-mix(in srgb, var(--pg-dark) 10%, transparent), 0 0 24px color-mix(in srgb, var(--pg-primary) 14%, transparent), inset 0 1px 0 color-mix(in srgb, var(--pg-color-white, #fff) 76%, transparent) !important; } .pg-site-footer__overlay { background: radial-gradient(circle at 14% 12%, color-mix(in srgb, var(--pg-primary) 8%, transparent), transparent 32%), radial-gradient(circle at 88% 90%, color-mix(in srgb, var(--pg-secondary) 7%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--pg-footer-bg) 96%, var(--pg-color-white, #fff) 4%), color-mix(in srgb, var(--pg-footer-bg) 94%, var(--pg-bg-soft) 6%)) !important; backdrop-filter: blur(18px) saturate(1.12) !important; -webkit-backdrop-filter: blur(18px) saturate(1.12) !important; } .pg-site-footer__inner { width: 100%; max-width: none; padding: clamp(1.6rem, 3vw, 2.4rem) var(--pg-page-gutter); } .pg-footer-grid { gap: clamp(1.5rem, 3vw, 2.5rem); } .pg-footer-heading { color: var(--pg-dark) !important; letter-spacing: 0.035em; } .pg-footer-nav a { color: color-mix(in srgb, var(--pg-text) 78%, transparent) !important; } .pg-footer-nav a:hover { color: var(--pg-link) !important; } .pg-social-icons { display: flex; flex-wrap: wrap; gap: 0.55rem; margin-top: 1rem; } .pg-social-link { display: inline-flex; align-items: center; justify-content: center; width: 2rem; height: 2rem; border: 1px solid color-mix(in srgb, var(--pg-primary) 20%, transparent); border-radius: 0.62rem; color: var(--pg-link); background: color-mix(in srgb, var(--pg-surface-strong) 74%, transparent); box-shadow: inset 0 1px 0 color-mix(in srgb, var(--pg-color-white, #fff) 64%, transparent); transition: color 0.18s ease, background 0.18s ease, border-color 0.18s ease, transform 0.18s ease, box-shadow 0.18s ease; } .pg-social-link svg { width: 1rem; height: 1rem; } .pg-social-link:hover { color: var(--pg-color-white, #fff) !important; border-color: transparent; background: var(--pg-action-gradient) !important; box-shadow: 0 8px 18px color-mix(in srgb, var(--pg-primary) 24%, transparent); transform: translateY(-2px); } body.pg-theme-dark .pg-site-footer { border-color: color-mix(in srgb, var(--pg-primary) 40%, transparent) !important; box-shadow: 0 18px 48px rgba(0, 0, 0, 0.28), 0 0 28px color-mix(in srgb, var(--pg-primary) 16%, transparent), inset 0 1px 0 color-mix(in srgb, var(--pg-primary-light) 14%, transparent) !important; } body.pg-theme-dark .pg-site-footer__overlay { background: radial-gradient(circle at 14% 12%, color-mix(in srgb, var(--pg-primary) 10%, transparent), transparent 32%), radial-gradient(circle at 88% 90%, color-mix(in srgb, var(--pg-secondary) 8%, transparent), transparent 34%), linear-gradient(145deg, color-mix(in srgb, var(--pg-footer-bg) 92%, var(--pg-bg) 8%), color-mix(in srgb, var(--pg-footer-bg) 88%, var(--pg-dark) 12%)) !important; } body.pg-theme-dark .pg-footer-nav a:hover { color: var(--pg-primary-light) !important; } body.pg-theme-dark .pg-footer-heading { color: var(--pg-dark) !important; } body.pg-theme-dark .pg-social-link { color: var(--pg-primary-light); background: color-mix(in srgb, var(--pg-bg-soft) 72%, transparent); border-color: color-mix(in srgb, var(--pg-primary-light) 20%, transparent); } @media (max-width: 767px) { .pg-site-footer { width: calc(100% - (var(--pg-page-gutter) * 2)); /* The body already reserves the fixed bottom bar plus the safe-area * inset. A second 5.5rem footer margin created the large empty strip. */ margin-bottom: 0 !important; border-radius: 1rem; } .pg-site-footer__inner { padding: 1.35rem var(--pg-page-gutter); } } /* Secondary header controls use the same glass system in both themes. */ body .pg-site-header .pg-btn-icon:not(.pg-header-action--primary) { color: rgba(7, 20, 38, 0.82) !important; background: linear-gradient(135deg, rgba(255, 255, 255, 0.88), rgba(234, 251, 255, 0.72)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 42%, transparent), color-mix(in srgb, var(--pg-secondary) 22%, transparent)) border-box !important; border-color: transparent !important; box-shadow: 0 8px 18px rgba(0, 92, 128, 0.08), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important; } body .pg-site-header .pg-btn-icon:not(.pg-header-action--primary):hover, body .pg-site-header .pg-btn-icon[aria-expanded="true"]:not(.pg-header-action--primary), body .pg-site-header .pg-theme-toggle[aria-pressed="true"] { color: #ffffff !important; background: var(--pg-action-gradient) !important; box-shadow: 0 10px 24px rgba(0, 164, 204, 0.22) !important; } body.pg-theme-dark .pg-site-header .pg-btn-icon:not(.pg-header-action--primary) { color: rgba(231, 249, 255, 0.94) !important; background: linear-gradient(135deg, rgba(21, 59, 91, 0.88), rgba(11, 38, 69, 0.78)) padding-box, linear-gradient(135deg, rgba(103, 232, 249, 0.48), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; } /* Sidebar drawer and its menu items follow the shared cyan-blue-mint palette. */ .pg-sidebar-drawer { background: linear-gradient(145deg, rgba(255, 255, 255, 0.96), rgba(234, 251, 255, 0.9)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 38%, transparent), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; border-right: 1px solid transparent !important; box-shadow: 24px 0 54px rgba(0, 92, 128, 0.14), inset -1px 0 0 rgba(255, 255, 255, 0.7) !important; } .pg-sidebar-drawer__header { padding-bottom: 1rem; border-bottom: 1px solid rgba(0, 164, 204, 0.16); } :where(.pg-sidebar-link, .pg-sidebar-menu a) { color: rgba(7, 20, 38, 0.84) !important; background: rgba(255, 255, 255, 0.68) !important; border-color: rgba(0, 164, 204, 0.16) !important; } :where(.pg-sidebar-link, .pg-sidebar-menu a):hover, .pg-sidebar-menu li.current-menu-item > a { color: #ffffff !important; background: var(--pg-action-gradient) !important; border-color: rgba(255, 255, 255, 0.28) !important; box-shadow: 0 10px 22px rgba(0, 164, 204, 0.18) !important; } .pg-sidebar-link__icon { color: var(--pg-link) !important; background: rgba(255, 255, 255, 0.78) !important; border: 1px solid rgba(0, 164, 204, 0.14); } .pg-sidebar-link:hover .pg-sidebar-link__icon { color: #ffffff !important; background: rgba(255, 255, 255, 0.16) !important; } .pg-sidebar-cta { color: #ffffff !important; background: linear-gradient(145deg, #0b1d35, #071426) !important; border: 1px solid color-mix(in srgb, var(--pg-primary) 28%, transparent); box-shadow: 0 14px 30px rgba(0, 92, 128, 0.16); } .pg-sidebar-contact-action { color: var(--pg-link) !important; background: rgba(255, 255, 255, 0.72) !important; border-color: rgba(0, 164, 204, 0.2) !important; } .pg-sidebar-contact-action:hover { color: #ffffff !important; background: var(--pg-action-gradient) !important; border-color: rgba(255, 255, 255, 0.28) !important; box-shadow: 0 8px 18px rgba(0, 164, 204, 0.2) !important; } body.pg-theme-dark .pg-sidebar-drawer { background: linear-gradient(145deg, rgba(11, 29, 53, 0.98), rgba(7, 20, 38, 0.96)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 44%, transparent), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; box-shadow: 24px 0 58px rgba(0, 0, 0, 0.3), inset -1px 0 0 rgba(103, 232, 249, 0.12) !important; } body.pg-theme-dark :where(.pg-sidebar-link, .pg-sidebar-menu a) { color: rgba(231, 249, 255, 0.86) !important; background: rgba(11, 29, 53, 0.62) !important; border-color: rgba(103, 232, 249, 0.16) !important; } body.pg-theme-dark :where(.pg-sidebar-link, .pg-sidebar-menu a):hover, body.pg-theme-dark .pg-sidebar-menu li.current-menu-item > a { color: #ffffff !important; background: var(--pg-action-gradient) !important; border-color: rgba(255, 255, 255, 0.24) !important; } body.pg-theme-dark .pg-sidebar-link__icon, body.pg-theme-dark .pg-sidebar-contact-action { color: rgba(103, 232, 249, 0.94) !important; background: rgba(16, 38, 69, 0.76) !important; border-color: rgba(103, 232, 249, 0.18) !important; } body.pg-theme-dark .pg-sidebar-contact-action:hover { color: #ffffff !important; background: var(--pg-action-gradient) !important; border-color: rgba(255, 255, 255, 0.24) !important; box-shadow: 0 8px 18px rgba(0, 164, 204, 0.22) !important; } /* Listing tabs, header menu control, and the fallback logo share the CTA palette. */ .pg-system-tab, .pg-event-tab-btn { color: rgba(7, 20, 38, 0.84) !important; background: linear-gradient(135deg, rgba(255, 255, 255, 0.9), rgba(234, 251, 255, 0.78)) padding-box, linear-gradient(135deg, color-mix(in srgb, var(--pg-primary) 32%, transparent), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; border: 1px solid transparent !important; box-shadow: 0 7px 16px rgba(0, 92, 128, 0.06) !important; } .pg-system-tab:hover:not(.is-active), .pg-event-tab-btn:hover:not(.is-active) { color: #ffffff !important; background: var(--pg-action-gradient-hover) !important; border-color: rgba(255, 255, 255, 0.28) !important; box-shadow: 0 9px 20px rgba(0, 164, 204, 0.12) !important; } .pg-system-tab.is-active, .pg-event-tab-btn.is-active { color: #ffffff !important; background: var(--pg-action-gradient) !important; border-color: rgba(255, 255, 255, 0.34) !important; box-shadow: 0 10px 24px rgba(0, 164, 204, 0.2), 0 5px 16px color-mix(in srgb, var(--pg-highlight-mid) 14%, transparent), inset 0 1px 0 rgba(255, 255, 255, 0.32) !important; } .pg-system-tab.is-active:hover, .pg-event-tab-btn.is-active:hover { color: #ffffff !important; background: var(--pg-action-gradient-hover) !important; } body.pg-theme-dark :where(.pg-system-tab, .pg-event-tab-btn) { color: rgba(231, 249, 255, 0.86) !important; background: linear-gradient(135deg, rgba(21, 59, 91, 0.88), rgba(11, 38, 69, 0.78)) padding-box, linear-gradient(135deg, rgba(103, 232, 249, 0.42), color-mix(in srgb, var(--pg-secondary) 18%, transparent)) border-box !important; } body.pg-theme-dark :where(.pg-system-tab.is-active, .pg-event-tab-btn.is-active) { color: #ffffff !important; background: var(--pg-action-gradient) !important; } body .pg-logo-title, body.pg-theme-dark .pg-logo-title { background: var(--pg-action-gradient) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; } body .pg-logo-icon { color: #ffffff !important; background: var(--pg-action-gradient) !important; box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.28), 0 8px 20px rgba(0, 164, 204, 0.2) !important; } body .pg-logo-monogram { color: #ffffff !important; text-shadow: 0 0 10px rgba(255, 255, 255, 0.38) !important; } @media (max-width: 767px) { body .pg-site-header { padding: 0.12rem 0.45rem 0.28rem !important; } body .pg-site-header__inner { min-height: 3.05rem !important; padding: 0.28rem 0.42rem !important; border-radius: 0.9rem !important; } body .pg-site-header .pg-logo-img, body .pg-site-header .pg-logo-icon, body .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), body .pg-site-header .pg-header-action--reader { width: 2.25rem !important; min-width: 2.25rem !important; height: 2.25rem !important; border-radius: 0.72rem !important; } } /* Performance cleanup: keep the visual system, remove expensive fixed/blur layers. */ html, body, body.pg-theme-dark, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active), body.pg-theme-dark:not(.pg-book-reader-active) { background-attachment: scroll, scroll, scroll, scroll, scroll !important; } body :where(.pg-site-header, .pg-site-header__inner, .pg-sub-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-drawer, .pg-site-footer, .pg-site-footer__overlay), body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-site-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-drawer), body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card), body.pg-theme-dark:not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-newsroom, .pg-services-section, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-home-side-card, .pg-event-item, .pg-author-item, .pg-highlight-card, .pg-comments-area, .pg-single-sidebar, .pg-portal-card, .pg-portal-filterbar, .pg-portal-sidebar), body :where(.pg-news-card__cat, .pg-highlight-cat, .pg-event-tag, .pg-author-stat, .pg-single-cat, .pg-newsroom-tab, .pg-hub-tab-btn) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } @media (max-width: 767px) { body :where(.pg-newsroom-tab, .pg-hub-tab-btn, .pg-category-tabs > *, .pg-filter-tabs > *, .pg-tabs > *) { transition: background-color 0.12s ease, color 0.12s ease, border-color 0.12s ease !important; } } body::before, body::after, body.pg-theme-dark::before, body.pg-theme-dark::after, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::before, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { background-attachment: scroll !important; filter: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } /* Mobile header sizing guard: keep the capsule inside the viewport. */ @media (max-width: 767px) { body .pg-site-header { left: 0 !important; right: 0 !important; width: 100% !important; max-width: 100% !important; box-sizing: border-box !important; padding: 0.25rem 0.375rem 0.35rem !important; overflow: visible !important; } body .pg-site-header__inner { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; display: grid !important; grid-template-columns: auto minmax(0, 1fr) auto !important; align-items: center !important; justify-content: stretch !important; gap: 0.35rem !important; margin-inline: auto !important; overflow: visible !important; } body .pg-site-header__center { display: none !important; } body .pg-site-header__left { display: contents !important; } body .pg-site-header__left > .pg-btn-icon { grid-column: 1 !important; justify-self: start !important; flex: 0 0 auto !important; } body .pg-site-header__left > .pg-logo-link { grid-column: 2 !important; justify-self: start !important; display: flex !important; align-items: center !important; gap: 0.45rem !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; } body .pg-site-header__right { grid-column: 3 !important; display: flex !important; align-items: center !important; justify-content: flex-end !important; justify-self: end !important; width: auto !important; max-width: 100% !important; min-width: 0 !important; gap: 0.3rem !important; overflow: visible !important; transform: none !important; } body .pg-site-header .pg-logo-link { position: static !important; left: auto !important; transform: none !important; min-width: 0 !important; max-width: 100% !important; flex: 0 1 auto !important; gap: 0.45rem !important; overflow: hidden !important; } body .pg-site-header .pg-logo-text { min-width: 0 !important; max-width: 38vw !important; overflow: hidden !important; } body .pg-site-header .pg-logo-title { max-width: 100% !important; overflow: hidden !important; text-overflow: ellipsis !important; white-space: nowrap !important; } body .pg-site-header .pg-search-wrapper { flex: 0 0 auto !important; min-width: 0 !important; } body .pg-site-header .pg-logo-img, body .pg-site-header .pg-logo-icon, body .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), body .pg-site-header .pg-header-action--reader { width: 2rem !important; min-width: 2rem !important; height: 2rem !important; } } @media (max-width: 390px) { body .pg-site-header .pg-logo-text { max-width: 34vw !important; } body .pg-site-header .pg-logo-img, body .pg-site-header .pg-logo-icon, body .pg-site-header .pg-btn-icon:not(.pg-header-action--primary), body .pg-site-header .pg-header-action--reader { width: 1.92rem !important; min-width: 1.92rem !important; height: 1.92rem !important; } } @media (max-width: 350px) { body .pg-site-header .pg-logo-text { display: none !important; } body .pg-site-header__inner { gap: 0.25rem !important; } body .pg-site-header__right { gap: 0.22rem !important; } } /* Final mobile header fit: blog and book layouts share this header. */ @media (max-width: 767px) { /* Keep the floating capsule close to the mobile viewport edge. */ body .pg-site-header { padding-top: 5px !important; } body.admin-bar .pg-site-header { padding-top: 5px !important; } .pg-site-header-spacer { height: 3.75rem; } body .pg-site-header, body .pg-site-header__inner { width: 100% !important; max-width: 100% !important; overflow: visible !important; } body .pg-site-header__inner { grid-template-columns: auto minmax(0, 1fr) auto !important; column-gap: 0.35rem !important; } body .pg-site-header__left { display: contents !important; } body .pg-site-header__left > .pg-btn-icon { grid-column: 1 !important; } body .pg-site-header__left > .pg-logo-link { grid-column: 2 !important; min-width: 0 !important; max-width: 100% !important; overflow: hidden !important; } body .pg-site-header__right { grid-column: 3 !important; display: flex !important; flex: 0 0 auto !important; width: max-content !important; min-width: 0 !important; max-width: max-content !important; overflow: visible !important; } body .pg-site-header .pg-logo-desc { display: none !important; } } /* Mobile is an app-like reading surface, not a floating desktop capsule. Keep the navigation flush to the top and let its spacer reserve exactly the same height, so article text never slips beneath the header. */ @media (max-width: 767px) { body { --pg-header-height: 3.5rem; } body .pg-site-header, body.admin-bar .pg-site-header { top: var(--pg-admin-bar-offset, 0px) !important; height: 3.5rem !important; padding: 0 !important; margin: 0 !important; background: linear-gradient(135deg, var(--pg-header-shell), var(--pg-header-shell-soft)) !important; border-bottom: 1px solid var(--pg-header-line) !important; box-shadow: 0 4px 14px color-mix(in srgb, var(--pg-header-text-strong) 10%, transparent) !important; backdrop-filter: blur(14px) saturate(1.12) !important; -webkit-backdrop-filter: blur(14px) saturate(1.12) !important; } body .pg-site-header__inner { width: 100% !important; min-height: 3.5rem !important; height: 3.5rem !important; padding: 0.35rem 0.6rem !important; border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } .pg-site-header-spacer { height: 3.5rem !important; margin-bottom: 0 !important; } } /* Single content must keep typography chosen in the editor. */ body.single-post .pg-entry-content { font-family: inherit; } /* App pages do not use the article sidebar, so their introductory copy should span the same full column as the embedded application instead of inheriting the editorial 800px reading measure. */ body.single-psyguild_app .pg-single-main-column--plain, body.single-psyguild_app .pg-single-header, body.single-psyguild_app .pg-single-header-inner, body.single-psyguild_app .pg-single-excerpt { width: 100%; max-width: none; } /* Service detail pages use the same bounded single layout as apps/posts. */ body.single-psyguild_service .pg-single-main-column--plain, body.single-psyguild_service .pg-single-header, body.single-psyguild_service .pg-single-header-inner, body.single-psyguild_service .pg-service-entry-content { width: 100%; max-width: 100%; min-width: 0; box-sizing: border-box; } body.single-psyguild_service .pg-single--service { min-width: 0; box-sizing: border-box; overflow-x: clip; } body.single-psyguild_service .pg-service-entry-content { margin-top: 1.25rem; padding: clamp(1rem, 2.5vw, 2rem); border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); background: var(--pg-block-bg); box-shadow: var(--pg-shadow-soft); } body.single-psyguild_service .pg-service-entry-content > .single-content { max-width: 100%; margin: 0; } body.single-psyguild_service .pg-service-entry-content :where(img, video, iframe, embed, object) { max-width: 100%; height: auto; } body.single-psyguild_service .pg-service-entry-content :where(pre, code) { white-space: pre-wrap; overflow-wrap: anywhere; } /* Blog listing mobile overflow guard: inline blog hero widths must not push the header viewport. */ @media (max-width: 767px) { body.blog, body.blog > main, body.blog .main-content { overflow-x: hidden !important; } body.blog .main-content.pg-container { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; padding-left: 0.75rem !important; padding-right: 0.75rem !important; } body.blog .main-content.pg-container > div:first-child { width: 100% !important; max-width: 100% !important; min-width: 0 !important; box-sizing: border-box !important; padding: 1rem !important; overflow: hidden !important; } body.blog .main-content.pg-container > div:first-child > div { min-width: 0 !important; max-width: 100% !important; flex-basis: auto !important; box-sizing: border-box !important; } body.blog .main-content.pg-container > div:first-child h1, body.blog .main-content.pg-container > div:first-child p { max-width: 100% !important; overflow-wrap: anywhere !important; } body.blog .main-content.pg-container > div:first-child > div[style*="overflow-x: auto"] { overflow-x: auto !important; overflow-y: hidden !important; } } /* Mobile scrolling must not repeatedly composite large translucent layers. * Keep the visual hierarchy, but remove effects that force expensive repaint * work on touch GPUs. Desktop retains the richer hover and reveal treatment. */ @media (max-width: 767px) { html { scroll-behavior: auto; } body, body.pg-theme-dark { background-attachment: scroll !important; } /* The desktop sky uses two animated, blurred, fixed pseudo-elements. On a * phone those viewport-sized layers are repainted while the browser is also * handling touch scrolling, so retain the body gradients and static logo * watermark but remove these decorative compositor layers entirely. */ body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::before, body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active)::after { content: none !important; animation: none !important; filter: none !important; } :where( .pg-site-header, .pg-site-header__inner, .pg-sub-header, .pg-mobile-bottom-bar, .pg-search-dropdown, .pg-sidebar-drawer, .pg-newsroom, .pg-services-section, .pg-card, .pg-card-strong, .pg-home-side-card, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card ) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } :where( .pg-news-card__cat, .pg-highlight-cat, .pg-event-tag, .pg-author-stat, .pg-single-cat, .pg-newsroom-tab, .pg-hub-tab-btn ) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.single-post):not(.pg-book-reader-active) :where(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-author-item, .pg-event-item, .pg-highlight-card)::before { content: none !important; mix-blend-mode: normal !important; } .pg-reveal { will-change: auto; contain-intrinsic-size: auto; } } /* Article pages keep several full-viewport drawers in the DOM. On phones an off-screen drawer with backdrop blur still consumes compositor work while the document scrolls, especially when the direction changes. */ @media (max-width: 767px) { body.single-post .pg-logo-watermark-bg { display: none !important; } body.single-post .pg-single-sidebar:not(.is-open), body.single-post .pg-sidebar-drawer:not(.is-open) { visibility: hidden !important; pointer-events: none !important; box-shadow: none !important; } body.single-post .pg-single-sidebar.is-open, body.single-post .pg-sidebar-drawer.is-open { visibility: visible !important; pointer-events: auto !important; } body.single-post .pg-single-sidebar, body.single-post .pg-single-sidebar-overlay, body.single-post .pg-comments-area, body.single-post .pg-site-footer__overlay, body.single-post .pg-site-header { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body.single-post .pg-single-sidebar-tab { animation: none !important; } body.single-post .pg-single-sidebar-overlay:not(.is-active), body.single-post .pg-scroll-top:not(.is-visible) { visibility: hidden !important; } body.single-post .pg-single-sidebar-overlay.is-active, body.single-post .pg-scroll-top.is-visible { visibility: visible !important; } } /* The uploaded logo already contains its own artwork. Keep it transparent so * it visually belongs to the navigation bar instead of a generated tile. */ body .pg-site-header .pg-logo-img, body.pg-theme-dark .pg-site-header .pg-logo-img { border: 0 !important; border-radius: 0 !important; background: transparent !important; box-shadow: none !important; filter: none !important; } /* Home side columns are containers, not content cards. Keep the glass face * completely clear: the starfield must be seen directly through it. Event * and author cards inside retain their existing palette. */ body:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card.pg-card { /* No fill and no local colour cast: this is a true see-through pane. */ background: transparent !important; border: 1px solid color-mix(in srgb, var(--pg-primary) 48%, rgba(255, 255, 255, 0.76)) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; box-shadow: 0 14px 36px color-mix(in srgb, var(--pg-dark, #0f172a) 8%, transparent) !important; } body:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card.pg-card::before { background: none !important; opacity: 0 !important; } /* The two side headings share a centered visual anchor; controls continue on * their own full-width row below the titles. */ body:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card .pg-side-header { display: flex !important; flex-direction: column !important; align-items: center !important; text-align: center !important; } body:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card .pg-side-header > :first-child, body:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card .pg-side-header__subtitle, body:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card .pg-side-header__title { width: 100%; text-align: center; } body.pg-theme-dark:where(.home, .page-template-template-home):not(.pg-book-reader-active) :is(.pg-home-col--left, .pg-home-col--right) > .pg-home-side-card.pg-card { background: transparent !important; border-color: rgba(103, 232, 249, 0.54) !important; } /* Light theme content cards use an almost-white gradient. White remains the * visual base; the faint blue-to-mint edge prevents the cards from feeling * flat while the colourful starfield stays on the page layer. Keep the two * side containers transparent (they are panes, not content cards). */ body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) :where( .pg-card:not(.pg-home-side-card), .pg-card-strong, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-event-item, .pg-author-item, .pg-highlight-card ) { background: linear-gradient(145deg, #ffffff 0%, #ffffff 42%, #f2fbff 76%, #f6fffc 100%) !important; background-image: linear-gradient(145deg, #ffffff 0%, #ffffff 42%, #f2fbff 76%, #f6fffc 100%) !important; border-color: color-mix(in srgb, var(--pg-primary) 22%, #ffffff) !important; box-shadow: 0 10px 30px rgba(15, 23, 42, 0.07) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) :where( .pg-card:not(.pg-home-side-card), .pg-card-strong, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-featured-event, .pg-search-card, .pg-author-card, .pg-event-item, .pg-author-item, .pg-highlight-card )::before { background: none !important; opacity: 0 !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-apps, .page-template-page-services, .page-template-page-events, .page-template-page-authors):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) :where(.pg-event-item, .pg-author-item, .pg-card-post, .pg-news-card, .pg-service-card, .pg-event-card, .pg-search-card, .pg-highlight-card):hover { background: linear-gradient(145deg, #ffffff 0%, #ffffff 35%, #edfbff 74%, #f1fffa 100%) !important; } /* Article and service cards sit on the starfield as white glass. Keep the * cyan/mint palette on buttons and badges, not on the card face. */ body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-services):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) :where(.pg-featured-post-card, .pg-card-post, .pg-news-card, .pg-search-card, .pg-highlight-card, .pg-service-card) { background: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.68)) !important; background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.68)) !important; border-color: rgba(255, 255, 255, 0.82) !important; box-shadow: 0 12px 30px rgba(15, 23, 42, 0.075), inset 0 1px 0 rgba(255, 255, 255, 0.72) !important; backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-services):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) :where(.pg-featured-post-card, .pg-card-post, .pg-news-card, .pg-search-card, .pg-highlight-card, .pg-service-card):hover { background: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.75)) !important; background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.88), rgba(255, 255, 255, 0.75)) !important; } @media (max-width: 767px) { body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge, .page-template-page-services):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) :where(.pg-featured-post-card, .pg-card-post, .pg-news-card, .pg-search-card, .pg-highlight-card, .pg-service-card) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } body:where(.home, .blog, .archive, .search, .page-template-template-home, .page-template-page-knowledge):not(.pg-theme-dark):not(.single-post):not(.pg-book-reader-active) .pg-featured-post-card .pg-featured-content { background: transparent !important; } /* The newsroom is a full-width section pane, not a content card. Leave its * face clear so the moving sky remains visible behind the tabs and article * cards; a fine border keeps the section legible without a white slab. */ body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-newsroom { background: transparent !important; background-image: none !important; border-color: color-mix(in srgb, var(--pg-primary) 42%, rgba(255, 255, 255, 0.78)) !important; box-shadow: 0 16px 38px rgba(15, 23, 42, 0.055) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-newsroom::before { background: none !important; opacity: 0 !important; } /* Keep the services area as a clear section pane as well. The service cards * already carry their own subtle white gradient, so a second frosted-grey * fill behind them only dulls both the artwork and the starfield. */ body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-services-section { background: transparent !important; background-image: none !important; border-color: color-mix(in srgb, var(--pg-primary) 42%, rgba(255, 255, 255, 0.78)) !important; box-shadow: 0 16px 38px rgba(15, 23, 42, 0.055) !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-services-section::before { background: none !important; opacity: 0 !important; } /* The large Media PsyGuild frame is a white-glass pane, not an opaque white * slab. Its videos and the Spotify embed keep their own native surfaces. */ body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-home-media.pg-card { background: linear-gradient(145deg, rgba(255, 255, 255, 0.52), rgba(255, 255, 255, 0.36)) !important; background-image: linear-gradient(145deg, rgba(255, 255, 255, 0.52), rgba(255, 255, 255, 0.36)) !important; border-color: rgba(255, 255, 255, 0.76) !important; box-shadow: 0 16px 38px rgba(15, 23, 42, 0.065), inset 0 1px 0 rgba(255, 255, 255, 0.56) !important; backdrop-filter: blur(4px) !important; -webkit-backdrop-filter: blur(4px) !important; } body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-home-media.pg-card::before { background: none !important; opacity: 0 !important; } @media (max-width: 767px) { body:where(.home, .page-template-template-home):not(.pg-theme-dark):not(.pg-book-reader-active) .pg-home-media.pg-card { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } /* Blog index heading: retain a readable glass face while letting the moving * starfield show through more clearly than the former near-white surface. */ body.blog:not(.pg-theme-dark):not(.pg-book-reader-active) .pg-blog-index-header { background: linear-gradient(145deg, rgba(255, 255, 255, 0.46), rgba(231, 250, 255, 0.3)) padding-box, linear-gradient(145deg, rgba(255, 255, 255, 0.7), color-mix(in srgb, var(--pg-primary) 32%, transparent), color-mix(in srgb, var(--pg-secondary) 20%, transparent)) border-box !important; border-color: transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; backdrop-filter: blur(7px) saturate(1.06); -webkit-backdrop-filter: blur(7px) saturate(1.06); box-shadow: 0 14px 34px rgba(15, 23, 42, 0.075) !important; } body.pg-theme-dark.blog:not(.pg-book-reader-active) .pg-blog-index-header { background: linear-gradient(145deg, rgba(11, 29, 53, 0.58), rgba(7, 20, 38, 0.46)) padding-box, linear-gradient(145deg, rgba(103, 232, 249, 0.28), color-mix(in srgb, var(--pg-primary) 24%, transparent), color-mix(in srgb, var(--pg-secondary) 16%, transparent)) border-box !important; border-color: transparent !important; background-clip: padding-box, border-box !important; background-origin: padding-box, border-box !important; } /* Keep the complete reading surface in the same dark palette as the theme. * Article-local tokens also cover quotes, tables, captions and link cards. */ body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content { --pg-text: #eaf3ff; --pg-dark: #f8fbff; --pg-muted: #bdd0e3; --pg-bg-soft: #183552; --pg-block-bg: #183552; --pg-surface-strong: #102645; --pg-border: rgba(148, 197, 225, 0.24); --pg-border-strong: rgba(148, 197, 225, 0.34); background: #0b1d35 !important; border-color: var(--pg-border) !important; color: var(--pg-text) !important; box-shadow: 0 18px 48px rgba(0, 0, 0, 0.22); } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content :where(p, li, h1, h2, h3, h4, h5, h6, blockquote, figcaption, td, th, code) { color: var(--pg-text) !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content :where(h1, h2, h3, h4, h5, h6, blockquote, th) { color: var(--pg-dark) !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content a { color: #7dd3fc !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content blockquote { background: var(--pg-block-bg) !important; border: 1px solid var(--pg-border-strong) !important; color: var(--pg-dark) !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content blockquote :where(p, li, span, strong, em) { color: var(--pg-dark) !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content blockquote :where(cite, footer, small, .wp-block-quote__citation) { color: var(--pg-muted) !important; } @media (max-width: 767px) { body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-site-header { background: #0b1d35 !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } } /* The article heading controls sit outside the reading surface above. In dark * mode their old pale chips inherited white text and became unreadable. */ body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-single-meta-row, body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-single-reader-actions { background: #102645 !important; border-color: rgba(125, 211, 252, 0.25) !important; color: #f5fbff !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-single-meta-row > :is(.pg-single-views, .pg-single-date, .pg-single-read-time, .pg-single-author-inline) { background: #183552 !important; border-color: rgba(125, 211, 252, 0.22) !important; color: #f5fbff !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-single-reader-actions :is(.reader-audio-btn, .pg-single-print-btn) { background: #183552 !important; border-color: rgba(125, 211, 252, 0.25) !important; color: #f5fbff !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-single-reader-actions .reader-audio-btn:is(.is-playing, .is-paused) { background: linear-gradient(135deg, #009ac4, var(--pg-highlight-mid)) !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-article-share-menu { background: #102645 !important; border-color: rgba(125, 211, 252, 0.25) !important; } /* Page changes may need a few seconds on a mobile connection. Show a tiny, * non-blocking acknowledgement as soon as a regular link is tapped instead of * leaving the old page looking frozen. */ .pg-navigation-feedback { position: fixed; top: max(0.6rem, env(safe-area-inset-top)); left: 50%; z-index: 2147483000; display: flex; align-items: center; gap: 0.45rem; max-width: calc(100vw - 2rem); padding: 0.48rem 0.72rem; border: 1px solid color-mix(in srgb, var(--pg-primary) 42%, transparent); border-radius: 999px; background: color-mix(in srgb, var(--pg-surface-strong, #fff) 94%, var(--pg-primary)); box-shadow: 0 0.5rem 1.25rem rgba(2, 6, 23, 0.16); color: var(--pg-text, #0f172a); font: 700 0.76rem/1 var(--pg-font-sans, system-ui, sans-serif); opacity: 0; pointer-events: none; transform: translate(-50%, -0.5rem); transition: opacity 120ms ease, transform 120ms ease; } .pg-navigation-feedback::before { width: 0.72rem; height: 0.72rem; border: 2px solid color-mix(in srgb, var(--pg-primary) 30%, transparent); border-top-color: var(--pg-primary); border-radius: 50%; content: ""; animation: pg-navigation-feedback-spin 650ms linear infinite; } html.pg-navigation-pending .pg-navigation-feedback { opacity: 1; transform: translate(-50%, 0); } html.pg-navigation-pending::before { position: fixed; top: 0; left: 0; z-index: 2147483001; width: min(82vw, 26rem); height: 2px; border-radius: 0 999px 999px 0; background: var(--pg-gradient, linear-gradient(90deg, var(--pg-primary), var(--pg-secondary))); content: ""; transform-origin: left center; animation: pg-navigation-feedback-progress 1.35s ease-out infinite; } a.pg-navigation-source { opacity: 0.72; } @keyframes pg-navigation-feedback-spin { to { transform: rotate(360deg); } } @keyframes pg-navigation-feedback-progress { from { transform: scaleX(0.18); } to { transform: scaleX(1); } } @media (prefers-reduced-motion: reduce) { .pg-navigation-feedback, html.pg-navigation-pending::before { animation: none; } } /* Article text needs an opaque, flat paint layer. Glass blur and 3D card * compositing soften glyph edges at non-default browser zoom levels. */ body:not(.pg-book-reader-active) .pg-article-grid > :is(.pg-card-post, .pg-news-card) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; transform-style: flat !important; filter: none !important; } body:not(.pg-theme-dark) .pg-article-grid > :is(.pg-card-post, .pg-news-card), body:not(.pg-theme-dark) .pg-article-grid > :is(.pg-card-post, .pg-news-card):hover { background: #ffffff !important; background-image: none !important; } body .pg-article-grid > :is(.pg-card-post, .pg-news-card)::before { display: none !important; } body.pg-theme-dark .pg-article-grid > :is(.pg-card-post, .pg-news-card), body.pg-theme-dark .pg-article-grid > :is(.pg-card-post, .pg-news-card):hover { background: #0b1d35 !important; background-image: none !important; } body .pg-article-grid > :is(.pg-card-post, .pg-news-card):hover { transform: none !important; filter: none !important; } body .pg-newsroom.pg-reveal.is-visible { transform: none; will-change: auto; } /* The article drawer sits over the reading surface. Give it an opaque theme * surface so prose beneath cannot show through while the drawer is open. */ body.single-post:not(.pg-book-reader-active) .pg-single-sidebar { background-color: #ffffff !important; background-image: none !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body.pg-theme-dark.single-post:not(.pg-book-reader-active) .pg-single-sidebar { background-color: #0b1d35 !important; background-image: none !important; } /* On phones both navigation edges belong to the viewport. The content footer * spans the canvas and meets the fixed tab bar without an empty strip. */ @media (max-width: 767px) { body { --pg-mobile-tabbar-height: 65px; padding-bottom: calc(var(--pg-mobile-tabbar-height) + env(safe-area-inset-bottom, 0px)) !important; } body .pg-site-header, body.admin-bar .pg-site-header { position: fixed !important; top: var(--pg-admin-bar-offset, 0px) !important; left: 0 !important; right: 0 !important; width: 100% !important; margin: 0 !important; border-radius: 0 !important; } body .pg-mobile-bottom-bar.pg-hide-desktop { position: fixed !important; bottom: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; margin: 0 !important; border-radius: 0 !important; border-top: 1px solid var(--pg-border) !important; background: #ffffff !important; background-image: none !important; background-clip: border-box !important; box-shadow: 0 -4px 18px rgba(15, 23, 42, 0.08) !important; isolation: isolate; } body.pg-theme-dark .pg-mobile-bottom-bar.pg-hide-desktop { background: #0b1d35 !important; background-image: none !important; } body .pg-bottom-tab, body .pg-bottom-fab-wrapper { min-width: 0; min-height: 44px; text-decoration: none; touch-action: manipulation; } body .pg-bottom-tab, body .pg-bottom-fab-label { font-size: 11px; line-height: 1.15; } body .pg-bottom-tab svg { flex-shrink: 0; } body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content { font-size: 16px; line-height: 1.7; } body.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content :where(p, li, h1, h2, h3, h4, h5, h6, blockquote, figcaption, a) { overflow-wrap: break-word !important; word-break: normal !important; } body > .pg-site-footer, body.pg-theme-dark > .pg-site-footer { width: 100% !important; max-width: none !important; margin: 0 !important; border-right: 0 !important; border-bottom: 0 !important; border-left: 0 !important; border-radius: 0 !important; box-shadow: none !important; } } /* Keep public text on native font faces and flat paint layers. Remote fonts * can be unavailable, while synthetic 800/900 weights and compositing make * Vietnamese diacritics look heavy or soft at browser zoom levels. */ body:not(.pg-book-reader-active) { font-synthesis: none; -webkit-font-smoothing: auto; -moz-osx-font-smoothing: auto; text-rendering: auto; } body:not(.pg-book-reader-active) :is(h1, h2, h3, h4, h5, h6) { font-weight: 700 !important; text-shadow: none !important; } body:not(.pg-book-reader-active) :is(strong, b) { font-weight: 700; } body:not(.pg-book-reader-active) :is(.pg-side-header__title, .pg-newsroom__title, .pg-author-header__title, .pg-services__title, .pg-home-media__title), body:not(.pg-book-reader-active) :is(h1, h2, h3, h4, h5, h6).pg-text-gradient { background: var(--pg-brand-gradient) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; text-shadow: none !important; } body:not(.pg-book-reader-active) .pg-logo-title { background: var(--pg-brand-gradient) !important; -webkit-background-clip: text !important; background-clip: text !important; -webkit-text-fill-color: transparent !important; color: transparent !important; text-shadow: none !important; font-weight: 700 !important; } body:not(.pg-book-reader-active) .pg-site-header .pg-main-nav a { font-weight: 600 !important; text-shadow: none !important; will-change: auto !important; } body:not(.pg-theme-dark):not(.pg-book-reader-active) .pg-site-header .pg-main-nav a { color: #075a7e !important; } body:not(.pg-theme-dark):not(.pg-book-reader-active) .pg-site-header .pg-main-nav :is(li.current-menu-item, li.current_page_item) > a, body:not(.pg-theme-dark):not(.pg-book-reader-active) .pg-site-header .pg-main-nav a[aria-current="page"], body:not(.pg-theme-dark):not(.pg-book-reader-active) .pg-site-header .pg-main-nav a:hover { color: #075a7e !important; text-shadow: none !important; } body:not(.pg-book-reader-active) :is(.pg-reveal.is-visible, .pg-reveal-pending.is-visible, .pg-block-list) { transform: none; filter: none; will-change: auto; } body:not(.pg-book-reader-active) :is(.pg-card, .pg-card-strong, .pg-home-side-card, .pg-event-item, .pg-author-item, .pg-highlight-card, .pg-service-card, .pg-card-post, .pg-news-card, .pg-portal-card) { transform-style: flat !important; will-change: auto !important; } body:not(.pg-book-reader-active) :is(.pg-event-item, .pg-author-item, .pg-highlight-card, .pg-service-card, .pg-card-post, .pg-news-card):hover { transform: none !important; } /* Keep publication time and views together beneath the author. */ .pg-card-post__meta { display: flex; align-items: center; justify-content: space-between; min-width: 0; gap: 0.4rem; color: var(--pg-muted); font-size: 0.75rem; white-space: nowrap; } .pg-card-post__published { min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .pg-card-post__views { display: inline-flex; align-items: center; flex: 0 0 auto; gap: 0.3rem; white-space: nowrap; } .pg-card-post__views svg { width: 14px; height: 14px; flex: 0 0 14px; } body .pg-article-grid .pg-news-card__footer, body .pg-article-grid .pg-card-post__footer { display: flex; flex-direction: column; align-items: stretch; gap: 0.4rem; min-width: 0; padding-top: 0.75rem; border-top: 1px solid var(--pg-border); } body .pg-article-grid .pg-news-card__author, body .pg-article-grid .pg-card-post__author { display: flex; align-items: center; gap: 0.5rem; min-width: 0; width: 100%; } body .pg-article-grid .pg-card-post__author-img { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; object-fit: cover; } body .pg-article-grid :is(.pg-news-card__author-name, .pg-card-post__author-name) { display: -webkit-box; min-width: 0; max-width: 100%; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow-wrap: break-word; word-break: normal; white-space: normal; color: var(--pg-dark); font-size: 0.75rem; font-weight: 600; line-height: 1.3; } body .pg-article-grid :is(.pg-news-card__meta, .pg-card-post__meta) { display: flex; align-items: center; justify-content: space-between; align-self: stretch; width: 100%; min-width: 0; gap: 0.4rem; color: var(--pg-muted); font-size: 0.75rem; font-weight: 500; white-space: nowrap; } body .pg-article-grid :is(.pg-news-card__published, .pg-card-post__published) { display: block; min-width: 0; overflow: hidden; text-overflow: ellipsis; color: var(--pg-muted); font-size: inherit; font-weight: 500; line-height: 1.4; white-space: nowrap; } body .pg-article-grid :is(.pg-news-card__meta-item:last-child, .pg-card-post__views) { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 0.3rem; white-space: nowrap; } body .pg-article-grid .pg-card-post__views svg { width: 14px; height: 14px; flex: 0 0 14px; opacity: 0.7; } body .pg-article-grid .pg-news-card__meta-icon { width: 14px; height: 14px; flex: 0 0 14px; opacity: 0.7; } /* WordPress uses an absolute toolbar on phones. Pin it above the fixed site * header so neither bar can cover the other while scrolling. */ @media (max-width: 782px) { body.admin-bar #wpadminbar { position: fixed !important; top: 0 !important; left: 0 !important; right: 0 !important; width: 100% !important; } body.admin-bar { --pg-admin-bar-offset: 46px; } } @media (max-width: 639px) { body .pg-article-grid :is(.pg-news-card__meta, .pg-card-post__meta) { gap: 0.2rem; font-size: 0.625rem; } body .pg-article-grid :is(.pg-news-card__meta-icon, .pg-card-post__views svg) { width: 11px; height: 11px; flex-basis: 11px; } /* Small videos retain their 16:9 frame and readable title below it. */ body .pg-home-media__video-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0.65rem; } body .pg-home-media__video-title { display: -webkit-box; overflow: hidden; -webkit-box-orient: vertical; -webkit-line-clamp: 2; padding: 0.55rem 0.6rem 0.7rem; font-size: 0.75rem; line-height: 1.3; overflow-wrap: anywhere; } } @media (max-width: 767px) { /* The spacer already reserves the mobile header height. */ body.blog .main-content.pg-container { padding-top: 5px !important; } } /* A persistent viewport thumb shows how far each horizontal list has moved, * including lists whose native scrollbar is hidden by the browser. */ .pg-h-scroll-progress--static { position: relative; } .pg-h-scroll-progress--horizontal-only { scrollbar-width: none !important; -ms-overflow-style: none; } .pg-h-scroll-progress--horizontal-only::-webkit-scrollbar { display: none !important; height: 0 !important; } .pg-h-scroll-progress::before, .pg-h-scroll-progress::after { position: absolute; bottom: 0; left: 0; z-index: 5; height: 4px; border-radius: 999px; content: ""; pointer-events: none; } .pg-h-scroll-progress::before { width: 100%; background: color-mix(in srgb, var(--pg-primary) 22%, var(--pg-surface-strong)); transform: translateX(var(--pg-h-scroll-x, 0px)); } .pg-h-scroll-progress::after { width: var(--pg-h-scroll-thumb-width, 28px); background: var(--pg-action-gradient); box-shadow: 0 0 8px color-mix(in srgb, var(--pg-primary) 40%, transparent); transform: translateX(calc(var(--pg-h-scroll-x, 0px) + var(--pg-h-scroll-thumb-left, 0px))); } /* Keep long post descriptions in a three-line viewport at every breakpoint. * The scroll position can also be changed by touch, wheel, or keyboard. */ body.single-post .pg-single-excerpt { max-height: 4.65em; overflow-x: hidden; overflow-y: auto; -webkit-overflow-scrolling: touch; scrollbar-width: thin; scrollbar-color: var(--pg-primary) transparent; line-height: 1.55; } body.single-post .pg-single-excerpt::-webkit-scrollbar { width: 4px; } body.single-post .pg-single-excerpt::-webkit-scrollbar-thumb { border-radius: 999px; background: var(--pg-action-gradient); } /* Service content types remain distinct in both the editor and public page. */ [data-pg-service-panel][hidden] { display: none !important; } .pg-service-editor__label { display: block; margin: 1.25rem 0 .5rem; font-weight: 800; } .pg-service-editor__label:first-child { margin-top: 0; } .pg-service-editor__input { display: block; width: 100%; min-width: 0; padding: .8rem; border: 1px solid var(--pg-border); border-radius: .65rem; background: var(--pg-bg-soft); color: var(--pg-text); font: inherit; } .pg-service-mode-picker { position: relative; width: 100%; } .pg-service-mode-picker.is-open { z-index: 170; } .pg-service-mode-picker__native { display: none !important; } .pg-service-mode-picker__trigger { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; min-height: 48px; padding: .7rem .85rem; border: 1px solid var(--pg-border); border-radius: .85rem; background: var(--pg-surface-strong); box-shadow: 0 8px 22px color-mix(in srgb, var(--pg-dark) 7%, transparent); color: var(--pg-text); font: inherit; font-size: .875rem; font-weight: 700; line-height: 1.35; text-align: left; cursor: pointer; transition: border-color .18s ease, box-shadow .18s ease, background .18s ease; } .pg-service-mode-picker__trigger:hover, .pg-service-mode-picker__trigger:focus-visible, .pg-service-mode-picker.is-open .pg-service-mode-picker__trigger { border-color: color-mix(in srgb, var(--pg-primary) 62%, var(--pg-border)); outline: 0; box-shadow: 0 0 0 3px color-mix(in srgb, var(--pg-primary) 15%, transparent), 0 10px 26px color-mix(in srgb, var(--pg-dark) 9%, transparent); } .pg-service-mode-picker__trigger svg { width: 18px; height: 18px; flex: 0 0 18px; fill: none; stroke: currentColor; stroke-width: 2; transition: transform .18s ease; } .pg-service-mode-picker.is-open .pg-service-mode-picker__trigger svg { transform: rotate(180deg); } .pg-service-mode-picker__menu { position: absolute; z-index: 160; top: calc(100% + .45rem); left: 0; width: 100%; max-height: 15rem; padding: .4rem; overflow-y: auto; border: 1px solid color-mix(in srgb, var(--pg-primary) 28%, var(--pg-border)); border-radius: .85rem; background: #f8fdff; box-shadow: 0 20px 48px rgba(2, 6, 23, .2), 0 0 0 1px rgba(255, 255, 255, .72) inset; isolation: isolate; } .pg-service-mode-picker__menu[hidden] { display: none !important; } .pg-service-mode-picker__option { display: flex; align-items: center; justify-content: space-between; gap: .75rem; width: 100%; min-height: 44px; padding: .68rem .75rem; border: 0; border-radius: .6rem; background: transparent; color: var(--pg-text); font: inherit; font-size: .875rem; line-height: 1.35; text-align: left; cursor: pointer; } .pg-service-mode-picker__option:hover, .pg-service-mode-picker__option:focus-visible { outline: 0; background: color-mix(in srgb, var(--pg-primary) 10%, var(--pg-bg-soft)); } .pg-service-mode-picker__option[aria-selected="true"] { background: color-mix(in srgb, var(--pg-primary) 14%, var(--pg-bg-soft)); color: var(--pg-link); font-weight: 800; } .pg-service-mode-picker__option svg { width: 17px; height: 17px; flex: 0 0 17px; fill: none; stroke: currentColor; stroke-width: 2.4; opacity: 0; } .pg-service-mode-picker__option[aria-selected="true"] svg { opacity: 1; } body.pg-theme-dark .pg-service-mode-picker__option[aria-selected="true"] { color: var(--pg-secondary); } body.pg-theme-dark .pg-service-mode-picker__menu { background: #102645; box-shadow: 0 20px 48px rgba(0, 0, 0, .38), 0 0 0 1px rgba(255, 255, 255, .05) inset; } @media (max-width: 480px) { .pg-service-mode-picker__trigger, .pg-service-mode-picker__option { font-size: .8rem; } .pg-service-mode-picker__menu { max-height: 12.5rem; padding: .32rem; } } @media (prefers-reduced-motion: reduce) { .pg-service-mode-picker__trigger, .pg-service-mode-picker__trigger svg { transition: none; } } .pg-service-editor__code { font-family: ui-monospace, SFMono-Regular, Consolas, monospace; font-size: .875rem; line-height: 1.5; } .pg-service-editor__help { margin: .5rem 0 1rem; color: var(--pg-muted); font-size: .875rem; line-height: 1.5; } .pg-service-display-badge { display: inline-flex; margin: .5rem 0 1rem; padding: .35rem .75rem; border: 1px solid var(--pg-border-strong); border-radius: 999px; background: var(--pg-bg-soft); color: var(--pg-link); font-size: .75rem; font-weight: 800; } .pg-service-source-link { display: flex; align-items: center; gap: .75rem 1rem; flex-wrap: wrap; margin: 0 0 1rem; color: var(--pg-muted); font-size: .875rem; } .pg-service-content-frame { display: block; width: 100%; height: max(640px, 85vh); border: 0; border-radius: var(--pg-radius-xl); background: var(--pg-bg-soft); } .pg-service-empty-content { padding: 1.25rem; border: 1px solid var(--pg-border); border-radius: var(--pg-radius-xl); background: var(--pg-bg-soft); color: var(--pg-muted); } /* Keep the rendered newsroom columns in sync with its slide grouping. */ @media (min-width: 481px) and (max-width: 767px) { .pg-newsroom[data-pg-news-slider][data-columns="1"] .pg-newsroom__grid { grid-template-columns: minmax(0, 1fr) !important; } } @media (max-width: 480px) { .pg-newsroom[data-pg-news-slider] .pg-newsroom__grid { grid-template-columns: minmax(0, 1fr) !important; } } @media (max-width: 639px) { body.blog .pg-blog-index[data-columns="1"] .pg-blog-post-list { grid-template-columns: minmax(0, 1fr); } } /* PsyGuild source: content-cards.css */ /* Public content cards: one responsive contract for server and JS renderers. * Keep theme colours in the design system; geometry and readable text live here. * Desktop cards wrap in full; mobile article rows reserve two title lines * followed by one author/views line. */ :root { --pg-content-card-gap: 1.25rem; --pg-content-card-padding: 1.25rem; --pg-content-card-title: 1.125rem; --pg-content-card-copy: .9375rem; --pg-content-card-radius: 1rem; } /* Card slide transforms must not create a horizontal page scrollbar. */ body :is([data-pg-knowledge-slider], [data-pg-news-slider]) { overflow-x: clip; } .pg-content-card-picture { display: block; width: 100%; height: 100%; } .pg-mobile-post-meta { display: none; } body :is(.pg-article-grid, .pg-hub-grid, .pg-events-grid, .pg-services__grid, .pg-search-grid) { display: grid; grid-template-columns: minmax(0, 1fr); align-items: stretch; gap: var(--pg-content-card-gap); } body :is(.pg-article-grid, .pg-hub-grid, .pg-events-grid, .pg-services__grid, .pg-search-grid) > * { min-width: 0; } @media (min-width: 768px) { body :is(.pg-article-grid, .pg-hub-grid, .pg-events-grid, .pg-services__grid, .pg-search-grid) { grid-template-columns: repeat(2, minmax(0, 1fr)); } } @media (min-width: 1024px) { body :is(.pg-article-grid, .pg-hub-grid, .pg-events-grid, .pg-services__grid, .pg-search-grid) { grid-template-columns: repeat(3, minmax(0, 1fr)); } } @media (min-width: 1200px) { body :is(.pg-article-grid, .pg-hub-grid, .pg-events-grid, .pg-services__grid, .pg-search-grid) { grid-template-columns: repeat(4, minmax(0, 1fr)); } } body :is(.pg-card-post, .pg-news-card, .pg-service-card, .pg-hub-card, .pg-event-card, .pg-search-card) { display: flex; flex-direction: column; align-self: stretch; min-width: 0; height: 100%; margin: 0; border: 1px solid var(--pg-border); border-radius: var(--pg-content-card-radius); background: var(--pg-surface-strong); overflow: hidden; text-decoration: none; color: inherit; } body :is(.pg-card-post__media, .pg-news-card__img, .pg-service-card__img-wrap, .pg-event-card__img, .pg-hub-card-img, .pg-hub-card-fallback-img, .pg-event-card-img) { display: block; position: relative; flex: 0 0 auto; width: 100%; height: auto; aspect-ratio: 16 / 9; margin: 0; border-radius: 0; object-fit: cover; background: var(--pg-bg-soft); overflow: hidden; } body .pg-hub-card-fallback-img { display: flex; align-items: center; justify-content: center; color: var(--pg-muted); } body .pg-content-card-placeholder { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; color: var(--pg-muted); background: var(--pg-bg-soft); } body .pg-event-card__img.pg-content-card-placeholder, body .pg-event-card-img.pg-content-card-placeholder { height: auto; } body .pg-card-post__cat { position: absolute; top: .75rem; left: .75rem; max-width: calc(100% - 1.5rem); padding: .25rem .5rem; border-radius: .5rem; background: var(--pg-surface-strong); color: var(--pg-link); font-size: .75rem; font-weight: 700; overflow-wrap: anywhere; } body :is(.pg-card-post__media, .pg-news-card__img, .pg-service-card__img-wrap, .pg-event-card__img) img { display: block; width: 100%; height: 100%; object-fit: cover; } body :is(.pg-card-post__body, .pg-news-card__body, .pg-service-card__body, .pg-hub-card-body, .pg-event-card__body, .pg-event-card-body, .pg-search-card__body) { display: flex; flex: 1 1 auto; flex-direction: column; min-width: 0; gap: .75rem; padding: var(--pg-content-card-padding); } body .pg-hero-highlights.pg-block-count-1 .pg-highlight-title, body :is(.pg-card-post__title, .pg-news-card__title, .pg-service-card__title, .pg-hub-card-title, .pg-event-card__title, .pg-event-card-title, .pg-highlight-title, .pg-event-item__title, .pg-related-post-title, .pg-carousel-card__title, .pg-book-related-card-title, .pg-search-card__title) { display: block; height: auto; min-height: 0; max-height: none; margin: 0; overflow: visible; -webkit-line-clamp: unset; line-clamp: unset; white-space: normal; overflow-wrap: anywhere; word-break: normal; text-overflow: clip; font-size: var(--pg-content-card-title); font-weight: 700; line-height: 1.45; color: var(--pg-dark); text-shadow: none; } body :is(.pg-card-post__title, .pg-news-card__title, .pg-service-card__title, .pg-event-card__title, .pg-carousel-card__title, .pg-book-related-card-title) a { color: inherit; text-decoration: none; } body.pg-article-card-excerpts-hidden :is(.pg-card-post__excerpt, .pg-news-card__excerpt, .pg-search-card--article .pg-search-card__excerpt, .pg-highlight-excerpt, .pg-carousel-card__excerpt, .pg-book-related-card-excerpt, .pg-featured-excerpt) { display: none !important; } body .pg-hero-highlights.pg-block-count-1 .pg-highlight-excerpt, body :is(.pg-card-post__excerpt, .pg-news-card__excerpt, .pg-service-card__excerpt, .pg-hub-card-desc, .pg-event-card__excerpt, .pg-highlight-excerpt, .pg-carousel-card__excerpt, .pg-book-related-card-excerpt, .pg-search-card__excerpt) { display: block; flex: 0 0 auto; height: auto; min-height: 0; max-height: none; margin: 0; overflow: visible; -webkit-line-clamp: unset; line-clamp: unset; white-space: normal; overflow-wrap: anywhere; word-break: normal; font-size: var(--pg-content-card-copy); line-height: 1.65; color: var(--pg-muted); text-shadow: none; } body :is(.pg-card-post__footer, .pg-news-card__footer) { display: grid; grid-template-columns: minmax(0, 1fr); align-items: start; gap: .6rem; margin: auto 0 0; padding: .75rem 0 0; border-top: 1px solid var(--pg-border); } body :is(.pg-card-post__author, .pg-news-card__author) { display: flex; align-items: center; gap: .5rem; min-width: 0; color: inherit; text-decoration: none; } body :is(.pg-card-post__author-img, .pg-news-card__author-img) { width: 28px; height: 28px; flex: 0 0 28px; border-radius: 50%; object-fit: cover; } body .pg-article-grid :is(.pg-card-post__author-name, .pg-news-card__author-name) { display: block; max-width: none; max-height: none; overflow: visible; -webkit-line-clamp: unset; white-space: normal; overflow-wrap: anywhere; font-size: .8125rem; line-height: 1.45; } body .pg-article-grid :is(.pg-news-card__meta, .pg-card-post__meta) { display: flex; flex-wrap: wrap; justify-content: space-between; width: 100%; gap: .35rem .75rem; font-size: .75rem; overflow: visible; } body .pg-article-grid :is(.pg-news-card__published, .pg-card-post__published, .pg-news-card__meta-item, .pg-card-post__views) { max-width: 100%; white-space: normal; overflow-wrap: anywhere; } body :is(.pg-card-post__read, .pg-news-card__read-btn, .pg-service-card__btn, .pg-event-card__actions .pg-btn) { display: flex; align-items: center; justify-content: center; min-height: 44px; min-width: 0; padding: .65rem 1rem; font-size: .875rem; font-weight: 700; line-height: 1.4; white-space: normal; text-align: center; text-decoration: none; overflow-wrap: anywhere; } body .pg-card-post__read { border-radius: .75rem; background: var(--pg-gradient); color: var(--pg-color-white); } body .pg-card-post__body > :not(.pg-card-post__footer) + .pg-card-post__read { margin-top: auto; } body .pg-hub-card-footer { min-height: 44px; font-size: .875rem; line-height: 1.4; } body .pg-search-card__meta { margin-top: auto; } body :is(.pg-service-card__btn, .pg-hub-card-footer, .pg-event-card__actions) { margin-top: auto; } body .pg-event-card__actions { flex-wrap: wrap; } body .pg-event-card__actions > * { flex: 1 1 9rem; } body :is(.pg-event-card__info, .pg-event-card-meta, .pg-event-card-meta-item) { min-width: 0; overflow-wrap: anywhere; font-size: .875rem; line-height: 1.6; } body .pg-event-card-meta-item { align-items: flex-start; } body .pg-event-card-meta-item svg { flex: 0 0 14px; margin-top: .25em; } /* Featured horizontal cards share one breakpoint and media/content balance. */ body :is(.pg-featured-post, .pg-featured-event) { display: grid !important; grid-template-columns: minmax(0, 1fr); } body :is(.pg-featured-img, .pg-featured-event__image) { width: 100% !important; height: auto; aspect-ratio: 16 / 9; } body :is(.pg-featured-content, .pg-featured-event__content) { width: auto !important; min-width: 0; padding: var(--pg-content-card-padding) !important; } body :is(.pg-featured-title, .pg-featured-event__title) { margin: 0 0 .75rem !important; font-size: clamp(1.125rem, 1.5vw, 1.5rem) !important; line-height: 1.45 !important; overflow-wrap: anywhere; } body :is(.pg-featured-excerpt, .pg-featured-event__excerpt) { display: block !important; font-size: var(--pg-content-card-copy) !important; line-height: 1.65; overflow-wrap: anywhere; } @media (min-width: 1024px) { body :is(.pg-featured-post, .pg-featured-event) { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 0; } body :is(.pg-featured-img, .pg-featured-event__image) { height: 100%; aspect-ratio: auto !important; align-self: stretch; } } @media (max-width: 767.98px) { :root { --pg-content-card-padding: .75rem; --pg-content-card-gap: .75rem; --pg-content-card-title: 1rem; --pg-content-card-copy: .875rem; } /* Legacy newsroom !important rules are overridden only at this breakpoint. */ body .pg-newsroom[data-pg-news-slider] .pg-newsroom__grid, body .pg-newsroom__grid { grid-template-columns: minmax(0, 1fr) !important; } body .pg-article-grid, body .pg-blog-index .pg-article-grid, body .pg-knowledge-page .pg-knowledge-grid { grid-template-columns: minmax(0, 1fr); } body .pg-search-grid { grid-template-columns: minmax(0, 1fr) !important; } body.blog .pg-blog-post-list { grid-template-columns: minmax(0, 1fr); gap: 1rem !important; } body.blog .pg-blog-post-list > .pg-article-grid { display: grid; } body.blog .pg-blog-grid-heading { order: 0; } body :is(.pg-card-post, .pg-news-card, .pg-search-card--article, .pg-featured-post, .pg-related-card--article, .pg-carousel-card) { --pg-mobile-card-image-width: clamp(88px, 27vw, 116px); display: flex; flex-direction: row; align-items: center; gap: .75rem; height: auto; padding: .625rem; } body .pg-featured-post { display: flex !important; flex-direction: row !important; } body :is(.pg-card-post__media, .pg-news-card__img, .pg-search-card--article .pg-search-card__img-wrap, .pg-featured-img, .pg-related-card--article .pg-related-thumb, .pg-carousel-card__img-wrap) { flex: 0 0 var(--pg-mobile-card-image-width) !important; width: var(--pg-mobile-card-image-width) !important; min-width: 0; height: auto !important; aspect-ratio: var(--pg-mobile-card-image-ratio, 16 / 9) !important; align-self: center; margin: 0; border-radius: .5rem; overflow: hidden; } body [data-pg-image-shape="square"] { --pg-mobile-card-image-ratio: 1 / 1; } body :is(.pg-card-post__media, .pg-news-card__img, .pg-search-card--article .pg-search-card__img-wrap, .pg-featured-img, .pg-related-card--article .pg-related-thumb, .pg-carousel-card__img-wrap) img { position: static !important; display: block; width: 100%; height: 100% !important; object-fit: cover; opacity: 1 !important; } body :is(.pg-card-post__body, .pg-news-card__body, .pg-search-card--article .pg-search-card__body, .pg-featured-content, .pg-related-post-body, .pg-carousel-card__body) { display: flex; flex-direction: column; flex: 1 1 0; width: auto !important; min-width: 0; gap: .375rem; padding: 0 !important; justify-content: center; } body :is(.pg-card-post__title, .pg-news-card__title, .pg-search-card--article .pg-search-card__title, .pg-featured-title, .pg-related-card--article .pg-related-post-title, .pg-carousel-card__title) { display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-clamp: 2; height: 2.8em; min-height: 2.8em; max-height: 2.8em; margin: 0 !important; overflow: hidden; font-size: 1rem !important; font-weight: 700 !important; line-height: 1.4 !important; white-space: normal; text-overflow: ellipsis; } body :is(.pg-card-post__cat, .pg-news-card__cat, .pg-search-card--article .pg-search-card__label, .pg-card-post__excerpt, .pg-news-card__excerpt, .pg-search-card--article .pg-search-card__excerpt, .pg-card-post__footer, .pg-news-card__footer, .pg-search-card--article .pg-search-card__meta, .pg-card-post__read, .pg-news-card__read-btn, .pg-featured-label, .pg-featured-category, .pg-featured-excerpt, .pg-featured-author, .pg-featured-read, .pg-carousel-card__cat, .pg-carousel-card__date) { display: none !important; } body .pg-missed-posts .pg-carousel-track { display: grid; grid-template-columns: minmax(0, 1fr); gap: .75rem; overflow: visible; } body .pg-missed-posts .pg-carousel-nav { display: none; } body .pg-mobile-post-meta { display: flex; align-items: center; gap: .5rem; min-width: 0; max-width: 100%; color: var(--pg-muted); font-size: .75rem; line-height: 1.4; white-space: nowrap; } .pg-mobile-post-meta__author { flex: 1 1 0; min-width: 0; overflow: hidden; text-overflow: ellipsis; } .pg-mobile-post-meta__views { display: inline-flex; flex: 0 0 auto; align-items: center; gap: .25rem; } .pg-mobile-post-meta__views svg { flex: 0 0 14px; } body .pg-home-grid { grid-template-columns: minmax(0, 1fr) !important; } body :is(.pg-home-col--left, .pg-home-col--right) { grid-column: 1 / -1; } body .pg-home-col--left .pg-home-side-card { border-right: 0; } body .pg-home-col--right { border-top: 1px solid var(--pg-border); } body .pg-side-header { min-height: 0; } } /* Small horizontal recommendation rows keep their image, while text can grow. */ body .pg-related-card { min-width: 0; align-items: start; } body .pg-related-post-body { min-width: 0; flex: 1 1 0; } .pg-related-thumb--placeholder { display: none; } @media (max-width: 767.98px) { body .pg-related-card--article { align-items: center; } body .pg-related-thumb--placeholder { display: block; } } body .pg-related-card > div:not(.pg-related-thumb) { min-width: 0; } body .pg-related-card .pg-related-post-title { font-size: .9375rem; } body .pg-event-item__title { font-size: 1rem; } @media (prefers-reduced-motion: reduce) { body :is(.pg-card-post, .pg-news-card, .pg-service-card, .pg-hub-card, .pg-event-card) { transition: none; } } /* PsyGuild source: mobile-navigation.css */ /* Shared mobile shell; all colors come from the current Theme settings. */ .pg-personal-bottom-nav, .pg-mobile-login, .pg-mobile-theme-control, .pg-mobile-editor-actions { display: none; } .pg-mobile-back { display: none; } .pg-header-cart { align-items: center; color: var(--pg-header-text-strong, var(--pg-text)); display: inline-flex; justify-content: center; min-width: 44px; min-height: 44px; position: relative; text-decoration: none; } .pg-header-cart__count { align-items: center; background: var(--pg-primary); border-radius: 999px; color: var(--pg-primary-contrast, #fff); display: inline-flex; font-size: 11px; font-weight: var(--pg-weight-strong,700); justify-content: center; min-width: 18px; min-height: 18px; padding: 1px 4px; position: absolute; right: 0; top: 0; } .pg-management-sheet { background: linear-gradient(var(--pg-surface-strong), var(--pg-surface-strong)), var(--pg-bg); border: 1px solid var(--pg-border); border-radius: 20px 20px 0 0; color: var(--pg-text); font-family: var(--pg-font-sans, sans-serif); inset: auto 0 0; margin: auto auto 0; max-height: min(85dvh, 44rem); max-width: 36rem; overflow-y: auto; overscroll-behavior: contain; padding: 0 1rem calc(1rem + env(safe-area-inset-bottom)); width: 100%; } .pg-management-sheet:not([open]) { display: none; } .pg-management-sheet::backdrop { background: color-mix(in srgb, var(--pg-dark) 55%, transparent); } .pg-management-sheet__head { align-items: center; background: linear-gradient(var(--pg-surface-strong), var(--pg-surface-strong)), var(--pg-bg); border-bottom: 1px solid var(--pg-border); display: flex; gap: 0.75rem; justify-content: space-between; padding: 0.75rem 0; position: sticky; top: 0; z-index: 1; } .pg-management-sheet h2 { color: var(--pg-dark); font-size: 1.1rem; line-height: 1.4; margin: 0; } .pg-management-sheet__head button { background: var(--pg-bg-soft); border: 1px solid var(--pg-border); border-radius: 50%; color: var(--pg-text); flex-shrink: 0; font-size: 1.5rem; height: 44px; width: 44px; } .pg-management-sheet nav { display: grid; gap: 0.35rem; padding-top: 0.6rem; } .pg-management-sheet nav a { align-items: center; border-radius: 0.7rem; color: var(--pg-text); display: flex; gap: 0.75rem; min-height: 52px; padding: 0.6rem 0.75rem; text-decoration: none; } .pg-management-sheet nav a span:first-of-type { flex: 1; min-width: 0; overflow-wrap: anywhere; } .pg-management-sheet nav a svg { flex-shrink: 0; } .pg-management-sheet nav a[aria-current="page"] { background: color-mix(in srgb, var(--pg-primary) 12%, var(--pg-bg)); color: var(--pg-link); font-weight: var(--pg-weight-strong,700); } .pg-management-sheet :focus-visible, .pg-personal-bottom-nav :focus-visible { outline: 2px solid var(--pg-primary); outline-offset: -3px; } body.pg-management-open { overflow: hidden; } @media (max-width: 767.98px) { body.pg-personal-surface:not(.pg-has-personal-nav):not(.pg-mobile-editor):not(.pg-mobile-cart):not(.pg-mobile-checkout) { padding-bottom: env(safe-area-inset-bottom); } body.pg-has-personal-nav { padding-bottom: calc(72px + env(safe-area-inset-bottom)); } body.pg-mobile-editor, body.pg-mobile-cart, body.pg-mobile-checkout { padding-bottom: calc(88px + env(safe-area-inset-bottom)); } body .pg-site-header { height: 56px !important; backdrop-filter: none !important; -webkit-backdrop-filter: none !important; } body .pg-site-header__inner { height: 56px !important; min-height: 56px !important; gap: 4px !important; padding: 6px max(6px, env(safe-area-inset-right)) 6px max(6px, env(safe-area-inset-left)) !important; } body .pg-site-header-spacer { height: 56px !important; } body .pg-site-header__left { flex: 1; gap: 4px; min-width: 0; } body .pg-site-header__right { flex-shrink: 0; gap: 2px; } body .pg-site-header .pg-btn-icon, .pg-mobile-login { align-items: center; display: inline-flex; flex: 0 0 44px; height: 44px !important; justify-content: center; min-width: 44px !important; padding: 0 !important; width: 44px !important; } body .pg-site-header #pg-theme-toggle { display: none; } body .pg-site-header :is(#pg-sidebar-toggle, #pg-search-toggle, #pg-header-account-toggle) { height: 44px !important; min-height: 44px !important; max-height: 44px !important; width: 44px !important; min-width: 44px !important; max-width: 44px !important; padding: 0 !important; } body:not(.pg-book-reader-active) .pg-site-header #pg-search-dropdown { position: fixed; top: 56px; inset-inline: max(10px, env(safe-area-inset-left)) max(10px, env(safe-area-inset-right)); width: auto; max-width: none; box-sizing: border-box; } body:not(.pg-book-reader-active) .pg-site-header #pg-search-dropdown:not(.is-open) { display: none; } body:not(.pg-book-reader-active) .pg-site-header #pg-search-dropdown .pg-search-input { min-width: 0; } body .pg-site-header #pg-header-account-toggle > .pg-account-fallback { display: block !important; } body:has(.pg-header-account.is-open) :is(.pg-mobile-bottom-bar, .pg-personal-bottom-nav, .pg-mobile-editor-actions, .wc-proceed-to-checkout, #place_order) { visibility: hidden; } .pg-mobile-theme-control { align-items: center; background: transparent; border: 0; color: var(--pg-text); display: flex; gap: 0.75rem; min-height: 44px; text-align: left; } .pg-header-account__links .pg-mobile-theme-control { padding: 0.75rem; width: 100%; } body .pg-logo-link { gap: 5px; min-width: 0; overflow: hidden; } body .pg-logo-icon { border-radius: 8px; flex: 0 0 28px; height: 28px; width: 28px; } body .pg-logo-img { max-height: 32px; max-width: 108px; object-fit: contain; } body .pg-logo-text { min-width: 0; } body .pg-logo-title { font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } body .pg-logo-desc, body .pg-site-header__center, body .pg-header-account__label, body .pg-header-account__chevron { display: none !important; } body .pg-header-account__menu { max-height: calc(100dvh - 70px); max-width: calc(100vw - 20px); overflow-y: auto; overscroll-behavior: contain; right: 0; width: min(320px, calc(100vw - 20px)); } body .pg-header-account__links a, body .pg-header-account__logout { min-height: 44px; } body .pg-sidebar-overlay { z-index: 120; } body .pg-sidebar-drawer { background: linear-gradient(var(--pg-surface-strong), var(--pg-surface-strong)), var(--pg-bg) !important; max-width: 85vw; overscroll-behavior: contain; padding-bottom: calc(1rem + env(safe-area-inset-bottom)); transition: transform 180ms ease-out; width: 85vw; z-index: 121; } body .pg-sidebar-drawer :where(a, button, select) { min-height: 44px; } body.logged-in .pg-sidebar-drawer .pg-mobile-theme-control, body .pg-sidebar-rank-form { display: none; } body.pg-personal-surface .pg-onboarding-portal-launcher { display: none; } .pg-mobile-back { align-items: center; color: var(--pg-link); display: inline-flex; gap: 0.6rem; font-size: 0.875rem; font-weight: 700; min-height: 44px; padding-inline: 0.4rem; text-decoration: none; } .pg-mobile-back > span:first-child { font-size: 1.3rem; } body.pg-personal-surface .pg-portal-sidebar { display: none !important; } body.pg-personal-surface .pg-portal { gap: 0; padding-inline: max(12px, env(safe-area-inset-left)); width: 100%; } body.pg-personal-surface .pg-portal-main { padding: 1rem 0 !important; } .pg-personal-bottom-nav { align-items: stretch; background: linear-gradient(var(--pg-surface-strong), var(--pg-surface-strong)), var(--pg-bg); border-top: 1px solid var(--pg-border); bottom: 0; display: flex; inset-inline: 0; min-height: calc(64px + env(safe-area-inset-bottom)); padding: 3px max(6px, env(safe-area-inset-right)) calc(3px + env(safe-area-inset-bottom)) max(6px, env(safe-area-inset-left)); position: fixed; z-index: 80; } .pg-personal-bottom-nav a, .pg-personal-bottom-nav button { align-items: center; background: transparent; border: 0; border-radius: 10px; color: var(--pg-muted); display: flex; flex: 1; flex-direction: column; font: inherit; font-size: 11px; font-weight: 700; gap: 5px; justify-content: center; line-height: 1.3; min-height: 52px; min-width: 44px; padding: 4px; text-decoration: none; touch-action: manipulation; } .pg-personal-bottom-nav [aria-current="page"], .pg-personal-bottom-nav .is-active { background: color-mix(in srgb, var(--pg-primary) 9%, transparent); color: var(--pg-link); } .pg-personal-bottom-nav svg { flex-shrink: 0; } body.pg-has-personal-nav #pg-scroll-top { bottom: calc(80px + env(safe-area-inset-bottom)); } .pg-mobile-editor-actions { align-items: stretch; background: linear-gradient(var(--pg-surface-strong), var(--pg-surface-strong)), var(--pg-bg); border-top: 1px solid var(--pg-border); bottom: 0; display: grid; gap: 6px; grid-template-columns: repeat(3, minmax(0, 1fr)); inset-inline: 0; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)); position: fixed; z-index: 80; } .pg-mobile-editor-actions .pg-btn { font-size: 12px !important; line-height: 1.3; min-height: 44px; min-width: 0; padding: 8px 4px !important; white-space: normal; width: 100%; } .pg-mobile-editor .pg-publish-split__toggle { display: none; } body.pg-mobile-editor :where(.pg-portal, .pg-portal-main, #pg-frontend-editor, .pg-editor-layout-column), body.pg-shopping-surface :where(.pg-portal, .pg-portal-main, .pg-portal-commerce) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; filter: none !important; transform: none !important; } body.pg-mobile-cart .wc-proceed-to-checkout { background: linear-gradient(var(--pg-surface-strong), var(--pg-surface-strong)), var(--pg-bg); border-top: 1px solid var(--pg-border); bottom: 0; inset-inline: 0; margin: 0 !important; padding: 10px 12px calc(10px + env(safe-area-inset-bottom)) !important; position: fixed; z-index: 80; } body.pg-mobile-cart .wc-proceed-to-checkout .checkout-button { align-items: center; box-sizing: border-box; display: flex; flex-wrap: wrap; gap: 0.35rem; justify-content: center; min-height: 44px; padding: 10px !important; width: 100%; } body.pg-mobile-checkout #place_order { bottom: max(10px, env(safe-area-inset-bottom)); box-sizing: border-box !important; float: none; inset-inline: 12px; margin: 0; min-height: 48px; padding: 12px; position: fixed; width: auto !important; z-index: 80; } body.pg-shopping-surface .pg-portal-commerce .button, body.pg-shopping-surface .pg-portal-commerce input.qty { min-height: 44px; min-width: 44px; } body.pg-mobile-cart .woocommerce a.remove { align-items: center; display: inline-flex; height: 44px; justify-content: center; width: 44px; } body.pg-mobile-cart .woocommerce tr.woocommerce-cart-form__cart-item { background: var(--pg-bg-soft); border-bottom: 1px solid var(--pg-border); display: grid !important; gap: 8px 12px; grid-template-areas: "image name remove" "image price remove" "image quantity quantity" "subtotal subtotal subtotal"; grid-template-columns: 64px minmax(0, 1fr) 44px; margin: 0; padding: 12px; } body.pg-mobile-cart .woocommerce tr.woocommerce-cart-form__cart-item td { background: transparent !important; border: 0; display: block !important; float: none; min-width: 0; overflow-wrap: anywhere; padding: 0 !important; text-align: left !important; } body.pg-mobile-cart .woocommerce td.product-thumbnail { grid-area: image; } body.pg-mobile-cart .woocommerce td.product-thumbnail img { height: 64px; object-fit: contain; width: 64px; } body.pg-mobile-cart .woocommerce td.product-thumbnail::before, body.pg-mobile-cart .woocommerce td.product-name::before, body.pg-mobile-cart .woocommerce td.product-price::before { display: none !important; } body.pg-mobile-cart .woocommerce td.product-name { font-size: 15px; font-weight: 700; grid-area: name; line-height: 1.5; } body.pg-mobile-cart .woocommerce td.product-price { grid-area: price; } body.pg-mobile-cart .woocommerce td.product-remove { grid-area: remove; } body.pg-mobile-cart .woocommerce td.product-quantity { align-items: center; display: flex !important; gap: 8px; grid-area: quantity; } body.pg-mobile-cart .woocommerce td.product-quantity input.qty { max-width: 70px; } body.pg-mobile-cart .woocommerce td.product-subtotal { border-top: 1px solid var(--pg-border); grid-area: subtotal; padding-top: 8px !important; text-align: right !important; } body.pg-mobile-cart .woocommerce .coupon { display: grid; gap: 8px; grid-template-columns: minmax(0, 1fr) auto; width: 100%; } body.pg-mobile-cart .woocommerce .coupon::before, body.pg-mobile-cart .woocommerce .coupon::after { display: none !important; } body.pg-mobile-cart .woocommerce .coupon label { clip-path: inset(50%); height: 1px; overflow: hidden; position: absolute; white-space: nowrap; width: 1px; } body.pg-mobile-cart .woocommerce .coupon input.input-text { background: var(--pg-bg); border: 1px solid var(--pg-border); border-radius: 8px; box-sizing: border-box; color: var(--pg-text); font: inherit; min-height: 44px; padding: 10px; width: 100% !important; } body.pg-mobile-cart .woocommerce .coupon .button { margin: 0; padding-inline: 14px; white-space: nowrap; width: auto !important; } body.pg-mobile-cart .woocommerce :is(td.product-quantity, td.product-subtotal, .cart_totals td)::before { margin-right: 6px; } body.pg-mobile-checkout #pg-scroll-top, body.pg-mobile-editor #pg-scroll-top { display: none; } body.pg-mobile-checkout .pg-mobile-bottom-bar { display: none; } } @media (max-width: 359px) { body.pg-shopping-surface .pg-logo-icon { display: none; } body.pg-shopping-surface .pg-logo-title { font-size: 14px; } body.pg-mobile-cart .woocommerce .coupon { grid-template-columns: minmax(0, 1fr); } } @media (prefers-reduced-motion: reduce) { body .pg-sidebar-drawer { transition: none; } } /* Public route wheel: a fixed circular target with native horizontal snap scrolling. */ @media(max-width:767px){ html body.wp-theme-psyguild-theme .pg-mobile-route-wheel{display:block!important;padding:0 0 env(safe-area-inset-bottom)!important;overflow:visible;background:var(--pg-block-bg)!important;color:var(--pg-text);height:calc(92px + env(safe-area-inset-bottom));touch-action:pan-x} body:has([data-pg-route-wheel]){padding-bottom:calc(106px + env(safe-area-inset-bottom))} .pg-route-wheel-ring{position:absolute;z-index:0;pointer-events:none;width:56px;height:56px;left:calc(50% - 28px);top:5px;border-radius:50%;background:var(--pg-primary);box-shadow:0 3px 12px color-mix(in srgb,var(--pg-primary) 20%,transparent)} .pg-route-wheel-track{position:relative;display:flex;align-items:stretch;gap:0;width:100%;height:92px;padding-inline:calc(50% - 42px);box-sizing:border-box;overflow-x:auto;overflow-y:hidden;scroll-snap-type:x mandatory;scroll-padding:0;overscroll-behavior-x:contain;touch-action:pan-x;scrollbar-width:none;-webkit-overflow-scrolling:touch;mask-image:linear-gradient(90deg,transparent,#000 9%,#000 91%,transparent)} .pg-route-wheel-track::-webkit-scrollbar{display:none} .pg-route-wheel-track.is-rebasing{scroll-snap-type:none;scroll-behavior:auto} .pg-route-wheel-track::before,.pg-route-wheel-track::after{content:none!important} html body.wp-theme-psyguild-theme .pg-route-wheel-tab{flex:0 0 84px;min-width:84px;display:flex;align-items:center;flex-direction:column;justify-content:flex-start;gap:4px;padding:5px 0 7px;scroll-snap-align:center;scroll-snap-stop:always;color:var(--pg-muted);background:transparent!important;text-decoration:none;font:500 10px/1.3 var(--pg-interface-font);border:0;user-select:none;-webkit-user-select:none;touch-action:pan-x} .pg-route-wheel-icon{display:flex;align-items:center;justify-content:center;flex:none;width:56px;height:56px;border-radius:50%;transition:color .15s ease,transform .15s ease} .pg-route-wheel-icon svg{width:23px;height:23px;pointer-events:none} html body.wp-theme-psyguild-theme .pg-route-wheel-tab.is-centered{color:var(--pg-text);font-weight:600} .pg-route-wheel-tab.is-centered .pg-route-wheel-icon{color:var(--pg-primary-contrast,#fff);transform:scale(1.06)} .pg-route-wheel-tab.is-current:not(.is-centered) .pg-route-wheel-icon{color:var(--pg-link)} .pg-route-wheel-tab:focus-visible{outline:2px solid var(--pg-link);outline-offset:-3px;border-radius:12px} } @media(prefers-reduced-motion:reduce){.pg-route-wheel-icon{transition:none}} /* A smaller floating dock keeps the centre selector and native looping rail. */ @media(max-width:767px){ html body.wp-theme-psyguild-theme .pg-mobile-route-wheel{left:10px!important;right:10px!important;bottom:calc(8px + env(safe-area-inset-bottom))!important;width:calc(100% - 20px)!important;height:74px!important;padding:0!important;border:1px solid var(--pg-border)!important;border-radius:20px!important;box-shadow:0 5px 22px color-mix(in srgb,var(--pg-text) 9%,transparent)!important;backdrop-filter:none;-webkit-backdrop-filter:none} body:has([data-pg-route-wheel]){padding-bottom:calc(96px + env(safe-area-inset-bottom))} .pg-route-wheel-ring{width:48px;height:48px;left:calc(50% - 24px);top:4px;box-shadow:none} .pg-route-wheel-track{height:72px;padding-inline:calc(50% - 37px);border-radius:19px;mask-image:linear-gradient(90deg,transparent,#000 7%,#000 93%,transparent)} html body.wp-theme-psyguild-theme .pg-route-wheel-tab{flex-basis:74px;min-width:74px;height:72px;padding:4px 0 5px;gap:3px;font-size:10px;font-weight:500;line-height:1.3} .pg-route-wheel-icon{width:48px;height:48px} .pg-route-wheel-icon svg{width:21px;height:21px} .pg-route-wheel-tab.is-centered .pg-route-wheel-icon{transform:none} } @media(max-width:767px){ html body.wp-theme-psyguild-theme .pg-mobile-route-wheel{border-radius:24px!important} .pg-route-wheel-ring{outline:1px solid color-mix(in srgb,var(--pg-primary) 25%,transparent);outline-offset:3px} .pg-route-wheel-ring::after{content:'';position:absolute;width:3px;height:3px;border-radius:50%;top:3px;left:calc(50% - 1.5px);background:var(--pg-primary-contrast,#fff);opacity:.65} .pg-route-wheel-icon svg{width:19px;height:19px} html body.wp-theme-psyguild-theme .pg-route-wheel-tab.is-centered{letter-spacing:.2px} } /* PsyGuild source: solid-surfaces.css */ /* Final surface contract: content panels are opaque in both themes. * Overlay scrims and decorative gradients keep their separate purpose. */ @layer psyguild-opaque-surfaces { :root { --pg-solid-section:#fff; --pg-solid-block:#fff; --pg-solid-header:#fff; --pg-solid-footer:#fff; } body { --pg-surface:var(--pg-solid-section)!important; --pg-surface-strong:var(--pg-solid-block)!important; --pg-section-bg:var(--pg-solid-section)!important; --pg-block-bg:var(--pg-solid-block)!important; --pg-color-surface:var(--pg-solid-section)!important; --pg-color-surface-strong:var(--pg-solid-block)!important; --pg-space-light-surface:var(--pg-solid-section)!important; --pg-space-light-surface-strong:var(--pg-solid-block)!important; --pg-header-bg:var(--pg-solid-header)!important; --pg-color-header:var(--pg-solid-header)!important; --pg-footer-bg:var(--pg-solid-footer)!important; --pg-color-footer:var(--pg-solid-footer)!important; --pg-comment-bg:var(--pg-solid-block)!important; --pg-bg-soft:color-mix(in srgb,var(--pg-solid-block) 96%,#172b46)!important; } body.pg-theme-dark { --pg-solid-section:#0b1d35; --pg-solid-block:#102645; --pg-solid-header:#0b1d35; --pg-solid-footer:#0b1d35; --pg-bg-soft:#183552!important; } body :is( .pg-card,.pg-card-strong,.pg-card-post,.pg-news-card,.pg-service-card,.pg-event-card,.pg-app-card,.pg-search-card,.pg-author-card,.pg-author-item,.pg-event-item,.pg-highlight-card,.pg-featured-post-card,.pg-featured-event, .pg-home-side-card,.pg-home-media,.pg-newsroom,.pg-services-section,.pg-blog-index-header, .pg-portal-card,.psyguild-portal-card,.pg-portal-empty,.pg-portal-filterbar,.pg-portal-sidebar,.pg-single-sidebar,.pg-comments-area, .pg-sidebar-drawer,.pg-search-dropdown,.pg-header-account__menu, .pg-popup-content,.pg-auth-card,.pg-modal-card,.pg-contributor-request-modal__dialog,.pg-author-stats-modal__dialog,.pg-author-manager__dialog-panel, .pg-onboarding-dialog,.pg-onboarding-card,.pg-onboarding__panel,.pg-post-detail,.pg-management-sheet,.pg-management-sheet__head,.pg-drive, .pg-personal-bottom-nav,.pg-mobile-bottom-bar,.pg-mobile-editor-actions,.pg-commerce-sticky-summary,.pg-mobile-checkout-actions ) { background-color:var(--pg-solid-block)!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; } body :is(.pg-site-header,.pg-site-header__inner,.pg-sub-header) { background-color:var(--pg-solid-header)!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; } /* Desktop header is a floating capsule, with no full-width white strip behind it. */ @media(min-width:768px){body .pg-site-header{background:transparent!important}} body :is(.pg-site-footer,.pg-site-footer__overlay) { background-color:var(--pg-solid-footer)!important; } /* Table rows sit above the animated page background on the author workspace. */ body .pg-post-manager :is(.pg-posts-table,.pg-post-summary-cell,.pg-post-card-row) { background-color:var(--pg-solid-block)!important; } } /* PsyGuild source: swipe-tabs.css */ /* Existing tab appearance stays owned by each page; the shared rail adds swipe/snap. */ .pg-swipe-tabs:not([aria-orientation="vertical"]){scrollbar-width:none!important;overscroll-behavior-x:contain;scroll-snap-type:x mandatory} .pg-swipe-tabs::-webkit-scrollbar{display:none!important;width:0!important;height:0!important} .pg-swipe-tabs>a,.pg-swipe-tabs>button,.pg-swipe-tabs>li{scroll-snap-align:center;scroll-snap-stop:always} .pg-page-swipe-surface :is(.pg-post-stream,.pg-discussion-feed,.pg-community-feed,.pg-studio-podium,.pg-studio-ranking-layout,#pg-hub-grid,[data-catalog-grid],.pg-author-tab-pane,#pg-policy-content-container){touch-action:pan-y pinch-zoom} .pg-page-swipe-surface.pg-page-swipe-dragging{transform:translateX(var(--pg-page-swipe-x,0px));will-change:transform} @media(prefers-reduced-motion:reduce){.pg-page-swipe-surface.pg-page-swipe-dragging{transform:none}} /* PsyGuild source: brand-experience.css */ /* PsyGuild art / technology presentation. All colours originate in Customizer tokens. * Existing routes, forms, hidden states, reader controls and mobile navigation stay owned * by their original modules. This layer changes presentation, never application data. */ body{ --pg-brand-ink:color-mix(in srgb,var(--pg-primary) 8%,#09152b); --pg-brand-stage:color-mix(in srgb,var(--pg-primary) 16%,#0a1931); --pg-brand-paper:color-mix(in srgb,var(--pg-secondary) 8%,white); --pg-brand-serif:var(--pg-interface-font); --pg-brand-sans:var(--pg-interface-font); --pg-brand-gradient:var(--pg-action-gradient); --pg-gradient:var(--pg-action-gradient); --pg-brand-shadow:0 8px 26px color-mix(in srgb,var(--pg-primary-deep) 7%,transparent); font-family:var(--pg-brand-sans); } html body.wp-theme-psyguild-theme:is(.pg-theme-light,.pg-theme-dark):not(.pg-book-reader-active):not(.pg-portal-page){ background-image:var(--pg-body-bg-image),radial-gradient(circle at 65% 0%,color-mix(in srgb,var(--pg-primary) 6%,transparent),transparent 50%),linear-gradient(color-mix(in srgb,var(--pg-text) 2%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--pg-text) 2%,transparent) 1px,transparent 1px)!important; background-size:cover,100% 900px,36px 36px,36px 36px!important; } body :is(.pg-card,.pg-card-strong,.pg-hub-card,.pg-app-card,.pg-event-card,.pg-service-card,.pg-search-card,.pg-card-author,.pg-featured-event,.pg-authors-shell,.pg-authors-toolbar,.pg-blog-index-header,.pg-home-media,.pg-services-section){ border-radius:12px!important;border-color:var(--pg-border);box-shadow:var(--pg-brand-shadow)!important; } body :is(.pg-btn,.pg-hub-tab-btn,.pg-filter-btn,.pg-event-tab-btn){border-radius:7px;letter-spacing:0;} body :is(.pg-hub-title,.pg-blog-index-title,.pg-search-title,.pg-newsroom__title,.pg-services__title,.pg-side-header__title,.pg-home-media__title,.pg-authors-heading h1){ font-family:var(--pg-brand-serif)!important;font-weight:400!important;letter-spacing:-.025em;color:var(--pg-text); } body :is(.pg-hub-title,.pg-blog-index-title,.pg-authors-heading h1){font-size:clamp(2rem,3.2vw,3rem)!important;line-height:1.14!important;} body :is(.pg-overview-heading,.pg-brand-kicker){font:700 10px/1.6 var(--pg-brand-sans);letter-spacing:.11em;text-transform:uppercase;color:var(--pg-link);} body :is(.pg-hub-tabs,.pg-author-tabs,.pg-newsroom__tabs){scrollbar-width:thin;scrollbar-color:var(--pg-border) transparent;} body :is(.pg-hub-tab-btn,.pg-author-tab,.pg-event-tab-btn){font-family:var(--pg-brand-sans);} body :is(.pg-hub-tab-btn.is-active,.pg-author-tab.is-active){box-shadow:inset 0 -2px 0 var(--pg-primary);} body :is(.pg-hub-card-title,.pg-event-card-title,.pg-service-card__title,.pg-card-author__name,.pg-news-card__title,.pg-card-post__title){font-family:var(--pg-brand-serif);letter-spacing:-.015em;line-height:1.28;} body .pg-site-footer{border-top:1px solid var(--pg-border);box-shadow:none;} body .pg-footer-heading{font:700 11px/1.5 var(--pg-brand-sans);letter-spacing:.09em;} body.wp-theme-psyguild-theme .pg-logo-watermark-bg{opacity:.08!important;} body :is(.pg-header-account__menu,.pg-search-dropdown,.pg-sidebar-drawer,.pg-popup-content,.pg-modal-card){border-radius:12px;box-shadow:0 16px 48px color-mix(in srgb,var(--pg-text) 15%,transparent);} body :is(button,a,input,select,textarea):focus-visible{outline:2px solid var(--pg-primary-deep);outline-offset:3px;} .pg-brand-hero [hidden]{display:none!important} html body.wp-theme-psyguild-theme :is(.pg-hub-title,.pg-blog-index-title,.pg-search-title,.pg-newsroom__title,.pg-services__title,.pg-side-header__title,.pg-home-media__title,.pg-authors-heading h1), html body.wp-theme-psyguild-theme .pg-author-page h1.pg-author-name{ color:var(--pg-text)!important;background:none!important;-webkit-text-fill-color:currentColor!important; } /* Brand stage: the whole navy block is the movement space. */ .pg-brand-hero{display:none} .pg-brand-hero .home-welcome-copy{position:relative;display:flex;flex-direction:column;align-items:center;width:100%;text-align:center;} .pg-brand-hero .pg-hero-title{position:relative;z-index:3;isolation:isolate;display:flex;flex-direction:column;align-items:center;gap:10px;margin:0 0 14px;} .pg-brand-hero .pg-title-brand{display:inline-block;font:700 76px/1 var(--pg-brand-sans);letter-spacing:-.055em;color:var(--pg-brand-paper);background:linear-gradient(110deg,var(--pg-brand-paper),var(--pg-primary));-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;} .pg-brand-hero .pg-title-brand-dot{-webkit-text-fill-color:var(--pg-primary);} .pg-brand-hero .pg-title-tagline{display:block;font:400 29px/1.2 var(--pg-brand-serif);color:var(--pg-brand-paper);} .pg-brand-hero .pg-title-word{position:relative;z-index:1;display:inline-block;} .pg-brand-hero em .pg-title-word{color:var(--pg-secondary);} @media (min-width:768px) and (prefers-reduced-motion:no-preference){ .pg-brand-hero .pg-title-brand{animation:pg-title-reveal 1.2s ease-out both;} .pg-brand-hero .pg-title-word{animation:pg-title-reveal .7s ease-out both;} .pg-brand-hero .pg-title-word:nth-child(1){animation-delay:.8s;} .pg-brand-hero .pg-title-word:nth-child(2){animation-delay:1s;} .pg-brand-hero .pg-title-word:nth-child(3){animation-delay:1.2s;} .pg-brand-hero em .pg-title-word:nth-child(1){animation-delay:1.4s;} .pg-brand-hero em .pg-title-word:nth-child(2){animation-delay:1.6s;} } @keyframes pg-title-reveal{ from{opacity:0;clip-path:inset(-30% 100% -30% 0);} to{opacity:1;clip-path:inset(-30% 0 -30% 0);} } .pg-brand-hero .home-welcome-copy>p{position:relative;z-index:3;order:1;margin:0;font:400 14px/1.85 var(--pg-brand-sans);color:color-mix(in srgb,var(--pg-brand-paper) 76%,transparent);} .pg-brand-hero .eyebrow{position:relative;z-index:3;order:2;margin-top:16px;font:400 9px/1.5 var(--pg-brand-sans);letter-spacing:.12em;color:color-mix(in srgb,var(--pg-brand-paper) 56%,transparent);} .pg-brand-entrypoints{position:relative;z-index:3;display:flex;justify-content:center;gap:12px;} .pg-brand-entrypoints>a{display:grid;grid-template-columns:25px auto;grid-template-rows:auto auto;gap:1px 12px;align-items:center;min-width:178px;padding:11px 18px;border:1px solid color-mix(in srgb,var(--pg-primary) 24%,transparent);border-radius:7px;color:var(--pg-brand-paper);background:color-mix(in srgb,var(--pg-primary) 4%,transparent);text-decoration:none;transition:background .18s,border-color .18s;} .pg-brand-entrypoints>a>span{grid-column:1;grid-row:1/3;color:var(--pg-stage-primary);font-size:20px;} .pg-brand-entrypoints strong{grid-column:2;font:700 12px/1.5 var(--pg-brand-sans);} .pg-brand-entrypoints small{grid-column:2;font:400 10px/1.5 var(--pg-brand-sans);color:color-mix(in srgb,var(--pg-brand-paper) 70%,transparent);} .pg-brand-entrypoints>a:hover{background:color-mix(in srgb,var(--pg-primary) 12%,transparent);border-color:var(--pg-primary);} /* Public catalogs retain their original data, filters and pagination. */ .pg-brand-section-head{display:flex;align-items:end;justify-content:space-between;gap:18px;margin-bottom:24px;} .pg-brand-section-head h2{font:400 32px/1.2 var(--pg-brand-serif);letter-spacing:-.025em;margin:6px 0 0;color:var(--pg-text);} .pg-brand-tools{margin-block:48px;scroll-margin-top:120px;} .pg-brand-tools__layout{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.2fr);gap:28px;align-items:start;} .pg-brand-tools__list{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;} .pg-brand-tool{display:flex;flex-direction:column;min-width:0;padding:16px;border:1px solid var(--pg-border);border-radius:10px;background:var(--pg-block-bg);text-decoration:none;color:var(--pg-text);box-shadow:var(--pg-brand-shadow);} .pg-brand-tool__art{display:block;height:88px;margin:-16px -16px 14px;overflow:hidden;border-radius:9px 9px 0 0;color:var(--pg-stage-primary);background:linear-gradient(140deg,var(--pg-brand-stage),var(--pg-brand-ink));} .pg-brand-tool__art svg{display:block;width:100%;height:100%;stroke:currentColor;stroke-width:.7;} .pg-brand-tool strong{font:700 14px/1.45 var(--pg-brand-sans);overflow-wrap:anywhere;} .pg-brand-tool__open{display:flex;justify-content:space-between;margin-top:auto;padding-top:14px;font-size:11px;color:var(--pg-link);} .pg-brand-tool:hover{border-color:var(--pg-primary);} .pg-brand-home :is(.pg-newsroom,.pgServices,#pgBrandTools){scroll-margin-top:120px;} .pg-brand-home .pg-newsroom__title{font-size:30px;} .pg-brand-home .pg-newsroom-tab{border-radius:5px!important;font-size:12px!important;padding:7px 11px!important;} .pg-brand-home .pg-newsroom-tab.is-active{background:color-mix(in srgb,var(--pg-primary) 12%,var(--pg-block-bg))!important;color:var(--pg-link)!important;border-color:var(--pg-border)!important;} .pg-brand-home .pg-tab-progress{background:var(--pg-primary)!important;} .pg-brand-home .pg-news-card{border-radius:9px;box-shadow:none;border-color:var(--pg-border);} .pg-brand-home .pg-news-card__title{font-size:20px;font-weight:400;line-height:1.3;} .pg-brand-home .pg-hero-wrap{min-width:0;} .pg-brand-home .pg-hero-main{border-radius:10px;} .pg-brand-home .pg-home-side-card{min-height:0;height:auto;padding:20px;} .pg-brand-home .pg-side-header{align-items:start;flex-direction:column;gap:10px;} .pg-brand-home .pg-side-header__title{font-size:26px;} .pg-brand-home .pg-side-header__subtitle{font-size:9px;letter-spacing:.1em;} .pg-brand-home .pg-event-item{padding:15px 0;border:0;border-radius:0;border-bottom:1px solid var(--pg-border);box-shadow:none;background:transparent;} .pg-brand-home .pg-event-item__title{font:700 13px/1.6 var(--pg-brand-sans);} .pg-brand-home .pg-event-item__meta{font-size:10px;line-height:1.65;} .pg-brand-home .pg-author-item{padding:16px 0;gap:11px;border:0;border-radius:0;border-bottom:1px solid var(--pg-border);box-shadow:none;} .pg-brand-home .pg-author-name{font:700 13px/1.45 var(--pg-brand-sans);} .pg-brand-home .pg-author-avatar{width:43px;height:43px;border-radius:50%;} .pg-brand-home .pg-author-online-dot{display:none;} .pg-brand-home .pg-author-role,.pg-brand-home .pg-author-stat{font-size:10px;line-height:1.6;} .pg-brand-home .pg-author-ranks{gap:3px;} .pg-brand-home .pg-author-rank{font-size:8px;} /* A profile overview draws from its existing public tabs. */ .pg-profile-summary{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px;margin-top:24px;} .pg-profile-summary__card{padding:24px;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-block-bg);box-shadow:var(--pg-brand-shadow);min-width:0;} .pg-profile-summary__head{display:flex;align-items:center;justify-content:space-between;gap:14px;margin-bottom:14px;} .pg-profile-summary__head h3{font:400 24px/1.25 var(--pg-brand-serif);margin:0;color:var(--pg-text);} .pg-profile-summary__head button{padding:7px 0;border:0;background:none;font:700 11px/1.5 var(--pg-brand-sans);color:var(--pg-link);cursor:pointer;} .pg-profile-summary ul{list-style:none;margin:0;padding:0;} .pg-profile-summary li+li{border-top:1px solid var(--pg-border);} .pg-profile-summary li{padding-block:10px;font:400 13px/1.65 var(--pg-brand-sans);overflow-wrap:anywhere;} .pg-profile-summary li a{color:var(--pg-text);text-decoration:none;} .pg-profile-summary li a:hover{color:var(--pg-link);} .pg-profile-summary p{font-size:13px;line-height:1.8;color:var(--pg-muted);margin:0;} .pg-profile-summary__caption{display:block;margin:5px 0 0;font-size:11px;color:var(--pg-muted);} body .pg-author-page .pg-author-tabs-wrap{border-radius:9px!important;box-shadow:none;} #pgAuthorTabs{scroll-margin-top:110px;} body .pg-author-page .pg-author-tab{border-radius:0;padding:15px 22px;font-size:12px;} body .pg-author-page .pg-overview-title{font:400 27px/1.25 var(--pg-brand-serif);} body .pg-author-page .pg-overview-text{font-size:14px;line-height:1.95;} body .pg-author-page :is(.pg-overview-col,.pg-author-credentials-card,.pg-author-landing-card,.pg-contact-panel){border-radius:12px!important;} @media(min-width:768px){ body .pg-site-header__inner{border-radius:10px!important;border:1px solid var(--pg-border);box-shadow:var(--pg-brand-shadow)!important;} body .pg-main-nav{gap:22px;} body .pg-main-nav a{font:700 12px/1.5 var(--pg-brand-sans);letter-spacing:0;} body .pg-logo-title{font:700 23px/1.2 var(--pg-brand-sans);letter-spacing:-.035em;} body .pg-logo-desc{font-size:8px;letter-spacing:.07em;} body .pg-btn{border-radius:7px!important;} .pg-brand-hero{position:relative;isolation:isolate;overflow:hidden;display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:400px;gap:20px;margin:12px 0 34px;padding:56px 32px 26px;border:1px solid color-mix(in srgb,var(--pg-primary) 25%,transparent);border-radius:12px;background:radial-gradient(ellipse at 60% 30%,color-mix(in srgb,var(--pg-primary) 9%,transparent),transparent 60%),linear-gradient(color-mix(in srgb,var(--pg-primary) 5%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--pg-primary) 5%,transparent) 1px,transparent 1px),linear-gradient(130deg,var(--pg-brand-stage),var(--pg-brand-ink));background-size:auto,32px 32px,32px 32px,auto;box-shadow:0 16px 40px color-mix(in srgb,var(--pg-primary-deep) 11%,transparent);} .pg-brand-home .pg-home-grid{display:grid;grid-template-columns:minmax(160px,.7fr) minmax(0,2.8fr) minmax(185px,.85fr);gap:24px;align-items:start;} .pg-brand-home .pg-home-col{min-width:0;align-self:start;} .pg-brand-home .pg-newsroom{min-width:0;margin:0;padding:24px;background:var(--pg-block-bg);border:1px solid var(--pg-border);border-radius:12px;box-shadow:var(--pg-brand-shadow);} .pg-brand-home .pg-newsroom__grid{gap:18px;} .pg-brand-home .pg-news-card__body{padding:14px 0;} .pg-brand-home .pg-news-card__img{border-radius:7px;} .pg-brand-home .pg-news-card__footer{gap:7px;flex-wrap:wrap;} .pg-brand-home .pg-news-card__author-name{font-size:10px;} .pg-brand-home .pg-news-card__meta{font-size:9px;} body .pg-author-page .pg-author-header{position:relative;isolation:isolate;overflow:hidden;display:grid;grid-template-columns:190px minmax(0,1fr);gap:28px;padding:28px!important;} html body.wp-theme-psyguild-theme .pg-author-page .pg-author-header::before{content:none!important;display:none!important;} html body.wp-theme-psyguild-theme .pg-author-page .pg-author-header__left{width:auto!important;min-width:0;position:relative;z-index:1;padding:18px;border-radius:10px;background:linear-gradient(color-mix(in srgb,var(--pg-primary) 8%,transparent) 1px,transparent 1px),linear-gradient(90deg,color-mix(in srgb,var(--pg-primary) 8%,transparent) 1px,transparent 1px),linear-gradient(140deg,var(--pg-brand-stage),var(--pg-brand-ink))!important;background-size:24px 24px,24px 24px,auto!important;} body .pg-author-page .pg-author-header__left .pg-author-stats{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;width:100%;} body .pg-author-page .pg-author-header__left .pg-author-stat-box{min-width:0;padding:12px 6px;} html body.wp-theme-psyguild-theme .pg-author-page .pg-author-header__left .pg-author-stat-num{color:var(--pg-brand-paper)!important;-webkit-text-fill-color:var(--pg-brand-paper)!important;background:none!important;font-size:23px;} html body.wp-theme-psyguild-theme .pg-author-page .pg-author-stat-label{color:color-mix(in srgb,var(--pg-brand-paper) 80%,transparent)!important;font-size:8px;} html body.wp-theme-psyguild-theme .pg-author-page .pg-author-stat-box{border:1px solid color-mix(in srgb,var(--pg-primary) 23%,transparent)!important;border-radius:8px!important;background:transparent!important;box-shadow:none;} body .pg-author-page .pg-author-avatar-wrap{width:146px;height:146px;margin-inline:auto;border:4px solid var(--pg-brand-paper);border-radius:50%;overflow:hidden;} body .pg-author-page .pg-author-header__right{position:relative;z-index:1;padding-left:18px;min-width:0;} body .pg-author-page .pg-author-header__right{display:flex;flex-direction:column;align-items:flex-start;gap:10px;} body .pg-author-page .pg-author-header__right> :is(h1,h2,p,.pg-author-bio,.pg-author-actions,.pg-author-tags){margin:0;} body .pg-author-page h1.pg-author-name{font:400 clamp(34px,4vw,48px)/1.1 var(--pg-brand-serif);font-weight:400!important;letter-spacing:-.035em;} body .pg-author-page .pg-author-title{font:700 15px/1.6 var(--pg-brand-sans);} body .pg-author-page .pg-author-bio{font-size:14px;line-height:1.8;max-width:760px;max-height:100px;overflow:auto;} body .pg-author-page .pg-author-actions{display:flex;flex-wrap:wrap;justify-content:flex-start;gap:10px;padding-top:5px;} body .pg-author-page .pg-author-actions>.pg-btn{flex:0 1 auto;width:auto!important;min-height:40px;padding:9px 16px;font-size:12px;} } @media(min-width:768px) and (max-width:1100px){ body .pg-main-nav{gap:13px;} .pg-brand-home .pg-home-grid{grid-template-columns:160px minmax(0,1fr);gap:22px;} .pg-brand-home .pg-home-col--right{grid-column:1/-1;} .pg-brand-home #pg-authors-list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;} .pg-brand-home .pg-home-col--right .pg-side-header{flex-direction:row;justify-content:space-between;} .pg-brand-hero .pg-title-brand{font-size:70px;} .pg-brand-tools__layout{grid-template-columns:1fr;} .pg-brand-tools__list{grid-template-columns:repeat(3,minmax(0,1fr));} } @media(max-width:767.98px){ /* App shell, menus, sheets, carousel and six-card mobile paging stay intact. */ body .pg-brand-home .pg-home-grid{display:flex;flex-direction:column;gap:20px;} .pg-brand-home .pg-home-col{width:100%;} .pg-brand-home .pg-home-col--center{order:0;} .pg-brand-home .pg-home-col--left{order:1;} .pg-brand-home .pg-home-col--right{order:2;} .pg-brand-home .pg-newsroom{margin:0;padding:18px 14px;border-radius:12px;} .pg-brand-home .pg-newsroom__title{font-size:28px;} .pg-brand-tools{margin-block:28px;} .pg-brand-section-head{align-items:center;gap:10px;margin-bottom:18px;} .pg-brand-section-head h2{font-size:26px;} .pg-brand-section-head .pg-btn{font-size:10px;white-space:nowrap;} .pg-brand-tools__layout{grid-template-columns:1fr;gap:18px;} .pg-brand-tools__list{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;} .pg-brand-tool{padding:13px;} .pg-brand-tool__art{height:70px;margin:-13px -13px 12px;} .pg-brand-tool strong{font-size:12px;} .pg-profile-summary{grid-template-columns:1fr;gap:14px;} .pg-profile-summary__card{padding:19px;} .pg-profile-summary__head h3{font-size:23px;} .pg-profile-summary__head button{min-height:44px;min-width:44px;} body .pg-author-page .pg-author-tab{padding:13px 16px;white-space:nowrap;} body .pg-author-page .pg-overview-text{font-size:13px;} } @media(prefers-reduced-motion:reduce){ .pg-brand-hero *, .pg-brand-tool{animation:none!important;transition:none!important;} } /* PsyGuild source: brand-cards.css */ /* Shared card finish. Geometry and media only; the existing grids, queries, * links, responsive rows and application controls keep their own behaviour. */ body{ --pg-brand-line:color-mix(in srgb,var(--pg-text) 13%,var(--pg-block-bg)); --pg-brand-card-radius:14px; --pg-brand-card-shadow:0 2px 12px color-mix(in srgb,var(--pg-primary-deep) 4%,transparent); } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-card,.pg-card-strong,.pg-card-post,.pg-news-card,.pg-hub-card,.pg-app-card,.pg-service-card,.pg-event-card,.pg-search-card,.pg-author-card,.pg-card-author,.pg-featured-event,.pg-featured-post-card,.pg-blog-index-header,.pg-authors-shell,.pg-authors-toolbar,.pg-home-side-card,.pg-newsroom,.pg-home-media,.pg-services-section,.pg-profile-summary__card){ border:1px solid var(--pg-brand-line)!important; border-radius:var(--pg-brand-card-radius)!important; background-color:var(--pg-block-bg)!important;background-image:none!important; background-clip:padding-box!important;background-origin:padding-box!important; box-shadow:var(--pg-brand-card-shadow)!important; } /* Replace the previous glass sheen without removing any content or badges. */ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-card,.pg-card-strong,.pg-card-post,.pg-news-card,.pg-service-card,.pg-event-card,.pg-search-card,.pg-author-card,.pg-home-side-card,.pg-newsroom,.pg-services-section,.pg-featured-event)::before{ background:none!important;box-shadow:none!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-card-post,.pg-news-card,.pg-hub-card,.pg-app-card,.pg-service-card,.pg-event-card,.pg-search-card,.pg-author-card):hover{ transform:none!important;filter:none!important; border-color:color-mix(in srgb,var(--pg-primary) 30%,var(--pg-brand-line))!important; box-shadow:0 4px 16px color-mix(in srgb,var(--pg-primary-deep) 7%,transparent)!important; } html body.wp-theme-psyguild-theme :is(.pg-card-post,.pg-news-card,.pg-hub-card,.pg-service-card,.pg-event-card,.pg-search-card){min-width:0;} html body.wp-theme-psyguild-theme :is(.pg-card-post__media,.pg-news-card__img,.pg-service-card__img-wrap,.pg-event-card__img,.pg-hub-card-img,.pg-event-card-img,.pg-search-card__img-wrap){ border:0!important;box-shadow:none!important;background:var(--pg-bg-soft); } html body.wp-theme-psyguild-theme :is(.pg-card-post__media,.pg-news-card__img,.pg-service-card__img-wrap,.pg-event-card__img,.pg-hub-card-img,.pg-event-card-img,.pg-search-card__img-wrap) img{ object-position:center;vertical-align:middle; } /* Generated covers include text and logos: keep their complete artwork. */ html body.wp-theme-psyguild-theme .pg-content-card-picture :is(img[src*="pg_post_cover="],img.pg-content-cover-art){object-fit:contain!important;} html body.wp-theme-psyguild-theme :is(.pg-card-post__footer,.pg-news-card__footer){border-top-color:var(--pg-brand-line);} html body.wp-theme-psyguild-theme .pg-brand-home :is(.pg-home-col--left,.pg-home-col--right)>.pg-home-side-card.pg-card{ border:1px solid var(--pg-brand-line)!important;box-shadow:var(--pg-brand-card-shadow)!important;background-image:none!important; } html body.wp-theme-psyguild-theme .pg-brand-home .pg-home-side-card :is(.pg-author-item,.pg-event-item){ border:0!important;border-bottom:1px solid var(--pg-brand-line)!important; border-radius:0!important;background-image:none!important;box-shadow:none!important; transform:none!important;filter:none!important; } html body.wp-theme-psyguild-theme .pg-brand-home .pg-home-side-card :is(.pg-author-item,.pg-event-item)::before{background:none!important;box-shadow:none!important;} html body.wp-theme-psyguild-theme .pg-brand-home .pg-home-side-card :is(.pg-author-item,.pg-event-item):last-child{border-bottom:0!important;} html body.wp-theme-psyguild-theme .pg-brand-tool{ border-color:var(--pg-brand-line);border-radius:var(--pg-brand-card-radius);box-shadow:var(--pg-brand-card-shadow); } html body.wp-theme-psyguild-theme .pg-brand-tool__art{border-radius:13px 13px 0 0;} html body.wp-theme-psyguild-theme .pg-featured-post-card{overflow:hidden;} html body.wp-theme-psyguild-theme .pg-featured-img{background:var(--pg-bg-soft)!important;} html body.wp-theme-psyguild-theme .pg-blog-index-header h1{font:400 clamp(30px,3vw,42px)/1.2 var(--pg-brand-serif)!important;letter-spacing:-.025em;} @media(min-width:768px){ html body.wp-theme-psyguild-theme :is(.pg-card-post__media,.pg-news-card__img,.pg-service-card__img-wrap,.pg-event-card__img,.pg-hub-card-img,.pg-event-card-img,.pg-search-card__img-wrap){border-radius:13px 13px 0 0!important;} html body.wp-theme-psyguild-theme .pg-brand-home .pg-news-card__body{padding:16px;} html body.wp-theme-psyguild-theme :is(.pg-card-post__read,.pg-news-card__read-btn){ width:fit-content;min-height:32px;padding:5px 0;border:0!important;border-radius:0!important; background:none!important;box-shadow:none!important;color:var(--pg-link)!important; font:700 11px/1.6 var(--pg-brand-sans);text-align:left;justify-content:flex-start; } } @media(max-width:767.98px){ html body.wp-theme-psyguild-theme :is(.pg-card-post__media,.pg-news-card__img,.pg-search-card--article .pg-search-card__img-wrap){border-radius:8px!important;} } /* PsyGuild source: brand-header.css */ /* Desktop header follows the approved HTML: brand / search / account, then * a separate navigation row. Existing controls and their IDs remain intact. */ .pg-header-search-label{display:none;} /* The spacer keeps its original height; sliding navigation never moves content. */ html body.wp-theme-psyguild-theme .pg-site-header.pg-header-scroll-ready{ transform:translateY(0)!important;visibility:visible; transition:transform .24s cubic-bezier(.22,1,.36,1),visibility 0s!important; } html body.wp-theme-psyguild-theme .pg-site-header.pg-header-scroll-ready.pg-header-is-hidden{ transform:translateY(-100%)!important;visibility:hidden;pointer-events:none; transition:transform .24s cubic-bezier(.22,1,.36,1),visibility 0s .24s!important; } @media(prefers-reduced-motion:reduce){ html body.wp-theme-psyguild-theme .pg-site-header.pg-header-scroll-ready{transition:none!important;} } html body.wp-theme-psyguild-theme .pg-logo-title{ color:var(--pg-interactive-accent)!important;background:none!important; -webkit-text-fill-color:currentColor!important;text-shadow:none!important; } @supports (background-clip:text){ html body.wp-theme-psyguild-theme .pg-logo-title{ background:var(--pg-wordmark-gradient) text!important; -webkit-text-fill-color:transparent!important; } } @media(min-width:768px){ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active){--pg-brand-header-height:134px;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header{ padding:0!important;border:0!important;border-bottom:1px solid var(--pg-brand-line)!important; background-image:none!important;box-shadow:none!important; backdrop-filter:none!important;-webkit-backdrop-filter:none!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header__inner{ display:grid!important;grid-template-columns:auto minmax(0,1fr) auto;grid-template-rows:84px 50px; gap:0 32px;padding:0!important;min-height:134px!important; border:0!important;border-radius:0!important;background:none!important;box-shadow:none!important; backdrop-filter:none!important;-webkit-backdrop-filter:none!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header-spacer{height:134px!important;margin-bottom:0!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header__left{grid-column:1;grid-row:1;gap:12px;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-link{gap:11px;position:static;transform:none;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-img{width:42px!important;height:42px!important;object-fit:contain;border-radius:0!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-title{ font:700 27px/1.2 var(--pg-brand-sans)!important;letter-spacing:-.045em;text-transform:none; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-title::after{content:'.';color:inherit;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-desc{display:block!important;font:400 9px/1.5 var(--pg-brand-sans);letter-spacing:.08em;margin-top:4px;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header__right{grid-column:2/4;grid-row:1;gap:14px;min-width:0;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-search-wrapper{flex:1 1 420px;max-width:480px;min-width:180px;margin-inline:auto;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header :is(.pg-btn-icon,.pg-header-account__toggle){ min-height:44px;height:44px;border:1px solid var(--pg-brand-line)!important;border-radius:8px!important; background:var(--pg-header-bg)!important;color:var(--pg-text)!important; clip-path:none!important;box-shadow:none!important;transform:none!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header :is(.pg-btn-icon,.pg-header-account__toggle):hover{ background:var(--pg-bg-soft)!important;color:var(--pg-link)!important;border-color:var(--pg-primary)!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-search-toggle{ width:100%!important;max-width:none!important;justify-content:flex-start;gap:12px;padding:0 15px!important; background:var(--pg-bg-soft)!important;color:var(--pg-muted)!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-header-search-label{display:block;min-width:0;font:400 13px/1.5 var(--pg-brand-sans);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-search-toggle>svg{flex-shrink:0;} /* One real form replaces the former search-shaped disclosure on desktop. */ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-search-toggle, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-search-close{display:none!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-search-dropdown{ position:static!important;width:100%!important;max-width:none!important;padding:0!important; border:0!important;border-radius:0!important;box-shadow:none!important; opacity:1!important;visibility:visible!important;transform:none!important;transition:none!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-search-form{ width:100%;min-height:44px;gap:10px;padding:5px 8px 5px 14px;box-sizing:border-box; border:1px solid var(--pg-brand-line)!important;border-radius:8px!important; background:var(--pg-bg-soft)!important;color:var(--pg-text)!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-search-form:focus-within{border-color:var(--pg-primary)!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-search-input{ width:0;min-width:0;min-height:30px;padding:0;border:0!important;border-radius:0!important; background:transparent!important;box-shadow:none!important;font:400 13px/1.5 var(--pg-interface-font); } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-search-input:focus-visible{outline:none!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-search-form>.pg-btn{ flex:0 0 auto;min-height:30px;padding:5px 10px;border-radius:5px;font-size:12px; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-theme-toggle{background:var(--pg-header-bg)!important;color:var(--pg-interactive-accent)!important;box-shadow:none!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-search-dropdown{left:0;right:auto;width:520px;max-width:min(520px,calc(100vw - 48px));border-radius:12px;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-header-action--primary:not(.pg-header-account__toggle):not(.pg-header-action--reader){ background:var(--pg-highlight-gradient)!important;color:var(--pg-highlight-text)!important;border-color:transparent!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-header-action--primary:not(.pg-header-account__toggle):not(.pg-header-action--reader):hover{ background:var(--pg-highlight-gradient-hover)!important;color:var(--pg-highlight-text)!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-header-account__label{font:700 12px/1.5 var(--pg-brand-sans);} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header__center{ display:flex!important;grid-column:1/4;grid-row:2;justify-content:flex-start;align-self:stretch; min-width:0;padding:0!important;border-top:1px solid var(--pg-brand-line); } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav{gap:32px!important;height:100%;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav>li:not(:last-child)::after{content:none;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav>li>a{ min-height:49px;padding:14px 0!important;border:0;border-radius:0!important;clip-path:none; font:400 13px/1.6 var(--pg-brand-sans)!important;color:var(--pg-muted)!important;text-shadow:none!important; background:none!important;box-shadow:none!important;transform:none!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav>li:is(.current-menu-item,.current-menu-parent)>a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav>li>a:hover{color:var(--pg-link)!important;box-shadow:inset 0 -2px var(--pg-primary)!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav>li>a::after{background:var(--pg-primary);box-shadow:none;transform:none;left:0;width:100%;height:2px;bottom:0;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav .sub-menu{border-radius:10px;border-color:var(--pg-brand-line);} } @media(min-width:901px){ html body.pg-personal-surface .pg-portal--profile .pg-portal-sidebar{top:calc(var(--pg-admin-bar-offset,0px) + 150px);max-height:calc(100dvh - var(--pg-admin-bar-offset,0px) - 166px);} } @media(min-width:768px) and (max-width:1100px){ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header__inner{column-gap:18px;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header__right{gap:8px;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-title{font-size:24px!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-logo-desc{font-size:8px;letter-spacing:.04em;max-width:168px;overflow:hidden;text-overflow:ellipsis;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-header-account__label{display:none;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-main-nav{gap:22px!important;} } @layer psyguild-opaque-surfaces{ @media(min-width:768px){ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header{background-color:var(--pg-solid-header)!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) #pg-search-dropdown{background:transparent!important;} } } /* PsyGuild source: brand-system.css */ /* Shared UI bridge for the Portal, Core shortcodes, commerce and dialogs. * Own presentation only: leave hidden/inert states, grids, reader/editor text, * status colours, routes, controls and app navigation to their modules. */ html body.wp-theme-psyguild-theme :is(.psyguild-portal-shell,.psyguild-assessment-app,.psyguild-assessment-auth,.pg-report-credit-panel,.pg-credit-modal,.pg-drive,.pg-post-detail,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-contributor-request-modal__dialog,.pg-header-account__menu,.pg-popup-content){ font-family:var(--pg-interface-font);color:var(--pg-text); } html body.wp-theme-psyguild-theme :is(.pg-site-header,.pg-sidebar-drawer,.pg-header-account__menu,.pg-popup-content,.pg-modal-card,.psyguild-portal-shell,.psyguild-assessment-app,.psyguild-assessment-auth,.pg-report-credit-panel,.pg-credit-modal,.pg-drive,.pg-personal-nav-sheet,.pg-personal-bottom-nav) :is(button,input,select,textarea):not(.wp-editor-area):not(.code){ font-family:var(--pg-interface-font); } /* Core library headings previously selected their own display family. */ html body.wp-theme-psyguild-theme .psyguild-assessment-app :is(h1,h2,h3,h4){font-family:var(--pg-interface-font)!important;letter-spacing:-.02em;} html body.wp-theme-psyguild-theme :is(.pg-portal-main,.psyguild-portal-shell) :is(.psyguild-assessment-history-title,.pg-report-credit-panel h2,.pg-report-credit-panel h3){font-family:var(--pg-interface-font);color:var(--pg-text);} /* One finish for functional panels, including screens rendered by Core. */ html body.wp-theme-psyguild-theme :is(.pg-btn-primary,.pg-btn-dark,.pg-hero-btn-primary,.pg-sidebar-cta__btn,.pg-community-primary,.pg-channels-primary,.pg-publish-split__toggle,.pg-admin-dashboard__export,.pg-admin-filter__actions button,.pg-author-period-filter>button){color:var(--pg-action-text,var(--pg-color-white))!important;-webkit-text-fill-color:currentColor!important;} html body.wp-theme-psyguild-theme :is(.pg-btn-primary,.pg-btn-dark,.pg-hero-btn-primary,.pg-sidebar-cta__btn,.pg-community-primary,.pg-channels-primary,.pg-publish-split__toggle,.pg-admin-dashboard__export,.pg-admin-filter__actions button,.pg-author-period-filter>button):hover{color:var(--pg-action-hover-text,var(--pg-color-white))!important;} html body.wp-theme-psyguild-theme :is(.pg-community-primary,.pg-channels-primary,.pg-publish-split__toggle){background:var(--pg-action-gradient)!important;border-color:transparent!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-site-header .pg-search-form>.pg-btn-primary,.pg-demo-profile .pg-author-follow-btn,.pg-hero-btn-primary,.pg-sidebar-cta__btn,.pg-community-primary,.pg-channels-primary){ background:var(--pg-highlight-gradient)!important;color:var(--pg-highlight-text)!important;border-color:transparent!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-site-header .pg-search-form>.pg-btn-primary,.pg-demo-profile .pg-author-follow-btn,.pg-hero-btn-primary,.pg-sidebar-cta__btn,.pg-community-primary,.pg-channels-primary):is(:hover,:focus-visible):not(:disabled):not([aria-disabled="true"]){ background:var(--pg-highlight-gradient-hover)!important;color:var(--pg-highlight-text)!important; } html body.wp-theme-psyguild-theme .pg-drive .pg-drive__file:is(:hover,[aria-pressed="true"]){background:var(--pg-action-gradient)!important;color:var(--pg-action-text)!important;} html body.wp-theme-psyguild-theme .pg-drive .pg-drive__file:is(:hover,[aria-pressed="true"]) :is(strong,small,.pg-drive__arrow){color:inherit!important;-webkit-text-fill-color:currentColor!important;} /* A filled state owns both its background and label. This also covers Core * controls and dialogs mounted outside main, without touching content/editor * text, overlay scrims, file cards, hidden states or control behaviour. */ html body.wp-theme-psyguild-theme :is(.pg-channels-toolbar nav button,.pg-community-view,.pg-community-topics a,.psyguild-assessment-layout-switch button,.psyguild-assessment-category-list button,.psyguild-assessment-pagination button,.pg-drive__locations button,.pg-publish-split__menu button,.pg-admin-chart-legend button):is(.is-active,.active,.is-current,[aria-selected="true"],[aria-pressed="true"],[aria-current="page"],[aria-current="true"]), html body.wp-theme-psyguild-theme .pg-editor-layout-collapse{ background:var(--pg-action-gradient)!important;color:var(--pg-action-text,var(--pg-color-white))!important; border-color:transparent!important;-webkit-text-fill-color:currentColor!important; } html body.wp-theme-psyguild-theme :is(.pg-portal-main,.pg-drive,.pg-channels-dialog,.pg-post-detail,.pg-admin-author-modal__dialog,.pg-author-manager__dialog-panel,.pg-credit-modal,.pg-report-credit-panel,.psyguild-assessment-app,.pg-community) :is(button,input[type="submit"],input[type="button"],.pg-btn,.pg-post-action,.pg-admin-table-action,.pg-community-view,.pg-community-topics a,.pg-community-secondary,.pg-drive__link,.pg-channels-actions a,.pg-editor-layout-menu summary):is(:hover,:focus-visible):not(:disabled):not([aria-disabled="true"]):not(:where(.wp-editor-wrap *,.mce-container *,.tox *,[class*="backdrop"],[class*="overlay"],.pg-post-card-toggle,.pg-post-summary__media,.pg-post-card-menu,.pg-drive__file)){ background:var(--pg-action-gradient-hover)!important;color:var(--pg-action-hover-text,var(--pg-color-white))!important; border-color:transparent!important;-webkit-text-fill-color:currentColor!important; } /* Labels and icons nested inside an action must inherit its white foreground. */ html body.wp-theme-psyguild-theme :is(.pg-btn-primary,.pg-btn-dark,.pg-community-primary,.pg-channels-primary,.pg-publish-split__toggle) :is(span,small,strong,em,i), html body.wp-theme-psyguild-theme :is(.pg-channels-toolbar nav button,.pg-community-view,.pg-community-topics a,.psyguild-assessment-layout-switch button,.psyguild-assessment-category-list button,.psyguild-assessment-pagination button,.pg-drive__locations button,.pg-publish-split__menu button,.pg-admin-chart-legend button):is(.is-active,.active,.is-current,[aria-selected="true"],[aria-pressed="true"],[aria-current="page"],[aria-current="true"]) :is(span,small,strong,em,i), html body.wp-theme-psyguild-theme :is(.pg-portal-main,.pg-drive,.pg-channels-dialog,.pg-post-detail,.pg-admin-author-modal__dialog,.pg-author-manager__dialog-panel,.pg-credit-modal,.pg-report-credit-panel,.psyguild-assessment-app,.pg-community) :is(button,.pg-btn,.pg-post-action,.pg-admin-table-action,.pg-community-view,.pg-community-topics a,.pg-community-secondary,.pg-drive__link,.pg-channels-actions a,.pg-editor-layout-menu summary):is(:hover,:focus-visible):not(:disabled):not([aria-disabled="true"]):not(:where(.wp-editor-wrap *,.mce-container *,.tox *,[class*="backdrop"],[class*="overlay"],.pg-post-card-toggle,.pg-post-summary__media,.pg-post-card-menu,.pg-drive__file)) :is(span,small,strong,em,i){color:inherit!important;-webkit-text-fill-color:currentColor!important;} /* Destructive and status actions keep their semantic colour with white labels. */ html body.wp-theme-psyguild-theme :is(.pg-btn-danger,.pg-post-action--delete){--pg-filled-status:var(--pg-palette-danger);} html body.wp-theme-psyguild-theme .pg-btn-review{--pg-filled-status:var(--pg-palette-warning);} html body.wp-theme-psyguild-theme button.pg-post-badge{--pg-filled-status:var(--pg-palette-muted);} html body.wp-theme-psyguild-theme button.pg-post-badge--success{--pg-filled-status:var(--pg-palette-success);} html body.wp-theme-psyguild-theme button.pg-post-badge--warning{--pg-filled-status:var(--pg-palette-warning);} html body.wp-theme-psyguild-theme button.pg-post-badge--info{--pg-filled-status:var(--pg-palette-blue);} html body.wp-theme-psyguild-theme button.pg-post-badge--danger{--pg-filled-status:var(--pg-palette-danger);} html body.wp-theme-psyguild-theme :is(.pg-portal-main,.pg-post-detail) :is(.pg-btn-danger,.pg-btn-review,.pg-post-action--delete,button.pg-post-badge){ background:var(--pg-filled-status)!important;color:var(--pg-color-white)!important; border-color:var(--pg-filled-status)!important;-webkit-text-fill-color:currentColor!important; } html body.wp-theme-psyguild-theme :is(.pg-portal-main,.pg-post-detail) :is(.pg-btn-danger,.pg-btn-review,.pg-post-action--delete,button.pg-post-badge):is(:hover,:focus-visible):not(:disabled):not([aria-disabled="true"]){background:color-mix(in srgb,var(--pg-filled-status) 85%,black)!important;color:var(--pg-color-white)!important;} /* Neutral button surfaces are navy in dark mode, including disabled controls. * Keep their opacity/cursor and their own backgrounds while making labels white. */ html body.wp-theme-psyguild-theme.pg-theme-dark :is(.pg-portal-main,.pg-drive,.pg-channels-dialog,.pg-post-detail,.pg-admin-author-modal__dialog,.pg-author-manager__dialog-panel,.pg-credit-modal,.pg-report-credit-panel,.psyguild-assessment-app,.pg-community) :is(button,input[type="submit"],input[type="button"],.pg-btn,.pg-post-action,.pg-admin-table-action,.pg-community-secondary,.pg-drive__link,.pg-channels-actions a):not(:where(.wp-editor-wrap *,.mce-container *,.tox *,[class*="backdrop"],[class*="overlay"],.pg-post-card-toggle,.pg-post-summary__media,.pg-post-card-menu,.pg-drive__file)), html body.wp-theme-psyguild-theme.pg-theme-dark :is(.pg-sidebar-link,.pg-portal-toggle,.pg-portal-nav-item,.pg-post-summary__media){ color:var(--pg-color-white)!important;-webkit-text-fill-color:currentColor!important; } html body.wp-theme-psyguild-theme :is(.pg-admin-panel,.pg-admin-kpi,.pg-admin-filter,.pg-author-period-filter,.pg-portal-filterbar,.pg-portal-empty,.pg-profile-form-card,.pg-quiz-launcher,.psyguild-assessment-history-overview,.psyguild-assessment-history-card,.psyguild-assessment-history-panel,.pg-report-credit-panel,.pg-credit-modal,.psyguild-assessment-library-sidebar,.psyguild-assessment-library-results,.psyguild-assessment-info-dialog__panel,.psyguild-assessment-auth__panel,.psyguild-assessment-question,.psyguild-assessment-result,.pg-post-detail,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-contributor-request-modal__dialog,.pg-modal-card,.pg-popup-content){ border:1px solid var(--pg-brand-line)!important;border-radius:var(--pg-brand-card-radius)!important; background:var(--pg-block-bg)!important;color:var(--pg-text)!important; box-shadow:var(--pg-brand-card-shadow)!important; } html body.wp-theme-psyguild-theme .pg-admin-kpi::after{content:none;} html body.wp-theme-psyguild-theme :is(.pg-admin-kpi small,.pg-author-dashboard__data-note,.psyguild-assessment-card p,.psyguild-assessment-card__time,.psyguild-assessment-info-dialog__section p){color:var(--pg-muted);} html body.wp-theme-psyguild-theme .pg-admin-kpi small{font-size:12px;line-height:1.65;} html body.wp-theme-psyguild-theme .pg-portal-empty__icon{border:1px solid var(--pg-brand-line);border-radius:10px;color:var(--pg-link);} html body.wp-theme-psyguild-theme .pg-portal-main .pg-portal-empty h2{font:600 16px/1.45 var(--pg-interface-font);color:var(--pg-text);} html body.wp-theme-psyguild-theme .pg-portal-main .pg-portal-empty p{font:400 13px/1.7 var(--pg-interface-font);color:var(--pg-muted);} html body.wp-theme-psyguild-theme .pg-portal-empty-cell .pg-portal-empty{border:0!important;border-radius:0!important;box-shadow:none!important;} html body.wp-theme-psyguild-theme .pg-author-dashboard__data-note{border-style:solid;border-color:var(--pg-brand-line);border-radius:10px;} html body.wp-theme-psyguild-theme :is(.pg-portal-card,.pg-profile-form-card,.psyguild-portal-card,.pg-report-credit-panel,.pg-credit-modal,.psyguild-assessment-auth__panel) :is(input[type="text"],input[type="email"],input[type="url"],input[type="search"],input[type="number"],input[type="date"],input[type="password"],select){ min-width:0;border:1px solid var(--pg-brand-line)!important;border-radius:8px!important; background-color:var(--pg-bg-soft)!important;color:var(--pg-text)!important; } html body.wp-theme-psyguild-theme :is(.pg-credit-balances p,.pg-report-credit-panel output,.psyguild-assessment-info-dialog__meta div,.psyguild-assessment-info-dialog__section){ border-color:var(--pg-brand-line)!important;border-radius:10px;background:var(--pg-bg-soft)!important;color:var(--pg-text)!important; } html body.wp-theme-psyguild-theme :is(.pg-credit-balances strong,.psyguild-assessment-score,.psyguild-assessment-history-stats strong){font-family:var(--pg-interface-font);font-variant-numeric:tabular-nums;} html body.wp-theme-psyguild-theme .psyguild-assessment-history-stats>div{background:var(--pg-bg-soft)!important;border:1px solid var(--pg-brand-line);border-radius:10px;color:var(--pg-text);} html body.wp-theme-psyguild-theme .pg-portal-commerce :is(li.product,.woocommerce-Address,.cart_totals){border:1px solid var(--pg-brand-line)!important;border-radius:var(--pg-brand-card-radius)!important;background:var(--pg-block-bg)!important;box-shadow:var(--pg-brand-card-shadow)!important;} html body.wp-theme-psyguild-theme :is(.pg-credit-modal,.pg-post-detail,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-contributor-request-modal__dialog,.psyguild-assessment-info-dialog__panel,.psyguild-assessment-auth__panel){border-radius:16px!important;} /* Preserve the library's existing rows, controls, filters and runner flow. */ html body.wp-theme-psyguild-theme .psyguild-assessment-app__hero{ border:1px solid var(--pg-brand-line);border-radius:var(--pg-brand-card-radius); background:linear-gradient(120deg,var(--pg-block-bg),color-mix(in srgb,var(--pg-primary) 9%,var(--pg-block-bg)))!important; color:var(--pg-text)!important;box-shadow:var(--pg-brand-card-shadow); } html body.wp-theme-psyguild-theme .psyguild-assessment-app__hero :is(h1,h2,p){color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme .psyguild-assessment-app__eyebrow{color:var(--pg-link)!important;} html body.wp-theme-psyguild-theme .psyguild-assessment-library-results .psyguild-assessment-card{ background:var(--pg-block-bg)!important;color:var(--pg-text)!important;border-color:var(--pg-brand-line)!important;box-shadow:none!important; } html body.wp-theme-psyguild-theme .psyguild-assessment-library-results .psyguild-assessment-card:hover{background:var(--pg-bg-soft)!important;} html body.wp-theme-psyguild-theme .psyguild-assessment-app :is(.psyguild-assessment-slider__controls,.psyguild-assessment-search,.psyguild-assessment-app__toolbar select){ background:var(--pg-block-bg)!important;color:var(--pg-text)!important;border-color:var(--pg-brand-line)!important; } html body.wp-theme-psyguild-theme .psyguild-assessment-search input{background:transparent!important;color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme .psyguild-assessment-search input::placeholder{color:var(--pg-muted)!important;} html body.wp-theme-psyguild-theme .psyguild-assessment-app :is(.psyguild-assessment-filter-section label,.psyguild-assessment-category-list button){color:var(--pg-muted);} html body.wp-theme-psyguild-theme .psyguild-assessment-info-dialog__guidance{background:var(--pg-bg-soft)!important;color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme .psyguild-assessment-info-dialog__close{background:var(--pg-bg-soft)!important;color:var(--pg-text)!important;border-color:var(--pg-brand-line)!important;} html body.wp-theme-psyguild-theme :is(.psyguild-assessment-card,.psyguild-assessment-auth__panel,.pg-credit-modal) .pg-btn{border-radius:8px;} @media(max-width:767.98px){ html body.wp-theme-psyguild-theme .pg-admin-kpi small{font-size:11px;} html body.wp-theme-psyguild-theme .pg-portal-main .pg-portal-empty h2{font-size:15px;} html body.wp-theme-psyguild-theme .pg-portal-main .pg-portal-empty p{font-size:12px;} } @media print{ body.wp-theme-psyguild-theme :is(.psyguild-assessment-cover-sheet,.psyguild-print-header,.psyguild-print-footer){font-family:var(--pg-interface-font)!important;} } /* PsyGuild source: brand-navigation.css */ /* Shared navigation effects. No display, layout, routing, pagination or data changes. * Explicit components keep editor controls, reader tools and carousel dots independent. */ body.wp-theme-psyguild-theme{ --pg-nav-duration:.18s; --pg-nav-hover:color-mix(in srgb,var(--pg-stage-primary) 10%,var(--pg-block-bg)); --pg-nav-active:var(--pg-highlight-gradient); --pg-nav-active-hover:var(--pg-highlight-gradient-hover); --pg-nav-active-text:var(--pg-highlight-text); --pg-nav-active-shadow:inset 0 -2px 0 var(--pg-highlight-edge),0 3px 8px color-mix(in srgb,var(--pg-primary-deep) 18%,transparent); --pg-nav-line:linear-gradient(90deg,var(--pg-interactive-accent),var(--pg-secondary)); } /* Header links use one underline below their own label. The old ::after * simultaneously owned an underline and a dropdown arrow, shifting it left. */ @media(min-width:768px){ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a{ position:relative!important;color:var(--pg-muted)!important;background:none!important;box-shadow:none!important; text-shadow:none!important;transform:none!important;clip-path:none!important;font-weight:var(--pg-weight-action)!important; transition:color var(--pg-nav-duration) ease!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a::before{ content:'';position:absolute;left:0;right:auto;top:auto;bottom:-1px;width:100%;height:3px; margin:0;border:0;border-radius:3px;background:var(--pg-nav-line);pointer-events:none; opacity:0;transform:scaleX(.55);transform-origin:left center; box-shadow:0 1px 7px color-mix(in srgb,var(--pg-primary) 22%,transparent); transition:opacity var(--pg-nav-duration) ease,transform var(--pg-nav-duration) ease; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a::after{content:none!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor,.current_page_item,.current_page_parent,.current_page_ancestor)>a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a:is([aria-current="page"],:hover,:focus-visible){color:var(--pg-interactive-accent)!important;background:none!important;box-shadow:none!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor,.current_page_item,.current_page_parent,.current_page_ancestor)>a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a[aria-current="page"]{font-weight:var(--pg-weight-action)!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li:is(.current-menu-item,.current-menu-parent,.current-menu-ancestor,.current_page_item,.current_page_parent,.current_page_ancestor,.is-open)>a::before, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a:is([aria-current="page"],:hover,:focus-visible)::before{opacity:1;transform:scaleX(1)} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a:focus-visible{outline:2px solid var(--pg-tab-focus,var(--pg-interactive-accent));outline-offset:-3px} /* No second underline inside dropdown items. Existing popup controls remain. */ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-main-nav .sub-menu a::after{content:none!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav .sub-menu a{color:var(--pg-text)!important;background:transparent!important;box-shadow:none!important;text-shadow:none!important;transform:none!important;transition:color var(--pg-nav-duration) ease,background-color var(--pg-nav-duration) ease!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav .sub-menu a:is(:hover,:focus-visible,[aria-current="page"]), html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav .sub-menu li:is(.current-menu-item,.current_page_item)>a{color:var(--pg-interactive-accent)!important;background:var(--pg-nav-hover)!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav .sub-menu a:focus-visible{outline:2px solid var(--pg-tab-focus,var(--pg-interactive-accent));outline-offset:-3px} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header .pg-main-nav .sub-menu{transition:opacity var(--pg-nav-duration) ease,transform var(--pg-nav-duration) ease,visibility var(--pg-nav-duration) ease} } @media(min-width:1024px){ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>.menu-item-has-children>a::after{ content:''!important;position:static!important;display:inline-block;left:auto!important;right:auto;top:auto;bottom:auto!important; width:.42rem!important;height:.42rem!important;margin:0 0 0 .45rem;border:0;border-right:1.5px solid currentColor;border-bottom:1.5px solid currentColor; border-radius:0!important;background:none!important;box-shadow:none!important;opacity:.7!important;pointer-events:none; transform:translateY(-.12rem) rotate(45deg)!important;transition:transform var(--pg-nav-duration) ease; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>.menu-item-has-children:is(:hover,:focus-within,.is-open)>a::after{transform:translateY(.08rem) rotate(225deg)!important} } /* Tabs and category chips share colour, elevation and timing, retaining their * existing shapes, spacing, progress, scroll containers and hidden states. */ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) :is(.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn,.pg-system-tab,.pg-category-tabs>a,.pg-category-tabs>button,.pg-filter-tabs>a,.pg-filter-tabs>button,.pg-tabs>a,.pg-tabs>button,.pg-sub-nav a,.woocommerce-tabs :where(.tabs)>li>a){ font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-action)!important;color:var(--pg-muted)!important;background:transparent!important; border-color:var(--pg-brand-line)!important;box-shadow:none!important;text-shadow:none!important;transform:none!important; transition:color var(--pg-nav-duration) ease,background-color var(--pg-nav-duration) ease,box-shadow var(--pg-nav-duration) ease!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) :is(.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn,.pg-system-tab,.pg-category-tabs>a,.pg-category-tabs>button,.pg-filter-tabs>a,.pg-filter-tabs>button,.pg-tabs>a,.pg-tabs>button,.pg-sub-nav a,.woocommerce-tabs :where(.tabs)>li>a):hover:not(:disabled):not([aria-disabled="true"]){background:var(--pg-nav-hover)!important;color:var(--pg-interactive-accent)!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) :is(.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn,.pg-system-tab,.pg-category-tabs>a,.pg-category-tabs>button,.pg-filter-tabs>a,.pg-filter-tabs>button,.pg-tabs>a,.pg-tabs>button,.pg-sub-nav a,.woocommerce-tabs :where(.tabs)>li>a):is(.is-active,.active,[aria-selected="true"],[aria-current="page"],[aria-current="true"]), html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-sub-nav li.current-menu-item>a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .woocommerce-tabs :where(.tabs)>li.active>a{ --pg-tab-focus:var(--pg-nav-active-text); background:var(--pg-nav-active)!important;color:var(--pg-nav-active-text)!important;border-color:transparent!important; box-shadow:var(--pg-nav-active-shadow)!important;font-weight:var(--pg-weight-action)!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) :is(.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn,.pg-system-tab,.pg-category-tabs>a,.pg-category-tabs>button,.pg-filter-tabs>a,.pg-filter-tabs>button,.pg-tabs>a,.pg-tabs>button,.pg-sub-nav a,.woocommerce-tabs :where(.tabs)>li>a):is(.is-active,.active,[aria-selected="true"],[aria-current="page"],[aria-current="true"]):hover:not(:disabled):not([aria-disabled="true"]){background:var(--pg-nav-active-hover)!important;color:var(--pg-nav-active-text)!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) :is(.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn,.pg-system-tab,.pg-category-tabs>a,.pg-category-tabs>button,.pg-filter-tabs>a,.pg-filter-tabs>button,.pg-tabs>a,.pg-tabs>button,.pg-sub-nav a,.woocommerce-tabs :where(.tabs)>li>a):focus-visible{outline:2px solid var(--pg-tab-focus,var(--pg-interactive-accent));outline-offset:-3px} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn):is(:disabled,[aria-disabled="true"]){opacity:.55} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-newsroom-tab .pg-tab-progress{background:var(--pg-highlight-text)!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .woocommerce-tabs :where(.tabs)>li.active>a:hover:not(:disabled):not([aria-disabled="true"]), html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-sub-nav li.current-menu-item>a:hover:not(:disabled):not([aria-disabled="true"]){background:var(--pg-nav-active-hover)!important;color:var(--pg-nav-active-text)!important} /* Vertical menus and the mobile app bar keep their layout and contrast. */ .pg-portal-sidebar{--pg-menu-active-text:var(--pg-color-white)} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-portal-nav-item,.pg-sidebar-link,.pg-sidebar-menu a,.pg-personal-nav-sheet a,.pg-header-account__links a,.pg-bottom-tab,.pg-personal-bottom-nav a,.woocommerce-MyAccount-navigation a){transition:color var(--pg-nav-duration) ease,background-color var(--pg-nav-duration) ease,box-shadow var(--pg-nav-duration) ease!important;transform:none!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-portal-nav-item,.pg-sidebar-link,.pg-sidebar-menu a,.pg-personal-nav-sheet a,.pg-management-sheet nav a,.pg-header-account__links a,.pg-bottom-tab,.pg-personal-bottom-nav a,.pg-personal-bottom-nav button,.woocommerce-MyAccount-navigation a):is(:hover,.is-active,[aria-current="page"],[aria-expanded="true"]), html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-sidebar-menu li.current-menu-item>a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .woocommerce-MyAccount-navigation .is-active>a{background:var(--pg-nav-active)!important;color:var(--pg-nav-active-text)!important;box-shadow:none!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(.pg-portal-nav-item,.pg-sidebar-link,.pg-sidebar-menu a,.pg-personal-nav-sheet a,.pg-header-account__links a,.pg-bottom-tab,.pg-personal-bottom-nav a,.woocommerce-MyAccount-navigation a):focus-visible{outline:2px solid var(--pg-tab-focus,var(--pg-interactive-accent));outline-offset:-3px} @media(prefers-reduced-motion:reduce){ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) :is(.pg-main-nav>li>a,.pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn,.pg-event-tab-btn,.pg-search-tab,.pg-filter-btn,.pg-system-tab,.pg-sub-nav a,.woocommerce-tabs :where(.tabs)>li>a,.pg-category-tabs>a,.pg-category-tabs>button,.pg-filter-tabs>a,.pg-filter-tabs>button,.pg-tabs>a,.pg-tabs>button,.pg-portal-nav-item,.pg-sidebar-link,.pg-sidebar-menu a,.pg-personal-nav-sheet a,.pg-header-account__links a,.pg-bottom-tab,.pg-personal-bottom-nav a,.woocommerce-MyAccount-navigation a){transition:none!important} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav .sub-menu a, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav .sub-menu, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a::before, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>li>a::after, html body.wp-theme-psyguild-theme:not(.pg-book-reader-active):is(.pg-theme-light,.pg-theme-dark) .pg-site-header .pg-main-nav>.menu-item-has-children>a::after{transition:none!important} } /* Shared by the desktop rail and the drawer on standalone public pages. */ .pg-rail-channels{flex:0 0 auto;min-width:0;padding:14px;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-block-bg);box-shadow:var(--pg-brand-shadow);font-family:var(--pg-interface-font)} .pg-rail-channels>summary{display:flex;align-items:center;justify-content:space-between;min-height:44px;gap:10px;color:var(--pg-text);font-size:13px;font-weight:600;cursor:pointer;list-style:none} .pg-rail-channels>summary::-webkit-details-marker{display:none} .pg-rail-channels[open]>summary{margin-bottom:8px} .pg-rail-channels[open]>summary>span{transform:rotate(180deg)} .pg-rail-channels nav{display:grid;gap:2px} .pg-rail-channels a{display:flex;align-items:center;justify-content:space-between;min-height:44px;padding:5px 8px;border-radius:7px;color:var(--pg-muted);font-size:12px;text-decoration:none} .pg-rail-channels a:hover{background:var(--pg-bg-soft);color:var(--pg-link)} .pg-rail-channels svg{width:17px;height:17px;flex:none} .pg-rail-channels :is(a,summary):focus-visible{outline:2px solid var(--pg-primary);outline-offset:2px} /* PsyGuild source: card-media.css */ /* Shared cover geometry, loaded after page presentation layers. * Keep each card's existing width/layout; only its media frame is 16:9. * Contain preserves cover lettering/logos and never stretches source images. * Author portraits, content images and embedded application frames are excluded. */ html body.wp-theme-psyguild-theme :is( .pg-card-post__media, .pg-news-card__img, .pg-service-card__img-wrap, .pg-event-card__img, .pg-hub-card-img, .pg-hub-card-fallback-img, .pg-event-card-img, .pg-search-card:not([data-type="author"]) .pg-search-card__img-wrap, .pg-featured-img, .pg-featured-event__image, .pg-related-thumb, .pg-carousel-card__img-wrap, .pg-highlight-img, .pg-profile-post-image, .pg-book-card-media, .pg-book-related-card-media ){ --pg-mobile-card-image-ratio:16 / 9!important; position:relative; box-sizing:border-box; aspect-ratio:16 / 9!important; height:auto!important; min-height:0!important; max-height:none!important; align-self:start!important; overflow:hidden; object-fit:contain!important; object-position:center!important; } /* Search covers previously relied on flex stretch for their width. Keep that * full width; native !important mobile article-row widths still take priority. */ html body.wp-theme-psyguild-theme .pg-search-card:not([data-type="author"]) .pg-search-card__img-wrap{ width:100%;flex-shrink:0; } /* Remove intrinsic picture/image height from wrapper sizing. Native image * sources, sizes/srcset, lazy loading and shape metadata remain unchanged. */ html body.wp-theme-psyguild-theme :is( .pg-card-post__media,.pg-news-card__img,.pg-service-card__img-wrap, .pg-event-card__img, .pg-search-card:not([data-type="author"]) .pg-search-card__img-wrap, .pg-featured-img,.pg-featured-event__image,.pg-related-thumb, .pg-carousel-card__img-wrap,.pg-highlight-img,.pg-profile-post-image, .pg-book-card-media,.pg-book-related-card-media ) :is(picture,img){ position:absolute!important; inset:0; display:block; width:100%!important; height:100%!important; max-width:100%; max-height:100%; margin:0; object-fit:contain!important; object-position:center!important; transform:none!important; } /* Placeholder covers follow the same frame without clipping their icon. */ html body.wp-theme-psyguild-theme :is( .pg-hub-card-fallback-img,.pg-event-card-img.pg-content-card-placeholder, .pg-event-card__img.pg-content-card-placeholder )>svg{max-width:70%;max-height:70%} /* The featured application carousel is media; the animated PsyGuild brand * hero and all interactive embeds retain their own dimensions. */ html body.wp-theme-psyguild-theme .pg-brand-home #pgHeroCarousel.pg-hero-main{ width:100%; height:auto!important; min-height:0!important; max-height:none!important; aspect-ratio:16 / 9!important; } html body.wp-theme-psyguild-theme #pgHeroCarousel .pg-hero-bg{ width:100%;height:100%;object-fit:contain!important;object-position:center; } /* Horizontal mini-tool cards keep the artwork beside the title and action. */ html body.wp-theme-psyguild-theme .pg-brand-tool{ display:grid;grid-template-columns:minmax(96px,32%) minmax(0,1fr); grid-template-rows:1fr auto;min-height:112px;padding:0;overflow:hidden; } html body.wp-theme-psyguild-theme .pg-brand-tool .pg-brand-tool__art{ position:relative;grid-column:1;grid-row:1 / 3;width:auto;height:auto!important; min-height:112px;margin:0;aspect-ratio:auto!important;align-self:stretch; border-radius:0; } html body.wp-theme-psyguild-theme .pg-brand-tool__art>svg{ position:absolute;inset:0;width:100%;height:100%; } html body.wp-theme-psyguild-theme .pg-brand-tool>strong{ grid-column:2;align-self:center;min-width:0;padding:16px 16px 0; } html body.wp-theme-psyguild-theme .pg-brand-tool .pg-brand-tool__open{ grid-column:2;margin:0;padding:10px 16px 16px; } @media(min-width:768px) and (max-width:1100px){ html body.wp-theme-psyguild-theme .pg-brand-tools__list{grid-template-columns:repeat(2,minmax(0,1fr));} } @media(max-width:767.98px){ html body.wp-theme-psyguild-theme .pg-brand-tools__list{grid-template-columns:1fr;} /* Keep the two-column mobile launcher; its cover fills each tile width. */ html body.wp-theme-psyguild-theme .pg-app-page :is(.pg-hub-card-img,.pg-hub-card-fallback-img){ width:100%!important;flex:0 0 auto; } } /* PsyGuild source: interface-typography.css */ /* Final interface type roles. Do not target article/editor content, code, * user-selected reader fonts, icon fonts or the PsyGuild wordmark. */ html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(main,.pg-portal-main,.pg-community-dialog) :is( .pg-hub-title,.pg-blog-index-title,.pg-search-title,.pg-newsroom__title, .pg-services__title,.pg-side-header__title,.pg-home-media__title, .pg-brand-section-head h2,.pg-authors-heading h1,.pg-directory-intro h1, .pg-knowledge-intro h1,.pg-blog-grid-heading h2,.pg-app-results-heading h2, .pg-service-results-heading h2,.pg-event-intro h1,.pg-event-results-heading h2, .pg-policy-page-title,.pg-community h1,.pg-community-entry h2, .pg-community-feed-head h2,.pg-community-dialog h2,.pg-channels h1, .pg-author-community-heading h2,.pg-author-community-empty h3, .pg-portal-page-header h1,.pg-admin-dashboard__header h1, .pg-post-manager__header h1,.pg-profile-heading h1,.pg-profile-form-card h2, .pg-admin-panel__header h2,.pg-author-benefits>h2,.psyguild-assessment-history-title,.pg-app-navigation h2,.pg-service-navigation h2,.pg-knowledge-topics-heading h2, .pg-auth-card h1,.psyguild-assessment-app__hero h1,.pg-hub-empty-title, .pg-events-empty-state h3,.pg-community-empty h3, .pg-profile-section-heading h2,.pg-profile-story h3,.pg-profile-service-row h3, .pg-event-navigation h2,.pg-policy-nav-heading h2,.pg-community-topics h2, .pg-community-guide h2,.pg-community-response-box h2, .pg-about-page h1,.pg-about-page h2,.pg-about-page h3, .pg-404-page h1,.pg-404-page h2,.pg-404-page h3, .pg-game-page h1,.pg-app-hero h1,.pg-app-section h2,.pg-app-feedback__summary h2 ){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-heading)!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(main,.pg-portal-main,.pg-community-dialog) :is( .pg-card-post__title,.pg-news-card__title,.pg-service-card__title, .pg-hub-card-title,.pg-event-card-title,.pg-event-card__title, .pg-search-card__title,.pg-featured-title,.pg-highlight-title, .pg-directory-name,.pg-card-author__name,.pg-author-name,.pg-event-item__title, .pg-brand-tool>strong,.pg-hub-embed-title ){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-heading)!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(main,.pg-portal-main,.pg-site-header,.pg-sidebar-drawer,.pg-popup-content,.pg-personal-nav-sheet) :is( .pg-btn,.pg-newsroom-tab,.pg-newsroom-tab.is-active,.pg-hub-tab-btn,.pg-hub-tab-btn.is-active,.pg-filter-btn,.pg-event-tab-btn, .pg-author-tab,.pg-main-nav a,.pg-portal-nav-item, .pg-card-post__read,.pg-news-card__read-btn,.pg-hub-card-footer, .pg-side-header__link,.pg-header-account__label,.pg-header-search-submit, .pg-search-submit,.pg-404-search-btn,.pg-community-primary,.pg-community-secondary, .pg-community button,.pg-about-button,.pg-about-final-card a, .pg-profile-section-heading>button,.pg-profile-summary__head button ,.pg-post-action,.pg-admin-table-action,.pg-admin-dashboard__export,.pg-author-refresh, .pg-onboarding-trigger ){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-action)!important;} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(main,.pg-portal-main,.pg-site-header,.pg-sidebar-drawer,.pg-popup-content,.pg-personal-nav-sheet) :is( .pg-newsroom__subtitle,.pg-side-header__subtitle,.pg-services__subtitle, .pg-knowledge-eyebrow,.pg-app-eyebrow,.pg-service-eyebrow,.pg-event-eyebrow, .pg-policy-eyebrow,.pg-directory-eyebrow,.pg-community-eyebrow, .pg-author-community-eyebrow,.pg-channels-eyebrow, .pg-card-post__cat,.pg-hub-card-status,.pg-author-role,.pg-author-rank, .pg-author-title,.pg-404-label,.pg-app-section__label,.pg-app-feedback__eyebrow ){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-label)!important;} html body.wp-theme-psyguild-theme .pg-author-directory-page [id="pg-no-results"] h2{font-weight:var(--pg-weight-heading)!important;} /* These are interface elements even while the article reader is active. */ html body.wp-theme-psyguild-theme :is(.pg-site-footer,.pg-sidebar-drawer,.pg-loader-overlay) :is( .pg-footer-heading,.pg-sidebar-drawer__title,.pg-sidebar-cta__title,.pg-loader-title ){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-heading)!important;} html body.wp-theme-psyguild-theme :is(.pg-comments-area,.pg-book-tools,.pg-book-related,.pg-book-sidebar) :is( .comment-reply-title,.pg-comments-title,.pg-book-card-title,.pg-book-tools-title ){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-heading)!important;} html body.wp-theme-psyguild-theme .pg-logo-title{font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-strong)!important;} html body.wp-theme-psyguild-theme .pg-loader-title{font-weight:var(--pg-weight-label)!important;} html body.wp-theme-psyguild-theme :is(.pg-comments-area,.pg-sidebar-drawer,.pg-book-tools,.pg-book-sidebar,.pg-site-footer,.pg-onboarding-dialog) :is(button,.pg-btn){font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-action)!important;} html body.wp-theme-psyguild-theme.archive main.pg-container>header h1{font-weight:var(--pg-weight-heading)!important;} /* Portal headings/labels include older inline styles. Scope excludes document * previews and editors, so authored content retains its own typography. */ html body.wp-theme-psyguild-theme .pg-portal-main :is(h1,h2,h3,h4):not(:where(.pg-entry-content *,.pg-review-content *,.wp-editor-wrap *,.pg-post-detail__content *,[contenteditable] *)){ font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-heading)!important; } html body.wp-theme-psyguild-theme .pg-portal-main :is(label,th):not(:where(.pg-entry-content *,.pg-review-content *,.wp-editor-wrap *)){ font-weight:var(--pg-weight-label)!important; } /* Form controls otherwise inherit browser defaults on several standalone pages. */ html body.wp-theme-psyguild-theme .pg-portal-main button:not(:where(.wp-editor-wrap *,.pg-entry-content *,.pg-review-content *)){ font-family:var(--pg-interface-font)!important;font-weight:var(--pg-weight-action)!important; } html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is(main,.pg-portal-main,.pg-site-header,.pg-sidebar-drawer,.pg-popup-content,.pg-personal-nav-sheet) :is(input,select,textarea,button):not(.wp-editor-area):not(.code):not([class*="mce-"]):not([class*="dashicons"]){font-family:var(--pg-interface-font);} /* PsyGuild source: layout-rhythm.css */ /* Fluid space between sections; existing grids, media, tables and editor * geometry remain owned by their modules. */ /* One visible header edge for document-level sticky regions. Local table and * dialog headers retain top:0 inside their own scroll containers. */ :root{ --pg-header-layout-height:134px; --pg-header-visible-bottom:134px; --pg-sticky-gap:24px; --pg-sticky-top:calc(var(--pg-header-visible-bottom) + var(--pg-sticky-gap)); --pg-sticky-height:max(0px,calc(100dvh - var(--pg-sticky-top) - 16px)); } @media(max-width:767.98px){:root{--pg-header-layout-height:56px;--pg-header-visible-bottom:56px;--pg-sticky-gap:16px}} html body.wp-theme-psyguild-theme:not(.pg-book-reader-active) .pg-site-header-spacer{height:var(--pg-header-layout-height)!important} html body.wp-theme-psyguild-theme.pg-has-explore-shell{--pg-explore-header-offset:var(--pg-header-visible-bottom)} html body.wp-theme-psyguild-theme :is(.pg-explore-rail,.pg-social-rail){top:var(--pg-sticky-top);max-height:var(--pg-sticky-height)} html body.wp-theme-psyguild-theme .pg-sub-header-wrapper{top:var(--pg-header-visible-bottom)!important} html body.wp-theme-psyguild-theme .pg-author-page.pg-demo-profile .pg-author-tabs-wrap{top:var(--pg-header-visible-bottom)} @media(min-width:1024px){ html body.wp-theme-psyguild-theme .pg-single-sidebar{top:var(--pg-sticky-top)!important;max-height:var(--pg-sticky-height)!important} } @media(min-width:701px){ html body.wp-theme-psyguild-theme .pg-academic-rail{top:var(--pg-sticky-top);max-height:var(--pg-sticky-height)} } @container pg-explore-content (max-width:600px){ html body.wp-theme-psyguild-theme .pg-academic-rail{position:static;max-height:none;overflow:visible} } @media(min-width:901px){ html body.pg-personal-surface :is(.pg-portal--profile .pg-portal-sidebar,.pg-editor-layout-column--sidebar,.pg-review-sidebar){top:var(--pg-sticky-top);max-height:var(--pg-sticky-height)} html body.pg-personal-surface .pg-review-workspace{overflow:clip} html body.pg-personal-surface .pg-review-select-hint{top:var(--pg-sticky-top)} } body.wp-theme-psyguild-theme{ --pg-space-section:clamp(36px,4.5vw,64px); --pg-space-block:clamp(24px,2.5vw,36px); --pg-space-panel:clamp(20px,2.2vw,32px); --pg-space-grid:clamp(24px,2.2vw,32px); } html body.wp-theme-psyguild-theme .pg-brand-home .pg-brand-hero{ margin-top:clamp(20px,2vw,32px);margin-bottom:var(--pg-space-section); padding-block:clamp(52px,5vw,80px) clamp(40px,4vw,64px); } html body.wp-theme-psyguild-theme .pg-brand-home .pg-home-grid{gap:var(--pg-space-grid);} html body.wp-theme-psyguild-theme .pg-brand-home :is(.pg-brand-tools,.pg-community-entry){margin-block:var(--pg-space-section);} html body.wp-theme-psyguild-theme .pg-brand-home .pg-home-media{margin-top:var(--pg-space-section);padding:var(--pg-space-panel);} html body.wp-theme-psyguild-theme .pg-brand-home .pg-home-side-card{padding:var(--pg-space-panel);} html body.wp-theme-psyguild-theme .pg-brand-home .pg-brand-section-head{margin-bottom:var(--pg-space-block);} html body.wp-theme-psyguild-theme .pg-brand-tools__list{gap:clamp(16px,1.8vw,24px);} html body.wp-theme-psyguild-theme :is(.pg-knowledge-surface,.pg-app-page,.pg-event-page,.pg-service-page,.pg-policy-page,.pg-author-directory-page) :is(.pg-knowledge-intro,.pg-app-intro,.pg-event-intro,.pg-service-intro,.pg-policy-intro,.pg-directory-intro){ padding-top:clamp(16px,2vw,28px);padding-bottom:var(--pg-space-block);margin-bottom:var(--pg-space-block); } html body.wp-theme-psyguild-theme .pg-knowledge-surface .pg-knowledge-topics{margin-bottom:var(--pg-space-block);} html body.wp-theme-psyguild-theme .pg-knowledge-surface .pg-article-grid{gap:clamp(16px,2vw,28px);} html body.wp-theme-psyguild-theme .pg-author-page.pg-demo-profile .pg-personal-layout{gap:var(--pg-space-grid);} html body.wp-theme-psyguild-theme .pg-profile-summary{gap:var(--pg-space-grid);margin-top:var(--pg-space-block);} html body.wp-theme-psyguild-theme .pg-profile-summary__card{padding:var(--pg-space-panel);} /* Give workspace headings/panels space, preserving bounded dashboard scrolling, * form fields, table cells, sticky offsets and the mobile action bar. */ html body.pg-personal-surface .pg-portal-main .pg-portal-page-header{margin-bottom:24px!important;gap:16px!important;} html body.pg-personal-surface .pg-admin-dashboard{gap:24px;} html body.pg-personal-surface .pg-admin-panel__header{padding:var(--pg-space-panel);} @media(min-width:768px){ html body.wp-theme-psyguild-theme :is(.pg-knowledge-surface,.pg-app-page,.pg-event-page,.pg-service-page,.pg-policy-page,.pg-author-directory-page){margin-top:clamp(44px,4vw,60px);} html body.wp-theme-psyguild-theme .pg-author-page.pg-demo-profile{margin-top:36px;} html body.wp-theme-psyguild-theme .pg-knowledge-surface .pg-knowledge-topics{padding:24px;gap:12px 20px;} html body.wp-theme-psyguild-theme .pg-knowledge-surface .pg-featured-content{padding:32px!important;} } @media(max-width:767.98px){ body.wp-theme-psyguild-theme{--pg-space-section:32px;--pg-space-block:28px;--pg-space-panel:20px;--pg-space-grid:24px;} html body.wp-theme-psyguild-theme :is(.pg-knowledge-surface,.pg-app-page,.pg-event-page,.pg-service-page,.pg-policy-page,.pg-author-directory-page){margin-top:0;padding-top:32px;} html body.wp-theme-psyguild-theme :is(.pg-knowledge-surface,.pg-app-page,.pg-event-page,.pg-service-page,.pg-policy-page,.pg-author-directory-page) :is(.pg-knowledge-intro,.pg-app-intro,.pg-event-intro,.pg-service-intro,.pg-policy-intro,.pg-directory-intro){padding-top:0;padding-bottom:24px;margin-bottom:28px;} html body.wp-theme-psyguild-theme .pg-knowledge-surface .pg-knowledge-topics{padding-bottom:16px;} } /* PsyGuild source: system-surfaces.css */ /* Shared functional surfaces. Presentation only: never change display, open, * hidden/inert states, positioning, scrolling, focus handling or form data. */ html body.wp-theme-psyguild-theme{ --pg-system-canvas:color-mix(in srgb,var(--pg-primary) 3%,var(--pg-bg-soft)); --pg-system-inset:color-mix(in srgb,var(--pg-primary) 3%,var(--pg-block-bg)); --pg-system-line:color-mix(in srgb,var(--pg-primary) 12%,var(--pg-brand-line)); --pg-system-shadow:0 8px 28px color-mix(in srgb,var(--pg-primary-deep) 7%,transparent); --pg-system-dialog-shadow:0 18px 60px color-mix(in srgb,var(--pg-brand-ink) 22%,transparent); --pg-system-scrim:color-mix(in srgb,var(--pg-brand-ink) 54%,transparent); } html body.wp-theme-psyguild-theme.pg-theme-dark{ --pg-system-canvas:color-mix(in srgb,var(--pg-block-bg) 76%,var(--pg-brand-ink)); --pg-system-line:color-mix(in srgb,var(--pg-primary) 10%,var(--pg-brand-line)); --pg-system-shadow:0 8px 28px color-mix(in srgb,var(--pg-brand-ink) 28%,transparent); --pg-system-dialog-shadow:0 18px 60px color-mix(in srgb,var(--pg-brand-ink) 46%,transparent); } /* Explicit panel list: leave overlay containers clear. Preserve each module's * desktop dialog / mobile sheet or full-screen geometry. */ html body.wp-theme-psyguild-theme :is(.pg-auth-card,.pg-auth-modal-card,.pg-modal-card,.pg-popup-content,.pg-community-dialog,.pg-channels-dialog,.pg-post-detail,.pg-contributor-request-modal__dialog,.pg-author-stats-modal__dialog,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-drive,.pg-credit-modal,.pg-onboarding-dialog,.pg-management-sheet,.pg-personal-nav-sheet,.psyguild-assessment-info-dialog__panel,.psyguild-assessment-auth__panel,.psyguild-result-modal__panel){ box-sizing:border-box; background-color:var(--pg-block-bg)!important; background-image:radial-gradient(ellipse at 100% 0,color-mix(in srgb,var(--pg-primary) 6%,transparent),transparent 340px)!important; border-color:var(--pg-system-line)!important; color:var(--pg-text)!important; box-shadow:var(--pg-system-dialog-shadow)!important; } html body.wp-theme-psyguild-theme :is(.pg-header-account__menu,.pg-search-dropdown,.pg-publish-split__menu,.pg-editor-layout-menu[open]){ background-color:var(--pg-block-bg)!important; border-color:var(--pg-system-line)!important; box-shadow:var(--pg-system-shadow)!important; } /* Quiet heading layer, without injecting an extra header or wrapping forms. */ html body.wp-theme-psyguild-theme :is(.pg-community-dialog,.pg-channels-dialog,.pg-post-detail)>header, html body.wp-theme-psyguild-theme :is(.pg-drive__header,.pg-admin-author-modal__header,.pg-author-manager__dialog-head,.pg-contributor-request-modal__top,.pg-credit-modal-head,.pg-management-sheet__head,.pg-popup-header){ background-color:var(--pg-system-inset)!important; border-color:var(--pg-system-line)!important; border-radius:8px; } html body.wp-theme-psyguild-theme :is(.pg-community-dialog,.pg-channels-dialog,.pg-post-detail)>header, html body.wp-theme-psyguild-theme :is(.pg-credit-modal-head,.pg-popup-header){padding:12px;} html body.wp-theme-psyguild-theme :is(.pg-auth-card,.pg-auth-modal-card,.pg-modal-card,.pg-popup-content,.pg-community-dialog,.pg-channels-dialog,.pg-post-detail,.pg-contributor-request-modal__dialog,.pg-author-stats-modal__dialog,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-drive,.pg-credit-modal,.pg-onboarding-dialog,.pg-management-sheet,.psyguild-assessment-info-dialog__panel,.psyguild-assessment-auth__panel) :is(h1,h2,h3,h4,legend){color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme .pg-credit-modal :is(p,label):not([role="alert"]):not([data-credit-status]):not(.is-error):not(.error){color:var(--pg-muted)!important;} /* One scrim for native dialogs and existing div-based modals. No large blur * layer on mobile; overlay visibility and click handling stay module-owned. */ html body.wp-theme-psyguild-theme :is(.pg-community-dialog,.pg-channels-dialog,.pg-post-detail,.pg-drive,.pg-credit-modal,.pg-management-sheet)::backdrop, html body.wp-theme-psyguild-theme :is(.pg-popup-overlay,.pg-auth-modal-backdrop,.pg-contributor-request-modal,.pg-author-stats-modal,.pg-admin-author-modal__backdrop,.pg-author-manager__dialog-backdrop,.psyguild-assessment-info-dialog__backdrop,.psyguild-assessment-auth__backdrop){ background:var(--pg-system-scrim)!important; backdrop-filter:none!important; -webkit-backdrop-filter:none!important; } /* Remaining operation screens and inset blocks; preserve grids, status * colours, article typography, print geometry and the runner state. */ html body.wp-theme-psyguild-theme :is(.pg-review-workspace,.psyguild-assessment-app){background-color:var(--pg-system-canvas)!important;} html body.wp-theme-psyguild-theme :is(.pg-review-header,.pg-review-sidebar,.pg-review-content,.pg-review-thread,.pg-report-credit-panel,.psyguild-assessment-question,.psyguild-assessment-result,.psyguild-assessment-history-panel,.psyguild-assessment-library-sidebar,.psyguild-assessment-library-results){background-color:var(--pg-block-bg)!important;border-color:var(--pg-system-line)!important;} html body.wp-theme-psyguild-theme :is(.pg-community-verification,.pg-community-response-box,.pg-drive__permission,.pg-drive__locations,.pg-drive__details,.pg-drive__footer,.pg-author-stats-modal__metric,.pg-admin-author-modal__scope,.pg-channels-data-policy,.pg-credit-package,.psyguild-assessment-info-dialog__guidance,.psyguild-assessment-info-dialog__section){background-color:var(--pg-system-inset)!important;border-color:var(--pg-system-line)!important;} html body.wp-theme-psyguild-theme .pg-comments-area .comment-respond{padding:clamp(16px,2vw,24px);border:1px solid var(--pg-system-line);border-radius:12px;background-color:var(--pg-system-inset);} html body.wp-theme-psyguild-theme .pg-portal-commerce :is(.woocommerce-customer-details,.woocommerce-order-details,.woocommerce-Address,.cart_totals,#order_review,#payment,form.woocommerce-EditAccountForm,form.woocommerce-form-login){background-color:var(--pg-block-bg)!important;border-color:var(--pg-system-line)!important;} /* Text fields only. Hidden inputs, checkboxes, radios, file pickers, content * editors and native semantic errors keep their original presentation. */ html body.wp-theme-psyguild-theme :is(.pg-portal-main,.pg-auth-card,.pg-auth-modal-card,.pg-modal-card,.pg-popup-content,.pg-community,.pg-community-dialog,.pg-channels-dialog,.pg-post-detail,.pg-contributor-request-modal__dialog,.pg-author-stats-modal__dialog,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-drive,.pg-credit-modal,.pg-report-credit-panel,.pg-comments-area,.pg-onboarding-dialog,.pg-management-sheet,.pg-personal-nav-sheet,.psyguild-assessment-auth,.psyguild-assessment-auth__panel,.psyguild-assessment-info-dialog__panel,.psyguild-result-modal__panel,.media-modal) :is(input:not([type]),input[type="text"],input[type="email"],input[type="url"],input[type="search"],input[type="number"],input[type="tel"],input[type="password"],input[type="date"],input[type="datetime-local"],select,textarea):not(:where(.wp-editor-wrap *,.mce-container *,.tox *,.wp-editor-area,.code)){background-color:var(--pg-system-inset)!important;color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme :is(.pg-portal-main,.pg-auth-card,.pg-auth-modal-card,.pg-modal-card,.pg-popup-content,.pg-community,.pg-community-dialog,.pg-channels-dialog,.pg-post-detail,.pg-contributor-request-modal__dialog,.pg-author-stats-modal__dialog,.pg-author-manager__dialog-panel,.pg-admin-author-modal__dialog,.pg-drive,.pg-credit-modal,.pg-report-credit-panel,.pg-comments-area,.pg-onboarding-dialog,.pg-management-sheet,.pg-personal-nav-sheet,.psyguild-assessment-auth,.psyguild-assessment-auth__panel,.psyguild-assessment-info-dialog__panel,.psyguild-result-modal__panel,.media-modal) :is(input:not([type]),input[type="text"],input[type="email"],input[type="url"],input[type="search"],input[type="number"],input[type="tel"],input[type="password"],input[type="date"],input[type="datetime-local"],select,textarea):not([aria-invalid="true"]):not(.is-error):not(.error):not(:where(.woocommerce-invalid *,.is-error *,.wp-editor-wrap *,.mce-container *,.tox *,.wp-editor-area,.code)){border-color:var(--pg-system-line)!important;} /* Media Library may mount outside main on the frontend. Frame only: leave * attachment thumbnails, editing canvas and iframe contents native. */ html body.wp-theme-psyguild-theme .media-modal :is(.media-modal-content,.media-frame-title,.media-frame-content,.media-frame-toolbar .media-toolbar){background-color:var(--pg-block-bg)!important;color:var(--pg-text)!important;border-color:var(--pg-system-line)!important;} html body.wp-theme-psyguild-theme .media-modal :is(.media-sidebar,.media-frame-menu,.media-frame-router,.attachments-browser .media-toolbar){background-color:var(--pg-system-inset)!important;border-color:var(--pg-system-line)!important;} html body.wp-theme-psyguild-theme .media-modal :is(h1,h2,h3,label,legend,.media-menu-item,.media-router a,.media-modal-close,.attachment-details .filename,.attachment-details .details){color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme .media-modal :is(.media-menu-item,.media-router a){background-color:transparent!important;} html body.wp-theme-psyguild-theme .media-modal :is(.media-menu-item.is-active,.media-menu-item.active,.media-router a.active){background-color:var(--pg-block-bg)!important;border-color:var(--pg-system-line)!important;} html body.wp-theme-psyguild-theme .media-modal .media-modal-icon::before{color:var(--pg-text)!important;} html body.wp-theme-psyguild-theme .media-modal :is(input,textarea)::placeholder{color:var(--pg-muted);opacity:1;} @media(max-width:767.98px){ /* Existing safe-area padding, edge-to-edge Drive, rounded sheets and app * navigation stay intact. No new fixed layer on the page. */ html body.wp-theme-psyguild-theme :is(.pg-community-dialog,.pg-channels-dialog,.pg-post-detail)>header, html body.wp-theme-psyguild-theme :is(.pg-credit-modal-head,.pg-popup-header){padding:10px;} } @media print{html body.wp-theme-psyguild-theme{--pg-system-dialog-shadow:none;--pg-system-shadow:none;}} /* PsyGuild source: auth-screens.css */ /* Account popup and direct password-recovery routes. */ .pg-auth-page{display:grid;min-height:calc(100svh - 90px);place-items:center;gap:1rem;padding:2.5rem 1rem 6rem;background:radial-gradient(ellipse at 50% 0,color-mix(in srgb,var(--pg-primary) 13%,transparent),transparent 60%)} .pg-auth-dialog{width:min(480px,calc(100vw - 24px));max-width:none;max-height:calc(100dvh - 32px);margin:auto;padding:0;border:0;border-radius:24px;background:transparent;color:var(--pg-text);overflow:auto;overscroll-behavior:contain;box-shadow:0 28px 90px rgba(6,24,45,.28);font-family:var(--pg-interface-font)} .pg-auth-dialog::backdrop{background:rgba(10,24,44,.55);backdrop-filter:blur(3px)} body.pg-auth-popup-open{overflow:hidden} .pg-auth-card{position:relative;width:100%;margin:0;padding:28px;border:1px solid var(--pg-border);border-radius:24px;background:var(--pg-block-bg);color:var(--pg-text);text-align:left;font-family:var(--pg-interface-font)} .pg-auth-page>.pg-auth-card{max-width:480px} html body.wp-theme-psyguild-theme :is(.pg-auth-dialog,.pg-auth-page) .pg-auth-card{background:var(--pg-block-bg)!important;border-color:var(--pg-system-line,var(--pg-border))!important;box-shadow:none!important} .pg-auth-card [hidden],.pg-auth-dialog[hidden]{display:none!important} .pg-auth-topbar{display:flex;align-items:center;justify-content:center;min-height:42px;position:relative;margin-bottom:22px} .pg-auth-brand{display:inline-flex;align-items:center;justify-content:center;gap:9px;max-width:calc(100% - 84px)} .pg-auth-logo{display:block;width:42px;height:42px;object-fit:contain;flex:0 0 auto} .pg-auth-logo-fallback{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:var(--pg-action-gradient);color:var(--pg-action-text,#fff);font-size:15px;font-weight:700} .pg-auth-eyebrow{display:inline-flex;align-items:center;gap:8px;color:var(--pg-link);font-size:11px;font-weight:700;letter-spacing:.16em} .pg-auth-eyebrow__dot{width:8px;height:8px;border-radius:50%;background:var(--pg-action-gradient);box-shadow:0 0 0 4px color-mix(in srgb,var(--pg-primary) 12%,transparent)} .pg-auth-back,.pg-auth-close{display:grid;place-items:center;width:34px;height:34px;padding:0;border:1px solid var(--pg-border);border-radius:50%;background:var(--pg-bg-soft);color:var(--pg-text);cursor:pointer;font:400 23px/1 var(--pg-interface-font)} .pg-auth-topbar .pg-auth-back{position:absolute;left:0;top:50%;transform:translateY(-50%);font-size:19px} .pg-auth-topbar .pg-auth-close{position:absolute;right:0;top:50%;transform:translateY(-50%)} .pg-auth-close:hover,.pg-auth-back:hover{background:color-mix(in srgb,var(--pg-primary) 12%,var(--pg-block-bg))} .pg-auth-header{text-align:center;margin-bottom:24px} .pg-auth-header h1{margin:0;color:var(--pg-text);font-size:clamp(22px,5vw,27px);font-weight:700;letter-spacing:-.045em;line-height:1.3;outline:0} .pg-auth-description{margin:10px 0 0;color:var(--pg-muted);font-size:13px;line-height:1.65} .pg-auth-methods{display:grid;gap:12px} .pg-auth-method{display:flex;align-items:center;gap:14px;width:100%;padding:17px 15px;border:1px solid var(--pg-border-strong);border-radius:15px;background:var(--pg-bg-soft);color:var(--pg-text);text-align:left;cursor:pointer;font-family:inherit;transition:border-color .16s,box-shadow .16s,transform .16s} .pg-auth-method:hover{border-color:var(--pg-primary-deep);box-shadow:0 5px 18px color-mix(in srgb,var(--pg-primary) 12%,transparent);transform:translateY(-1px)} .pg-auth-method>span:nth-child(2){display:grid;gap:4px;flex:1;min-width:0} .pg-auth-method strong{font-size:14px;font-weight:700} .pg-auth-method small{color:var(--pg-muted);font-size:11px;line-height:1.5;font-weight:400} .pg-auth-method__icon{display:grid;place-items:center;width:42px;height:42px;flex:0 0 auto;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-block-bg);color:var(--pg-link)} .pg-auth-google-mark{font:700 25px/1 Arial,sans-serif;color:#4285f4} .pg-auth-method__arrow{margin-left:auto;color:var(--pg-muted);font-size:18px} .pg-auth-choice-group{min-width:0;margin:0;padding:0;border:0} .pg-auth-role-grid{display:grid;gap:12px} .pg-auth-role-option{display:flex;align-items:center;gap:12px;min-height:86px;padding:16px;border:1px solid var(--pg-border-strong);border-radius:15px;background:var(--pg-bg-soft);cursor:pointer;transition:border-color .16s,background-color .16s} .pg-auth-role-option:hover,.pg-auth-role-option:has(input:checked){border-color:var(--pg-primary-deep);background:color-mix(in srgb,var(--pg-primary) 7%,var(--pg-block-bg))} .pg-auth-role-option input,.pg-auth-consent input,.pg-auth-remember input{width:17px;height:17px;flex:0 0 auto;margin:0;accent-color:var(--pg-primary-deep)} .pg-auth-role-option__body{display:grid;gap:4px;flex:1;min-width:0} .pg-auth-role-option__body strong{font-size:14px;font-weight:700;color:var(--pg-text)} .pg-auth-role-option__body>span{font-size:12px;font-weight:400;line-height:1.55;color:var(--pg-muted)} .pg-auth-hint{margin:16px 0 0;color:var(--pg-muted);text-align:center;font-size:11px;line-height:1.7} .pg-auth-provider-emblem{display:grid;place-items:center;width:62px;height:62px;margin:0 auto 20px;border:1px solid var(--pg-border);border-radius:20px;background:var(--pg-bg-soft);font-size:32px} .pg-auth-role-summary{width:fit-content;max-width:100%;margin:0 auto 16px;padding:7px 13px;border-radius:999px;background:color-mix(in srgb,var(--pg-primary) 12%,var(--pg-block-bg));color:var(--pg-link);font-size:12px;font-weight:700} .pg-auth-consent{display:flex;align-items:flex-start;gap:10px;margin-bottom:18px;color:var(--pg-muted);font-size:11px;font-weight:400;line-height:1.65} .pg-auth-consent input{margin-top:2px} .pg-auth-consent__link{display:block;margin-top:4px} .pg-auth-consent a{color:var(--pg-link);text-decoration:underline;text-underline-offset:3px} .pg-auth-google-button,.pg-auth-submit{display:flex;align-items:center;justify-content:center;gap:10px;width:100%;min-height:50px;padding:13px 16px;border:1px solid var(--pg-border-strong);border-radius:13px;background:var(--pg-block-bg);color:var(--pg-text);cursor:pointer;font:600 13px/1.5 var(--pg-interface-font);transition:box-shadow .16s,transform .16s} .pg-auth-google-button>.pg-auth-google-mark{font-size:22px} .pg-auth-submit{margin-top:18px;border-color:transparent;background:var(--pg-highlight-gradient);color:var(--pg-highlight-text);box-shadow:0 8px 20px color-mix(in srgb,var(--pg-primary) 15%,transparent)} .pg-auth-submit:hover:not(:disabled){background:var(--pg-highlight-gradient-hover);color:var(--pg-highlight-text)} .pg-auth-submit:hover,.pg-auth-google-button:hover{transform:translateY(-1px);box-shadow:0 8px 22px color-mix(in srgb,var(--pg-primary) 18%,transparent)} .pg-auth-card button:disabled{cursor:wait;opacity:.6;transform:none} .pg-auth-card :is(button,a,input):focus-visible{outline:3px solid var(--pg-interactive-accent);outline-offset:3px} .pg-auth-form{margin:0} .pg-auth-field{display:grid;gap:8px;min-width:0;color:var(--pg-text);font-size:12px;font-weight:600} .pg-auth-field input{width:100%;min-width:0;min-height:50px;margin:0;padding:13px 14px;border:1px solid var(--pg-border-strong);border-radius:12px;outline:0;font:400 14px/1.5 var(--pg-interface-font)} html body.wp-theme-psyguild-theme :is(.pg-auth-dialog,.pg-auth-page) .pg-auth-card .pg-auth-field input{background-color:var(--pg-bg-soft)!important;border-color:var(--pg-border-strong)!important;color:var(--pg-text)!important} html body.wp-theme-psyguild-theme :is(.pg-auth-dialog,.pg-auth-page) .pg-auth-card .pg-auth-field input:focus-visible{border-color:var(--pg-primary-deep)!important;box-shadow:0 0 0 3px color-mix(in srgb,var(--pg-primary) 14%,transparent)!important} .pg-auth-field input::placeholder{color:var(--pg-muted);opacity:.7} .pg-auth-password-wrap{position:relative;display:block} .pg-auth-password-wrap input{padding-right:68px} .pg-auth-password-wrap button{position:absolute;right:8px;top:7px;bottom:7px;padding:0 10px;border:0;border-radius:7px;background:transparent;color:var(--pg-link);font:600 11px var(--pg-interface-font);cursor:pointer} .pg-auth-email-summary{display:flex;align-items:center;justify-content:space-between;gap:10px;min-width:0;margin-bottom:20px;padding:11px 12px;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-bg-soft);font-size:12px} .pg-auth-email-summary>span{min-width:0;overflow-wrap:anywhere} .pg-auth-email-summary button{flex:0 0 auto;padding:5px 0;border:0;background:transparent;color:var(--pg-link);font:600 11px var(--pg-interface-font);cursor:pointer} .pg-auth-meta-row{display:flex;align-items:center;justify-content:flex-end;gap:12px;margin-top:12px;font-size:11px} .pg-auth-meta-row a,.pg-auth-footer a{color:var(--pg-link);font-weight:700;text-decoration:none} .pg-auth-meta-row a:hover,.pg-auth-footer a:hover{text-decoration:underline;text-underline-offset:3px} .pg-auth-remember{display:flex;align-items:center;gap:7px;margin-right:auto;color:var(--pg-muted)} .pg-auth-footer{margin:24px 0 0;padding-top:18px;border-top:1px solid var(--pg-border);color:var(--pg-muted);font-size:12px;line-height:1.7;text-align:center} .pg-auth-footer a{margin-left:3px} .pg-auth-card #pg-auth-status:empty{display:none!important} .pg-auth-card #pg-auth-status{margin:0 0 18px;padding:11px 12px;border:1px solid var(--pg-border);border-radius:10px;background:var(--pg-bg-soft);font-size:12px;line-height:1.6;overflow-wrap:anywhere} .pg-auth-card #pg-auth-status.pg-alert-error{background:#fff1f2;border-color:#fecaca;color:#b42318} .pg-auth-card #pg-auth-status.pg-alert-success{background:#f0fdf4;border-color:#bbf7d0;color:#15803d} .pg-auth-busy{position:absolute;inset:0;z-index:5;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:14px;padding:30px;border-radius:inherit;background:var(--pg-block-bg);text-align:center;font-size:13px} .pg-auth-busy p{margin:0;color:var(--pg-muted);line-height:1.65} .pg-auth-spinner{display:inline-block;width:32px;height:32px;border:3px solid color-mix(in srgb,var(--pg-primary) 18%,var(--pg-block-bg));border-top-color:var(--pg-primary-deep);border-radius:50%;animation:pg-auth-spin .75s linear infinite} .pg-auth-loading{text-align:center;padding:60px 28px} .pg-auth-loading>.pg-auth-close{position:absolute;right:18px;top:18px} .pg-auth-loading p{margin:15px 0 0;color:var(--pg-muted);font-size:13px} .pg-auth-reopen{display:flex;align-items:center;justify-content:center;gap:18px;flex-wrap:wrap;color:var(--pg-muted);font-size:13px} .pg-auth-reopen button{padding:12px 18px;border:1px solid var(--pg-border-strong);border-radius:12px;background:var(--pg-block-bg);color:var(--pg-text);font:inherit;cursor:pointer} .pg-auth-page--recovery .pg-auth-header{margin:8px 0 24px} .pg-auth-page--recovery .pg-auth-field+.pg-auth-field{margin-top:16px} @keyframes pg-auth-spin{to{transform:rotate(360deg)}} @media(max-width:600px){.pg-auth-dialog{width:calc(100vw - 24px);max-height:calc(100dvh - 24px);border-radius:20px}.pg-auth-card{padding:23px 20px;border-radius:20px}.pg-auth-dialog::backdrop{backdrop-filter:none}.pg-auth-page{padding:1rem 12px 7rem}.pg-auth-method{padding:15px 13px}.pg-auth-method small{font-size:11px}} @media(prefers-reduced-motion:reduce){.pg-auth-card *{transition:none!important}.pg-auth-spinner{animation:none}.pg-auth-submit:hover,.pg-auth-google-button:hover,.pg-auth-method:hover{transform:none}} /* PsyGuild source: article-reader.css */ /* Scrolling editorial posts. UI fonts and every colour follow the theme tokens. */ .pg-article-return{margin:0 0 22px;font:500 12px/1.7 var(--pg-interface-font);color:var(--pg-muted)} .pg-article-return a{display:inline-flex;align-items:center;flex-wrap:wrap;gap:9px;min-height:36px;color:var(--pg-link);text-decoration:none} html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active):not(.pg-has-explore-shell) .pg-single{width:min(1120px,calc(100% - 64px));margin-inline:auto;padding-top:32px} html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions>.pg-article-pdf{order:0;background:var(--pg-gradient);border-color:transparent;color:var(--pg-action-text);min-height:44px} html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions>.pg-article-share{order:1} .pg-article-reader-options{order:2;min-width:0} .pg-article-reader-options>summary{display:flex;align-items:center;justify-content:center;gap:8px;min-height:44px;padding:10px 14px;box-sizing:border-box;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-surface-strong);color:var(--pg-muted);font:500 12px/1.5 var(--pg-interface-font);cursor:pointer;list-style:none} .pg-article-reader-options>summary::after{content:'โŒ„'}.pg-article-reader-options>summary::-webkit-details-marker{display:none} .pg-article-reader-options[open]{flex-basis:100%;padding:12px;background:var(--pg-bg-soft);border:1px solid var(--pg-border);border-radius:12px} .pg-article-reader-options[open]>summary{justify-content:flex-start;width:max-content;border-color:transparent;background:transparent;padding:0;min-height:32px} .pg-article-reader-options__body{display:flex;align-items:center;flex-wrap:wrap;gap:10px;padding-top:10px} .pg-article-toc-shortcut,.pg-article-toc-close{display:none} @media(max-width:1023px){ html body.single-post:not(.pg-book-reader-active) #pg-single-sidebar-toggle{display:none!important} .pg-article-toc-shortcut{display:inline-flex;align-items:center;justify-content:center;gap:7px;order:2;min-height:44px;padding:9px 12px;border:1px solid var(--pg-border);border-radius:10px;background:var(--pg-surface-strong);color:var(--pg-text);font:500 12px/1.5 var(--pg-interface-font);cursor:pointer} .pg-article-reader-options{order:3} .pg-article-toc-close{display:block;align-self:flex-end;width:36px;height:36px;padding:0;border:1px solid var(--pg-border);border-radius:9px;background:var(--pg-bg-soft);color:var(--pg-text);font-size:24px;cursor:pointer} } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions{display:flex;flex-wrap:wrap} @media(min-width:1024px){html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active):not(.pg-has-explore-shell) .pg-single-grid{grid-template-columns:minmax(0,760px) minmax(220px,260px);gap:48px}} @media(max-width:767px){ html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active):not(.pg-has-explore-shell) .pg-single{width:100%;padding:20px 18px 0} .pg-article-return{margin-bottom:16px;font-size:11px} html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions>.pg-article-pdf,html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions>.pg-article-share{flex:1 1 calc(50% - 8px);min-width:0} html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions>.pg-article-share>.pg-single-print-btn{width:100%;justify-content:center} .pg-article-reader-options,.pg-article-toc-shortcut{flex:1 1 calc(50% - 8px)}.pg-article-reader-options[open]{flex-basis:100%}.pg-article-reader-options>summary{font-size:12px;min-height:44px} .pg-article-reader-options__body{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px} .pg-article-reader-options__body>.reader-audio-controls{grid-column:1/-1;display:flex} .pg-article-reader-options__body>.reader-audio-controls>button{flex:1} } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-title { font-family: var(--pg-interface-font); font-weight: var(--pg-weight-heading) !important; line-height: 1.28; letter-spacing: -.025em; margin-bottom: 24px; color: var(--pg-text); } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-header { margin-bottom: clamp(24px, 3vw, 40px); } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-meta-row { display: flex; flex-wrap: wrap; justify-content: flex-start; align-items: center; gap: 10px 16px; padding: 0 0 20px; margin: 0 0 20px; border: 0; border-bottom: 1px solid var(--pg-border); border-radius: 0; background: transparent !important; box-shadow: none; color: var(--pg-muted) !important; font: var(--pg-weight-label) .8125rem/1.6 var(--pg-interface-font); text-align: left; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-meta-row > :is(.pg-single-views,.pg-single-date,.pg-single-read-time,.pg-single-author-inline) { width: auto; min-height: 0; padding: 0; border: 0; border-radius: 0; background: transparent !important; box-shadow: none; font-weight: var(--pg-weight-label); color: var(--pg-muted) !important; justify-content: flex-start; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-meta-row .pg-single-author-inline { order: -1; flex-basis: 100%; gap: 8px; font-weight: var(--pg-weight-action); color: var(--pg-text) !important; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-author-avatar { width: 32px; height: 32px; margin: 0; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-cat { padding: 4px 10px; border: 0; border-radius: 999px; background: var(--pg-gradient) !important; color: var(--pg-action-text) !important; font-size: .6875rem; font-weight: var(--pg-weight-action); line-height: 1.6; text-decoration: none; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions { justify-content: flex-start; gap: 10px; padding: 0; margin-bottom: 24px; border: 0; border-radius: 0; background: transparent !important; box-shadow: none; color: var(--pg-text) !important; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions :is(.reader-audio-btn,.pg-single-print-btn) { min-height: 44px; padding: 10px 12px; gap: 8px; border: 1px solid var(--pg-border) !important; border-radius: 12px; background: var(--pg-surface-strong) !important; box-shadow: none; color: var(--pg-text) !important; font: var(--pg-weight-action) .8125rem/1.45 var(--pg-interface-font) !important; transform: none; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions :is(.reader-audio-btn,.pg-single-print-btn):is(:hover,:focus-visible,.is-playing,.is-paused):not(:disabled) { background: var(--pg-gradient) !important; border-color: transparent !important; color: var(--pg-action-text) !important; outline: 2px solid var(--pg-primary); outline-offset: 2px; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-action-icon { width: 18px; height: 18px; flex-basis: 18px; border: 0; border-radius: 0; background: transparent; color: inherit; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-audio-language-label, html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-audio-language-label select { color: var(--pg-muted); font: var(--pg-weight-label) .75rem/1.5 var(--pg-interface-font); } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-audio-language-label select { min-height: 44px; border-color: var(--pg-border); background: var(--pg-surface-strong); color: var(--pg-text); } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content { --pg-text: inherit; --pg-dark: inherit; --pg-muted: inherit; --pg-bg-soft: inherit; --pg-block-bg: inherit; --pg-surface-strong: inherit; --pg-border: inherit; --pg-border-strong: inherit; padding: clamp(24px, 2.3vw, 36px); border: 1px solid var(--pg-border) !important; border-radius: 20px; background: var(--pg-surface-strong) !important; color: var(--pg-text) !important; box-shadow: none !important; font-family: var(--pg-interface-font); font-weight: var(--pg-weight-copy); line-height: 1.85; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content :where(h1,h2,h3,h4,h5,h6) { font-weight: var(--pg-weight-heading) !important; line-height: 1.4; margin-block: 2em .8em; letter-spacing: -.015em; text-align: start !important; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content > :first-child { margin-top: 0; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content > :last-child { margin-bottom: 0; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content :where(p,ul,ol,blockquote) { margin-bottom: 1.5em; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content a { color: var(--pg-link) !important; text-underline-offset: .2em; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content blockquote { padding: 20px; background: var(--pg-bg-soft) !important; border-color: var(--pg-border) !important; border-left: 3px solid var(--pg-primary) !important; } @media (max-width: 767px) { html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-title { font-size: clamp(1.6rem, 6.6vw, 1.85rem); line-height: 1.3; margin-bottom: 20px; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-meta-row { gap: 8px 12px; padding-bottom: 16px; margin-bottom: 16px; font-size: .75rem; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-meta-row .pg-single-meta-divider { display: none; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions { gap: 8px; grid-template-columns: repeat(2,minmax(0,1fr)); } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions > .pg-audio-language-label { order: 1; justify-content: center; gap: 10px; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-single-reader-actions :is(.reader-audio-btn,.pg-single-print-btn) { padding-inline: 8px; font-size: .75rem !important; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content { padding: 24px 16px; font-size: 16px; line-height: 1.8; border-radius: 16px; } html body.wp-theme-psyguild-theme.single-post:not(.pg-book-reader-active) .pg-entry-content.single-content p:not(.has-text-align-center):not(.has-text-align-right) { text-align: start !important; } } @media (prefers-reduced-motion: reduce) { html body.wp-theme-psyguild-theme.single-post .pg-single-reader-actions button { transition: none; } } /* PsyGuild source: color-system.css */ /* Colour roles only. Canonical values are emitted by psyguild_brand_colors(). */ :root { --pg-primary-light:color-mix(in srgb,var(--pg-primary) 35%,var(--pg-palette-white)); --pg-primary-deep:var(--pg-palette-blue); --pg-secondary-deep:var(--pg-palette-blue-hover); --pg-highlight-mid-deep:var(--pg-palette-blue); --pg-action-stop:var(--pg-palette-blue); --pg-action-hover-stop:var(--pg-palette-blue-hover); --pg-action-text:var(--pg-palette-white); --pg-action-hover-text:var(--pg-palette-white); --pg-primary-contrast:var(--pg-action-text); --pg-primary-deep-text:var(--pg-palette-white); --pg-action-gradient:linear-gradient(130deg,var(--pg-palette-blue),var(--pg-palette-blue-deep)); --pg-action-gradient-hover:linear-gradient(130deg,var(--pg-palette-blue-hover),var(--pg-palette-blue-deep)); --pg-highlight-edge:color-mix(in srgb,var(--pg-secondary) 45%,var(--pg-palette-white)); --pg-highlight-outline:linear-gradient(135deg,var(--pg-highlight-edge),var(--pg-primary)); --pg-highlight-gradient:var(--pg-action-gradient) padding-box,var(--pg-highlight-outline) border-box; --pg-highlight-gradient-hover:var(--pg-action-gradient-hover) padding-box,var(--pg-highlight-outline) border-box; --pg-highlight-text:var(--pg-action-text); --pg-stage-primary:var(--pg-palette-dark-link); --pg-stage-secondary:var(--pg-palette-dark-link-hover); --pg-wordmark-gradient:linear-gradient(120deg,var(--pg-primary),var(--pg-palette-blue-deep) 78%); --pg-color-blue:var(--pg-primary); --pg-color-blue-strong:var(--pg-primary-deep); --pg-color-heal:var(--pg-secondary); --pg-color-heal-strong:var(--pg-secondary-deep); --pg-color-black:var(--pg-palette-dark-canvas); --pg-color-white:var(--pg-palette-white); } html body.wp-theme-psyguild-theme { color-scheme:light; --pg-bg:var(--pg-palette-canvas); --pg-color-page:var(--pg-bg); --pg-text:var(--pg-palette-ink); --pg-muted:var(--pg-palette-muted); --pg-color-text:var(--pg-text); --pg-color-muted:var(--pg-muted); --pg-dark:var(--pg-text); --pg-border:var(--pg-palette-line); --pg-border-strong:var(--pg-palette-line-strong); --pg-color-border:var(--pg-border); --pg-color-border-strong:var(--pg-border-strong); --pg-solid-section:var(--pg-palette-white); --pg-solid-block:var(--pg-palette-white); --pg-solid-header:var(--pg-palette-white); --pg-solid-footer:var(--pg-palette-white); --pg-bg-soft:var(--pg-palette-inset)!important; --pg-auth-surface:var(--pg-solid-block); --pg-link:var(--pg-palette-blue); --pg-link-hover:var(--pg-palette-blue-hover); --pg-interactive-accent:var(--pg-link); --pg-brand-ink:var(--pg-palette-dark-canvas); --pg-brand-stage:var(--pg-palette-dark-surface); --pg-brand-paper:var(--pg-palette-white); --pg-brand-line:var(--pg-border); --pg-header-shell:var(--pg-solid-header); --pg-header-shell-soft:var(--pg-bg-soft); --pg-header-text:var(--pg-text); --pg-header-text-strong:var(--pg-text); --pg-header-text-muted:var(--pg-muted); --pg-header-line:var(--pg-border); --pg-success:var(--pg-palette-success); --pg-success-bg:color-mix(in srgb,var(--pg-palette-green) 8%,var(--pg-palette-success-soft)); --pg-warning:var(--pg-palette-warning); --pg-warning-bg:var(--pg-palette-warning-soft); --pg-error:var(--pg-palette-danger); --pg-error-bg:var(--pg-palette-danger-soft); --pg-info:var(--pg-link); --pg-info-bg:var(--pg-palette-soft-blue); --pg-focus:var(--pg-link); --pg-nav-idle-text:var(--pg-muted); --pg-nav-hover:var(--pg-info-bg); --pg-nav-hover-text:var(--pg-link-hover); --pg-nav-active:var(--pg-palette-blue); --pg-nav-active-hover:var(--pg-palette-blue-hover); --pg-nav-active-text:var(--pg-palette-white); --pg-disabled-text:var(--pg-muted); --pg-disabled-bg:var(--pg-bg-soft); --pg-brand-gradient:var(--pg-action-gradient); --pg-brand-gradient-hover:var(--pg-action-gradient-hover); --pg-gradient:var(--pg-action-gradient); --pg-gradient-hover:var(--pg-action-gradient-hover); --pg-shadow-soft:0 8px 28px color-mix(in srgb,var(--pg-brand-ink) 6%,transparent); --pg-shadow-strong:0 18px 50px color-mix(in srgb,var(--pg-brand-ink) 12%,transparent); background-color:var(--pg-bg)!important; color:var(--pg-text); accent-color:var(--pg-link); } html body.wp-theme-psyguild-theme.pg-theme-dark { color-scheme:dark; --pg-bg:var(--pg-palette-dark-canvas); --pg-text:var(--pg-palette-dark-text); --pg-muted:var(--pg-palette-dark-muted); --pg-border:var(--pg-palette-dark-line); --pg-border-strong:var(--pg-palette-dark-line-strong); --pg-solid-section:var(--pg-palette-dark-surface); --pg-solid-block:var(--pg-palette-dark-surface); --pg-solid-header:var(--pg-palette-dark-surface); --pg-solid-footer:var(--pg-palette-dark-surface); --pg-bg-soft:var(--pg-palette-dark-inset)!important; --pg-link:var(--pg-palette-dark-link); --pg-link-hover:var(--pg-palette-dark-link-hover); --pg-color-blue-strong:var(--pg-link); --pg-color-heal-strong:var(--pg-link-hover); --pg-wordmark-gradient:linear-gradient(120deg,var(--pg-link-hover),var(--pg-link) 78%); --pg-success:var(--pg-palette-dark-success); --pg-success-bg:var(--pg-palette-dark-success-soft); --pg-warning:var(--pg-palette-dark-warning); --pg-warning-bg:var(--pg-palette-dark-warning-soft); --pg-error:var(--pg-palette-dark-danger); --pg-error-bg:var(--pg-palette-dark-danger-soft); --pg-info-bg:var(--pg-bg-soft); } /* Shared controls: primary and secondary actions keep the same roles everywhere. */ html body.wp-theme-psyguild-theme :is(.pg-btn-primary,.pg-btn-dark,.pg-hero-btn-primary,.pg-sidebar-cta__btn,.pg-community-primary,.pg-channels-primary,.pg-publish-split__toggle,.pg-author-follow-btn,.psyguild-assessment-submit,.woocommerce a.button.alt,.woocommerce button.button.alt) { background:var(--pg-action-gradient)!important; border-color:var(--pg-palette-blue)!important; color:var(--pg-action-text)!important; -webkit-text-fill-color:currentColor!important; box-shadow:0 3px 10px color-mix(in srgb,var(--pg-primary) 14%,transparent)!important; } html body.wp-theme-psyguild-theme :is(.pg-btn-primary,.pg-btn-dark,.pg-hero-btn-primary,.pg-sidebar-cta__btn,.pg-community-primary,.pg-channels-primary,.pg-publish-split__toggle,.pg-author-follow-btn,.psyguild-assessment-submit,.woocommerce a.button.alt,.woocommerce button.button.alt):is(:hover,:focus-visible):not(:disabled):not([aria-disabled="true"]) { background:var(--pg-action-gradient-hover)!important; color:var(--pg-action-text)!important; } html body.wp-theme-psyguild-theme :is(.pg-btn-secondary,.pg-btn-outline,.pg-community-secondary) { background:var(--pg-block-bg)!important; color:var(--pg-link)!important; border-color:var(--pg-border-strong)!important; -webkit-text-fill-color:currentColor!important; } html body.wp-theme-psyguild-theme :is(.pg-btn-secondary,.pg-btn-outline,.pg-community-secondary):is(:hover,:focus-visible):not(:disabled):not([aria-disabled="true"]) { background:var(--pg-info-bg)!important; color:var(--pg-link-hover)!important; border-color:var(--pg-link)!important; } html body.wp-theme-psyguild-theme :is(.pg-btn-primary,.pg-btn-dark,.pg-hero-btn-primary,.pg-author-follow-btn,.pg-btn-secondary,.pg-btn-outline,.pg-community-secondary) :is(span,small,strong,em,i) { color:inherit!important;-webkit-text-fill-color:currentColor!important; } /* Keyboard, inputs and disabled states share visible, accessible colours. */ html body.wp-theme-psyguild-theme :is(a,button,input,select,textarea,summary,[tabindex]):not(:where(.wp-editor-wrap *,.mce-container *,.tox *,.pg-book-reader-active *)):focus-visible { outline:3px solid var(--pg-focus)!important;outline-offset:3px; } html body.wp-theme-psyguild-theme :is(input,textarea)::placeholder {color:var(--pg-muted);opacity:1;} html body.wp-theme-psyguild-theme :is(input[type="text"],input[type="search"],input[type="email"],input[type="password"],input[type="url"],input[type="number"],input[type="tel"],select,textarea):not(:where(.wp-editor-wrap *,.mce-container *,.tox *,.wp-editor-area,.code)) { color:var(--pg-text);background-color:var(--pg-bg-soft);border-color:var(--pg-border-strong); } html body.wp-theme-psyguild-theme :is(input,select,textarea)[aria-invalid="true"] {border-color:var(--pg-error)!important;} html body.wp-theme-psyguild-theme :is(button,input[type="submit"],input[type="button"],.pg-btn):is(:disabled,[aria-disabled="true"]) { background:var(--pg-disabled-bg)!important;color:var(--pg-disabled-text)!important; -webkit-text-fill-color:currentColor!important;border-color:var(--pg-border)!important; box-shadow:none!important;opacity:1!important;cursor:not-allowed; } html body.wp-theme-psyguild-theme :is(.pg-status-success,.pg-notice--success,.woocommerce-message) {color:var(--pg-success);background-color:var(--pg-success-bg);} html body.wp-theme-psyguild-theme :is(.pg-status-error,.pg-notice--error,.woocommerce-error) {color:var(--pg-error);background-color:var(--pg-error-bg);} html body.wp-theme-psyguild-theme :is(.pg-status-warning,.pg-notice--warning) {color:var(--pg-warning);background-color:var(--pg-warning-bg);} html body.wp-theme-psyguild-theme ::selection {background:var(--pg-palette-blue);color:var(--pg-palette-white);} /* Important colours in this layer take precedence over older per-page styles. * Keep the selectors limited to navigation controls and their labels. */ @layer psyguild-navigation-colors { body.wp-theme-psyguild-theme .pg-site-header :is(#pg-sidebar-toggle,#pg-search-toggle,#pg-search-close,.pg-chatgpt__button) { color:var(--pg-text)!important; background:var(--pg-header-bg)!important; border-color:var(--pg-border)!important; & > svg {color:inherit!important;} &:is(:hover,:focus-visible,[aria-expanded="true"]):not(:disabled) { color:var(--pg-nav-hover-text)!important; background:var(--pg-nav-hover)!important; } } body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is( .pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn, .pg-event-tab-btn,.pg-search-tab,.pg-system-tab,.pg-filter-btn, .pg-catalog-tabs > button,.pg-category-tabs > :is(a,button),.pg-filter-tabs > :is(a,button), .pg-tabs > :is(a,button),.pg-stream-tabs a,.pg-sub-nav a,.pg-studio-nav a,.pg-explore-nav a,.pg-social-nav a, .pg-portal-nav-item,.pg-sidebar-link,.pg-sidebar-menu a,.pg-personal-nav-sheet a, .pg-management-sheet nav a,.pg-header-account__links a,.pg-bottom-tab, .pg-personal-bottom-nav :is(a,button),.pg-site-header .sub-menu a, .woocommerce-MyAccount-navigation a,.woocommerce-tabs .tabs a, .psyguild-assessment-category-list button,.psyguild-assessment-pagination button, .psyguild-assessment-layout-switch button,.pg-channels-toolbar nav button,.pg-community-view ) { --pg-nav-control-bg:transparent; --pg-nav-control-text:var(--pg-nav-idle-text); background:var(--pg-nav-control-bg)!important; color:var(--pg-nav-control-text)!important; -webkit-text-fill-color:currentColor!important; } body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is( a.page-numbers,span.page-numbers.current,span.page-numbers.is-disabled, .pg-review-pagination .page-numbers :is(a,.current),.woocommerce-pagination :is(a,span.current), .pg-community-pagination a,.pg-stream-pagination a ) { --pg-nav-control-bg:var(--pg-block-bg); --pg-nav-control-text:var(--pg-link); background:var(--pg-nav-control-bg)!important; color:var(--pg-nav-control-text)!important; border-color:var(--pg-border)!important; -webkit-text-fill-color:currentColor!important; } body.wp-theme-psyguild-theme:not(.pg-book-reader-active) :is( .pg-author-tab,.pg-newsroom-tab,.pg-knowledge-tab-btn,.pg-hub-tab-btn,.pg-hub-category-btn, .pg-event-tab-btn,.pg-search-tab,.pg-system-tab,.pg-filter-btn, .pg-catalog-tabs > button,.pg-category-tabs > :is(a,button),.pg-filter-tabs > :is(a,button), .pg-tabs > :is(a,button),.pg-stream-tabs a,.pg-sub-nav a,.pg-studio-nav a,.pg-explore-nav a,.pg-social-nav a, .pg-portal-nav-item,.pg-sidebar-link,.pg-sidebar-menu a,.pg-personal-nav-sheet a, .pg-management-sheet nav a,.pg-header-account__links a,.pg-bottom-tab, .pg-personal-bottom-nav :is(a,button),.pg-site-header .sub-menu a, .woocommerce-MyAccount-navigation a,.woocommerce-tabs .tabs a, .psyguild-assessment-category-list button,.psyguild-assessment-pagination button, .psyguild-assessment-layout-switch button,.pg-channels-toolbar nav button,.pg-community-view, a.page-numbers,span.page-numbers.current,span.page-numbers.is-disabled, .pg-review-pagination .page-numbers :is(a,.current),.woocommerce-pagination :is(a,span.current), .pg-community-pagination a,.pg-stream-pagination a ) { &:is(:hover,:focus-visible):not(:disabled,[aria-disabled="true"],.is-disabled) { --pg-nav-control-bg:var(--pg-nav-hover); --pg-nav-control-text:var(--pg-nav-hover-text); } &:is(.is-active,.active,.is-current,.current,[aria-current="page"],[aria-current="true"],[aria-selected="true"],[aria-pressed="true"],[aria-expanded="true"]):not(:disabled,[aria-disabled="true"],.is-disabled), :is(.current-menu-item,.current_page_item,.woocommerce-MyAccount-navigation .is-active,.woocommerce-tabs .tabs .active) > &:not(:disabled,[aria-disabled="true"],.is-disabled) { --pg-nav-control-bg:var(--pg-nav-active); --pg-nav-control-text:var(--pg-nav-active-text); --pg-tab-focus:var(--pg-nav-active-text); color:var(--pg-nav-active-text)!important; border-color:transparent!important; box-shadow:none!important; &:is(:hover,:focus-visible):not(:disabled,[aria-disabled="true"],.is-disabled) { --pg-nav-control-bg:var(--pg-nav-active-hover); --pg-nav-control-text:var(--pg-nav-active-text); } } &:is(:disabled,[aria-disabled="true"],.is-disabled) { --pg-nav-control-bg:var(--pg-disabled-bg); --pg-nav-control-text:var(--pg-disabled-text); opacity:1!important; } & :is(span,small,strong,svg):not(.pg-tab-progress) { color:inherit!important; -webkit-text-fill-color:currentColor!important; } } /* The wheel uses a shared moving circle as the fill for the centered icon. */ body.wp-theme-psyguild-theme .pg-route-wheel-ring {background:var(--pg-nav-active)!important;} body.wp-theme-psyguild-theme .pg-route-wheel-tab {color:var(--pg-nav-idle-text)!important;} body.wp-theme-psyguild-theme .pg-route-wheel-tab:is(.is-centered,.is-current,:hover,:focus-visible) {color:var(--pg-link)!important;} body.wp-theme-psyguild-theme .pg-route-wheel-tab.is-centered .pg-route-wheel-icon {color:var(--pg-nav-active-text)!important;} body.wp-theme-psyguild-theme .pg-route-wheel-tab.is-current:not(.is-centered) .pg-route-wheel-icon {color:var(--pg-link)!important;} } /* PsyGuild source: ai-bridge.css */ .pg-chatgpt--header{display:flex;align-items:center;flex:0 0 auto;gap:0;position:relative;isolation:isolate}.pg-chatgpt--header .pg-chatgpt__button{display:inline-flex;align-items:center;justify-content:center;gap:7px;width:auto;min-width:40px;height:40px;padding:0 10px;border:1px solid var(--pg-border,#dbe2ed);border-radius:9px;background:var(--pg-header-bg,#fff);color:var(--pg-text,#172337);font:600 12px/1.4 var(--pg-interface-font,system-ui,sans-serif);cursor:pointer}.pg-chatgpt__button:hover{background:var(--pg-bg-soft,#eef5ff)}.pg-chatgpt__button:disabled{opacity:.6;cursor:wait}.pg-ai{position:relative}.pg-chatgpt__settings{display:flex;align-items:center;justify-content:center;width:20px;min-height:40px;padding:0;cursor:pointer;list-style:none;color:var(--pg-muted,#64748b)}.pg-chatgpt__settings::-webkit-details-marker{display:none}.pg-ai__panel{box-sizing:border-box;position:fixed;z-index:9999;inset:auto;inset-block-start:var(--pg-ai-top,80px);inset-inline-start:var(--pg-ai-left,16px);margin:0;width:350px;max-width:calc(100vw - 16px);padding:20px;border:1px solid var(--pg-border,#dbe2ed);border-radius:16px;background:var(--pg-surface,#fff);color:var(--pg-text,#172337);box-shadow:0 16px 45px #142b4926;font:400 14px/1.6 var(--pg-interface-font,system-ui,sans-serif);text-align:left;max-height:70vh;overflow-y:auto;overflow-x:hidden}.pg-ai__panel>strong{display:block;font-size:17px}.pg-ai__panel p{margin:10px 0;font-size:13px;color:var(--pg-muted,#64748b)}.pg-ai__panel ol{padding-left:20px;font-size:13px}.pg-ai__panel li+li{margin-top:9px}.pg-ai__panel a{color:var(--pg-link,#175be6);text-underline-offset:3px}.pg-chatgpt--header :focus-visible,.pg-ai__panel :focus-visible{outline:3px solid #8eb5ff;outline-offset:2px}.pg-ai__panel [data-ai-status]{padding:10px;border-radius:8px;background:var(--pg-bg-soft,#f1f5fb)}.pg-chatgpt--header .screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}@media(max-width:767px){.pg-chatgpt__label{display:none}.pg-chatgpt--header .pg-chatgpt__button{width:36px;min-width:36px;height:36px;padding:0}.pg-chatgpt__settings{width:14px;min-height:36px}.pg-ai__panel{padding:18px}} html body .pg-site-header .pg-chatgpt--header .pg-chatgpt__button{width:auto!important;min-width:104px!important;padding:0 10px!important}.pg-chatgpt__button svg{flex:0 0 18px;display:block}@media(max-width:767px){html body .pg-site-header .pg-chatgpt--header .pg-chatgpt__button{width:36px!important;min-width:36px!important;padding:0!important}} /* PsyGuild source: participation.css */ .pg-participation-dialog{border:1px solid #dbe4e9;border-radius:20px;padding:28px;width:min(460px,calc(100vw - 32px));max-height:calc(100dvh - 32px);overflow:auto;color:#111827;background:#fff;box-sizing:border-box;box-shadow:0 24px 80px #10364a33}.pg-participation-dialog::backdrop{background:#0b263c77;backdrop-filter:blur(3px)}.pg-participation-dialog h2{font-size:1.5rem;margin:0 32px 14px 0}.pg-participation-dialog p{line-height:1.6}.pg-participation-dialog form,.pg-verified-comment form{display:grid;gap:12px}.pg-participation-dialog label{display:grid;gap:6px}.pg-participation-dialog input:not([type=checkbox]),.pg-participation-dialog textarea,.pg-participation-dialog select,.pg-verified-comment textarea{width:100%;border:1px solid #cbd5e1;border-radius:10px;padding:12px;font:inherit;box-sizing:border-box}.pg-participation-dialog textarea{min-height:150px}.pg-participation-close{float:right;border:0;background:transparent;font-size:1.5rem;cursor:pointer}.pg-participation-check{display:flex!important;align-items:flex-start;gap:8px!important;font-size:.9rem}.pg-participation-check input{margin-top:4px}.pg-participation-secondary{display:flex;gap:12px;flex-wrap:wrap;align-items:center}.pg-participation-dialog [role=status]{min-height:1.5em;margin:4px 0}.pg-participation-honey{position:absolute;left:-10000px;width:1px;height:1px;overflow:hidden}.pg-verified-comment{margin-top:24px}.pg-verified-comment textarea{resize:vertical}.pg-verified-comment form>button{justify-self:start}.pg-card-clickable{cursor:pointer}.pg-card-clickable:focus-visible{outline:3px solid #00bdd7;outline-offset:4px}.pg-participation-pending{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);z-index:10020;padding:12px 18px;border-radius:12px;background:#12394d;color:white;max-width:calc(100vw - 32px);box-sizing:border-box}.pg-discussion-rail [data-guest-question]{width:100%;margin-top:8px}.pg-erasure-options{margin-top:18px;border-top:1px solid #dbe4e9;padding-top:14px}.pg-erasure-options summary{cursor:pointer;font-weight:600}.pg-erasure-options button{margin-top:12px} .pg-participation-dialog [hidden],.pg-verified-comment [hidden]{display:none!important} @media(max-width:767px){.pg-participation-pending{bottom:82px}} /* One readable comment language for articles and social popups. */ .pg-comments-area,.pg-discussion-comments { --pg-comment-accent:#087b8b; --pg-comment-avatar:#e4f5f8; --pg-comment-surface:color-mix(in srgb,var(--pg-block-bg,#fff) 55%,var(--pg-bg,#eef5f7)); --pg-comment-line:var(--pg-border,#dbe5ea); } body.pg-theme-dark :is(.pg-comments-area,.pg-discussion-comments) { --pg-comment-accent:#61d7e6; --pg-comment-avatar:#143b43; --pg-comment-surface:color-mix(in srgb,var(--pg-block-bg) 75%,var(--pg-bg)); } .pg-comment-section-head { display:flex;align-items:center;justify-content:space-between;gap:16px;margin:0 0 22px; } .pg-comment-eyebrow { display:block;color:var(--pg-comment-accent);font:650 10px/1.5 var(--pg-brand-sans,inherit);letter-spacing:.1em;margin-bottom:5px; } .pg-comment-section-head :is(h3,.pg-comments-title) { display:flex;align-items:center;gap:10px;margin:0;font:650 21px/1.35 var(--pg-brand-sans,inherit);color:var(--pg-text); } .pg-comment-total { display:inline-grid;place-items:center;min-width:27px;min-height:26px;padding:1px 7px;border-radius:9px;background:var(--pg-comment-avatar);color:var(--pg-comment-accent);font:650 12px/1.4 var(--pg-brand-sans,inherit);box-sizing:border-box; } .pg-comment-order { flex:none;padding:6px 10px;border:1px solid var(--pg-comment-line);border-radius:8px;font-size:11px;color:var(--pg-muted); } .pg-comment-list,.pg-comment-list .children { list-style:none!important;padding:0;margin:0; } .pg-comment-list>.pg-comment-item { margin:0 0 22px; } .pg-comments-area .pg-comment-card,.pg-discussion-comments .pg-discussion-comment { display:grid;grid-template-columns:40px minmax(0,1fr);gap:12px;position:relative;min-width:0;margin:0 0 20px;padding:0!important;border:0!important;background:transparent!important;box-shadow:none!important; } .pg-comment-main,.pg-discussion-comment__main { min-width:0; } .pg-comment-avatar-frame { display:grid;place-items:center;position:relative;flex:none;width:40px;height:40px;margin-top:4px;overflow:hidden;border:1px solid var(--pg-comment-line);border-radius:50%;background:var(--pg-comment-avatar);color:var(--pg-comment-accent);box-sizing:border-box; } .pg-comment-initials { font:650 12px/1 var(--pg-brand-sans,inherit);letter-spacing:.01em; } .pg-comment-avatar-frame img { position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:cover;border-radius:inherit; } .pg-comment-bubble { padding:14px 16px;border:1px solid var(--pg-comment-line);border-radius:0 15px 15px 15px;background:var(--pg-comment-surface);min-width:0; } .pg-comment-head,.pg-discussion-comment__head { display:flex;flex-wrap:wrap;align-items:center;gap:5px 8px;margin:0 0 7px;min-width:0; } .pg-comment-head .pg-comment-author,.pg-discussion-comments .pg-discussion-comment__person { display:inline;color:var(--pg-text);font:650 13px/1.5 var(--pg-brand-sans,inherit);text-decoration:none;overflow-wrap:anywhere; } .pg-discussion-comments .pg-discussion-comment__person strong { font:inherit; } .pg-comment-author-badge { padding:2px 6px;border-radius:5px;background:var(--pg-comment-avatar);color:var(--pg-comment-accent);font:600 10px/1.4 var(--pg-brand-sans,inherit);white-space:nowrap; } .pg-comment-head .pg-comment-time,.pg-comment-date { margin-left:auto;color:var(--pg-muted);font:400 11px/1.5 var(--pg-brand-sans,inherit);text-decoration:none;white-space:nowrap; } .pg-comment-content,.pg-discussion-comments .pg-discussion-comment__text { margin:0;padding:0;border:0;border-radius:0;background:transparent;color:var(--pg-text);font:400 14px/1.75 var(--pg-brand-sans,inherit);overflow-wrap:anywhere;word-break:normal; } .pg-discussion-comments .pg-discussion-comment__text { white-space:pre-wrap; } .pg-comment-content>:first-child { margin-top:0; } .pg-comment-content>:last-child { margin-bottom:0; } .pg-comment-content :is(a,pre,code) { overflow-wrap:anywhere;white-space:pre-wrap; } .pg-comment-content img { max-width:100%;height:auto; } .pg-comment-actions,.pg-discussion-comments .pg-discussion-comment__tools { display:flex;flex-wrap:wrap;align-items:center;gap:2px 8px;margin:3px 0 0;padding:0; } .pg-comment-actions :is(button,a),.pg-discussion-comments .pg-discussion-comment__tools button { display:inline-flex;align-items:center;justify-content:center;gap:6px;min-height:34px;padding:5px 7px;border:0;border-radius:7px;background:transparent;color:var(--pg-muted);font:550 11px/1.5 var(--pg-brand-sans,inherit);text-decoration:none;cursor:pointer; } .pg-comment-actions :is(button,a):hover,.pg-discussion-comment__tools button:hover { background:var(--pg-comment-avatar);color:var(--pg-comment-accent); } .pg-comment-actions :is(button,a):focus-visible,.pg-discussion-comment__tools button:focus-visible,.pg-discussion-more-replies:focus-visible { outline:2px solid var(--pg-comment-accent);outline-offset:2px; } .pg-comment-actions .is-active,.pg-comment-actions [aria-pressed=true],.pg-discussion-comments .pg-discussion-comment__tools [aria-pressed=true] { color:var(--pg-comment-accent);background:var(--pg-comment-avatar); } .pg-comment-icon,.pg-comment-icon svg,.pg-comment-actions svg { display:block;flex:none;width:15px;height:15px; } .pg-discussion-comment__like { display:inline-flex; } .pg-discussion-comment__like [data-pg-card-count],.pg-comment-actions .pg-reaction-count { min-width:10px;font-variant-numeric:tabular-nums; } .pg-discussion-comment__tools .pg-comment-thread-toggle { color:var(--pg-comment-accent); } .pg-comment-thread-toggle[aria-expanded=true] .pg-comment-icon { transform:rotate(180deg); } .pg-discussion-comments .pg-discussion-comment__children { margin:13px 0 0 1px;padding-left:17px;border-left:1px solid var(--pg-comment-line); } .pg-discussion-comment__children>.pg-discussion-comment:before { content:'';position:absolute;top:22px;left:-17px;width:12px;height:1px;background:var(--pg-comment-line); } .pg-discussion-comment__children .pg-discussion-comment__children { margin-left:0;padding-left:12px; } .pg-discussion-comment__children .pg-discussion-comment__children>.pg-discussion-comment:before { left:-12px;width:8px; } .pg-discussion-comments .pg-discussion-more-replies { display:inline-flex;margin:0;padding:6px 9px;border:0;border-radius:7px;background:transparent;color:var(--pg-comment-accent);font:600 12px/1.5 var(--pg-brand-sans,inherit);cursor:pointer; } .pg-discussion-more-replies:hover { background:var(--pg-comment-avatar); } .pg-comment-thread-status { color:var(--pg-muted);font-size:12px;margin:5px 0; } .pg-comment-thread-status:empty { display:none; } .pg-comment-list .children { margin:5px 0 18px 51px;padding-left:17px;border-left:1px solid var(--pg-comment-line); } .pg-comment-list .children .children { margin-left:0;padding-left:12px; } .pg-comment-list .children>.pg-comment-item { position:relative; } .pg-comment-list .children>.pg-comment-item:before { content:'';position:absolute;top:23px;left:-17px;width:12px;height:1px;background:var(--pg-comment-line); } .pg-comment-pending { flex-basis:100%;color:#8b5a12;font:550 11px/1.5 var(--pg-brand-sans,inherit);margin:2px 0 0; } body.pg-theme-dark .pg-comment-pending { color:#ecc279; } .is-pending>.pg-comment-bubble,.is-pending>.pg-comment-main>.pg-comment-bubble,.is-pending>.pg-discussion-comment__main>.pg-comment-bubble { border-style:dashed; } .pg-comments-state,.pg-discussion-comments [data-comments-status][data-state=empty] { display:block;padding:24px 22px;margin:12px 0 22px;border:1px dashed var(--pg-comment-line);border-radius:13px;background:var(--pg-comment-surface);color:var(--pg-muted);text-align:center;font-size:13px;line-height:1.7; } .pg-discussion-comments [data-comments-status][data-state=loading] { padding:12px 0;color:var(--pg-muted);font-size:12px; } .pg-discussion-comments [data-comments-status][data-state=error] { padding:12px;border:1px solid var(--pg-comment-line);border-radius:9px;color:var(--pg-text);font-size:12px; } .pg-discussion-comments [data-comments-status]:empty { display:none; } .pg-discussion-comments>[data-comments-list][aria-busy=true] { opacity:.65; } .pg-comment-filters { display:flex;align-items:flex-end;flex-wrap:wrap;gap:10px;margin:0 0 24px;padding:12px 14px;border:1px solid var(--pg-comment-line);border-radius:11px;background:var(--pg-comment-surface); } .pg-comment-filters label { display:grid;gap:5px;min-width:125px;font-size:11px;color:var(--pg-muted); } .pg-comment-filters select { min-height:36px;border:1px solid var(--pg-comment-line);border-radius:7px;padding:6px 28px 6px 9px;background:var(--pg-block-bg);color:var(--pg-text);font:500 12px/1.4 var(--pg-brand-sans,inherit); } .pg-comment-filters .pg-btn { width:auto;flex:none;min-width:0;min-height:36px;font-size:12px;padding:7px 12px; } .pg-comment-filters__reset { align-self:center;font-size:12px;color:var(--pg-comment-accent); } .pg-comments-area .pg-verified-comment,.pg-discussion-comments .pg-discussion-comment-form { margin-top:24px;padding:18px;border:1px solid var(--pg-comment-line);border-radius:13px;background:var(--pg-comment-surface); } .pg-verified-comment h3 { margin:0 0 7px;font:650 16px/1.5 var(--pg-brand-sans,inherit);color:var(--pg-text); } .pg-verified-comment>p { color:var(--pg-muted);font-size:12px;line-height:1.7;margin:0 0 14px; } .pg-verified-comment label { color:var(--pg-text);font-size:12px; } .pg-discussion-comment-form>.pg-discussion-hint { display:none; } .pg-discussion-comments .pg-discussion-comment-form textarea,.pg-verified-comment textarea { background:var(--pg-block-bg);min-height:90px; } .pg-discussion-comments .pg-discussion-comment-edit { margin:10px 0 0; } .pg-discussion-reply-context,.pg-verified-comment [data-comment-context]:not([hidden]) { margin:0 0 8px;padding:8px 10px;border-radius:8px;background:var(--pg-comment-avatar);color:var(--pg-comment-accent);font-size:12px; } .pg-discussion-comment-form>.pg-participation-check { color:var(--pg-muted);font-size:11px; } .pg-discussion-comment-status,.pg-verified-comment [data-comment-status] { color:var(--pg-comment-accent);font-size:12px;line-height:1.6; } .pg-comment-actions [disabled],.pg-discussion-comment__tools [disabled] { opacity:.6;cursor:wait; } .pg-discussion-comments [hidden] { display:none!important; } @media(max-width:600px) { .pg-comment-section-head { margin-bottom:18px; } .pg-comment-section-head :is(h3,.pg-comments-title) { font-size:19px; } .pg-comments-area .pg-comment-card,.pg-discussion-comments .pg-discussion-comment { grid-template-columns:32px minmax(0,1fr);gap:8px;margin-bottom:17px; } .pg-comment-avatar-frame { width:32px;height:32px; } .pg-comment-initials { font-size:10px; } .pg-comment-bubble { padding:11px 12px;border-radius:0 12px 12px 12px; } .pg-comment-head .pg-comment-time,.pg-comment-date { margin-left:0; } .pg-comment-head .pg-comment-time:before,.pg-comment-date:before { content:'ยท';margin-right:6px; } .pg-comment-content,.pg-discussion-comments .pg-discussion-comment__text { font-size:13px;line-height:1.75; } .pg-comment-actions,.pg-discussion-comments .pg-discussion-comment__tools { gap:0 2px; } .pg-comment-actions :is(button,a),.pg-discussion-comments .pg-discussion-comment__tools button { min-height:40px;padding-inline:5px;font-size:11px;gap:5px; } .pg-comment-list .children { margin-left:13px;padding-left:12px; } .pg-comment-list .children>.pg-comment-item:before { left:-12px;width:8px; } .pg-comment-filters { display:grid;grid-template-columns:minmax(0,1fr) auto;align-items:end;padding:10px;gap:8px; } .pg-comment-filters label { min-width:0;width:auto; } .pg-comment-filters select { min-width:0;width:100%; } .pg-comment-filters .pg-btn { width:auto!important;justify-self:start; } .pg-comments-area .pg-verified-comment,.pg-discussion-comments .pg-discussion-comment-form { padding:13px; } } /* PsyGuild source: share-ui.css */ .pg-share-button{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:40px;padding:8px 12px;border:1px solid var(--pg-border);border-radius:9px;background:var(--pg-block-bg);color:var(--pg-link);font:500 12px/1.5 var(--pg-interface-font);cursor:pointer;white-space:nowrap} .pg-share-button svg{flex:none}.pg-share-button:focus-visible{outline:2px solid var(--pg-link);outline-offset:3px} html body .pg-share-dialog{box-sizing:border-box;width:min(650px,calc(100% - 32px));max-width:none;max-height:calc(100dvh - 32px);overflow:auto;padding:30px;border:1px solid var(--pg-border);border-radius:22px;background:var(--pg-block-bg);color:var(--pg-text);box-shadow:var(--pg-shadow-soft);font-family:var(--pg-interface-font)} .pg-share-dialog::backdrop{background:color-mix(in srgb,var(--pg-dark,#082b38) 45%,transparent);backdrop-filter:blur(4px)} .pg-share-dialog header{text-align:center;padding:4px 30px 0} .pg-share-brand{display:block;color:var(--pg-link);font-size:9px;letter-spacing:1.4px;margin-bottom:10px} .pg-share-dialog h2{margin:0 0 10px;font:600 25px/1.35 var(--pg-interface-font);letter-spacing:-.6px;color:var(--pg-text)} .pg-share-subtitle{font-size:13px;line-height:1.7;margin:0;color:var(--pg-muted);overflow-wrap:anywhere} .pg-share-intro{font-size:12px;line-height:1.85;margin:18px 0 22px;color:var(--pg-muted)} html body .pg-share-close{position:absolute;right:14px;top:14px;display:flex;align-items:center;justify-content:center;width:38px;height:38px;padding:0;border:0;border-radius:50%;background:var(--pg-bg-soft);color:var(--pg-muted);font:300 27px/1 var(--pg-interface-font);cursor:pointer} .pg-share-channels{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px} html body .pg-share-channel{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-width:0;min-height:110px;margin:0;padding:14px 10px;background:var(--pg-block-bg);border:1px solid var(--pg-border);border-radius:14px;color:var(--pg-text);font:600 12px/1.5 var(--pg-interface-font);cursor:pointer;box-shadow:none} .pg-share-channel-icon{display:flex;width:42px;height:42px;align-items:center;justify-content:center}.pg-share-channel-icon svg{display:block;width:40px;height:40px} html body .pg-share-channel{text-decoration:none}html body .pg-share-channel:hover,html body .pg-share-channel.is-selected{border-color:var(--pg-link);background:color-mix(in srgb,var(--pg-primary) 5%,var(--pg-block-bg))} .pg-share-channel small{font-size:10px;font-weight:400;color:var(--pg-muted);line-height:1.5} .pg-share-direct{margin-top:24px;padding-top:20px;border-top:1px solid var(--pg-border)} .pg-share-direct label{display:block;font-size:12px;font-weight:500;color:var(--pg-muted);margin-bottom:10px} .pg-share-copy-row{display:flex;align-items:stretch;gap:10px} html body .pg-share-copy-row input{box-sizing:border-box;width:100%;min-width:0;min-height:48px;padding:11px 13px;border:1px solid var(--pg-border);border-radius:10px;background:var(--pg-bg-soft);color:var(--pg-text);font:400 12px var(--pg-interface-font)} html body .pg-share-copy-row button{flex:none;min-height:48px;padding:11px 17px;border:1px solid transparent;border-radius:10px;background:var(--pg-primary);color:var(--pg-color-white,#fff);font:600 12px var(--pg-interface-font);cursor:pointer;white-space:nowrap} .pg-share-extras{display:flex;flex-wrap:wrap;gap:6px 16px;margin-top:10px} html body .pg-share-extras button,html body .pg-share-extras a{display:inline-flex;align-items:center;min-height:32px;border:0;padding:3px 0;background:none;color:var(--pg-muted);font:400 11px var(--pg-interface-font);cursor:pointer;text-decoration:none} .pg-share-dialog button:focus-visible,.pg-share-dialog a:focus-visible{outline:2px solid var(--pg-link);outline-offset:3px} .pg-share-dialog [hidden]{display:none!important} .pg-share-status{min-height:20px;margin:8px 0 0;font-size:11px;line-height:1.75;color:var(--pg-link)} .pg-share-status[data-error=true]{color:var(--pg-muted)} .pg-share-inline{display:flex;justify-content:flex-start;margin:12px 0} .pg-event-card-link{display:flex;flex:1;flex-direction:column;min-width:0;color:inherit;text-decoration:none} .pg-event-card:has(>.pg-event-card-link){display:flex;flex-direction:column} .pg-event-card>.pg-share-button{align-self:flex-start;margin:0 18px 16px} .pg-hub-card-footer .pg-share-button{font-size:10px;min-height:38px;padding:6px 9px} html body .pg-hub-card-open{display:inline-flex;align-items:center;justify-content:space-between;gap:8px;flex:1;min-width:0;min-height:40px;padding:0;background:none;border:0;color:inherit;text-align:left;font:inherit;cursor:pointer} @media(max-width:600px){ html body .pg-share-dialog{width:calc(100% - 20px);max-height:calc(100dvh - 24px);padding:24px 18px 18px;border-radius:19px} .pg-share-dialog header{padding:6px 17px 0}.pg-share-dialog h2{font-size:21px}.pg-share-intro{margin:14px 0 18px;font-size:11px} .pg-share-channels{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px} html body .pg-share-channel{min-height:88px;padding:10px;gap:6px;font-size:11px}.pg-share-channel-icon{width:34px;height:34px}.pg-share-channel-icon svg{width:34px;height:34px} .pg-share-copy-row{flex-direction:column;gap:8px}.pg-share-copy-row button{width:100%} .pg-share-direct{margin-top:18px;padding-top:16px}.pg-share-extras button,.pg-share-extras a{min-height:40px} html body .pg-share-copy-row input{font-size:16px} .pg-hub-card-footer{gap:8px;flex-wrap:wrap}.pg-hub-card-footer .pg-share-button{min-height:44px;min-width:40px}.pg-hub-card-footer .pg-share-button>span{display:none} } @media(prefers-reduced-motion:reduce){.pg-share-dialog::backdrop{backdrop-filter:none}} /* PsyGuild source: card-actions.css */ /* A single interaction row, shared across author, article and community cards. */ html body .pg-card-actions{display:flex;align-items:center;justify-content:flex-start;gap:12px;width:100%;min-width:0;grid-column:1/-1;flex:0 0 auto;border-top:1px solid var(--pg-border);padding:9px 0 0;margin-top:10px;color:var(--pg-text);font:500 11px/1.4 var(--pg-interface-font,inherit)} html body .pg-card-actions>:is(a,button,span){display:inline-flex;align-items:center;justify-content:center;gap:5px;flex:0 0 auto;min-height:32px;min-width:30px;padding:3px 0;margin:0;background:none;border:0;border-radius:5px;color:inherit;box-shadow:none;text-decoration:none;font:inherit;white-space:nowrap} html body .pg-card-actions>:is(a,button){cursor:pointer} html body .pg-card-actions svg{display:block;flex:none;width:19px;height:19px} html body .pg-card-actions button[aria-pressed=true]{color:var(--pg-link)} .pg-card-actions button[aria-pressed=true] svg{fill:color-mix(in srgb,var(--pg-link) 12%,transparent)} .pg-card-actions button:disabled{opacity:.45;cursor:wait} .pg-card-actions :is(a,button):hover{color:var(--pg-link)} .pg-card-actions :is(a,button):focus-visible{outline:2px solid var(--pg-link);outline-offset:3px} .pg-card-actions [data-pg-card-action=share]{margin-left:auto} .pg-card-actions [data-pg-card-count]{font-variant-numeric:tabular-nums;font-size:10px} /* Social feed cards retain the shared engagement API and a lighter action row. */ html body .pg-card-actions--social{display:block;border:0;padding:0;margin-top:12px;color:var(--pg-muted)} .pg-card-social-stats{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:8px;padding-bottom:10px;font-size:11px} .pg-card-social-stats>span,.pg-card-social-stats>a{display:inline-flex;align-items:center;gap:5px;color:var(--pg-muted);text-decoration:none} html body .pg-card-social-stats svg{width:14px;height:14px;color:var(--pg-link)} .pg-card-social-buttons{display:grid;grid-template-columns:repeat(3,minmax(0,1fr)) 40px;align-items:center;gap:4px;padding-top:6px;border-top:1px solid var(--pg-border)} .pg-card-social-buttons>:is(a,button),.pg-card-social-more>summary{display:flex;align-items:center;justify-content:center;gap:7px;box-sizing:border-box;min-height:42px;padding:7px 6px;border:0;border-radius:8px;background:transparent;color:var(--pg-muted);font:500 12px/1.4 var(--pg-interface-font);text-decoration:none;cursor:pointer} .pg-card-social-buttons>:is(a,button):hover,.pg-card-social-more>summary:hover{background:var(--pg-bg-soft);color:var(--pg-link)} .pg-card-social-buttons [aria-pressed=true]{background:color-mix(in srgb,var(--pg-primary) 8%,var(--pg-block-bg))} .pg-card-social-more{position:relative;min-width:0} .pg-card-social-more>summary{list-style:none} .pg-card-social-more>summary::-webkit-details-marker{display:none} .pg-card-social-more>summary:focus-visible{outline:2px solid var(--pg-link);outline-offset:3px} .pg-card-social-menu{position:absolute;bottom:calc(100% + 7px);right:0;z-index:8;display:grid;box-sizing:border-box;width:208px;padding:7px;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-block-bg);box-shadow:var(--pg-shadow-soft)} html body .pg-card-social-menu>:is(button,a,span){display:flex;align-items:center;justify-content:flex-start;gap:8px;width:100%;min-height:40px;margin:0;padding:8px 10px;border:0;border-radius:7px;background:transparent;color:var(--pg-text);font:500 12px/1.5 var(--pg-interface-font);text-decoration:none} html body .pg-card-social-menu>span{min-height:30px;color:var(--pg-muted);font-size:11px} .pg-card-social-menu>:is(button,a):hover{background:var(--pg-bg-soft)} @media(max-width:767px){ .pg-card-social-buttons{grid-template-columns:repeat(3,minmax(0,1fr)) 44px;gap:2px} .pg-card-social-buttons>:is(a,button),.pg-card-social-more>summary{min-height:44px;padding-inline:3px;gap:5px;font-size:11px} html body .pg-card-actions--social svg{width:18px;height:18px} html body .pg-card-social-stats svg{width:14px;height:14px} } .pg-news-card>.pg-card-actions{padding:8px 14px 2px;margin:4px 0 0;align-self:end} .pg-card-post>.pg-card-actions{margin-top:10px} .pg-community-card>.pg-card-actions{margin-top:12px} html body .pg-card-dialog{max-width:460px;width:calc(100% - 32px);max-height:calc(100dvh - 40px);overflow:auto;border:1px solid var(--pg-border);border-radius:18px;padding:24px;background:var(--pg-block-bg,var(--pg-bg));color:var(--pg-text);box-shadow:var(--pg-shadow-soft);font-family:var(--pg-interface-font,inherit)} .pg-card-dialog::backdrop{background:color-mix(in srgb,var(--pg-dark,#082b38) 42%,transparent);backdrop-filter:blur(4px)} .pg-card-dialog h2{font:600 22px/1.45 var(--pg-interface-font,inherit);letter-spacing:-.5px;margin:6px 0 12px} .pg-card-dialog>p,.pg-card-dialog form>p{font-size:12px;line-height:1.85;color:var(--pg-muted)} .pg-card-dialog label{display:block;font-size:12px;margin:14px 0 6px} html body .pg-card-dialog input{box-sizing:border-box;width:100%;min-height:48px;border:1px solid var(--pg-border);border-radius:9px;background:var(--pg-bg-soft);color:var(--pg-text);padding:10px 12px;font:400 14px var(--pg-interface-font,inherit)} .pg-card-dialog input[inputmode=numeric]{font-variant-numeric:tabular-nums;letter-spacing:.3em} html body .pg-card-dialog button:not(.pg-card-dialog-close){display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:10px 14px;border:1px solid var(--pg-border);border-radius:9px;background:var(--pg-bg-soft);color:var(--pg-text);font:500 12px var(--pg-interface-font,inherit);cursor:pointer} html body .pg-card-dialog button[type=submit]{background:var(--pg-primary);color:var(--pg-color-white,#fff);border-color:transparent;min-width:130px;margin-top:14px} .pg-card-dialog button:disabled{opacity:.5;cursor:wait} .pg-card-dialog-close{float:right;display:block;width:36px;height:36px;background:none;border:1px solid var(--pg-border);border-radius:9px;color:var(--pg-text);cursor:pointer;font-size:24px;line-height:1} .pg-card-dialog .pg-card-dialog-brand{font-size:9px;letter-spacing:1.5px;color:var(--pg-link);margin:8px 0} .pg-card-dialog [role=status]{font-size:12px;line-height:1.8;min-height:22px;margin:12px 0 0} .pg-card-dialog [data-error=true]{color:var(--pg-danger,#b44444)} .pg-card-dialog [hidden]{display:none!important} .pg-card-honeypot{position:absolute!important;left:-10000px;top:auto;width:1px;height:1px;overflow:hidden} .pg-card-saved-list{padding:0;list-style:none;margin:12px 0} .pg-card-saved-list li{padding:12px 0;border-bottom:1px solid var(--pg-border)} .pg-card-saved-list a{display:block;color:var(--pg-link);text-decoration:none;font-size:13px;line-height:1.8} .pg-card-saved-list small{font-size:10px;color:var(--pg-muted)} .pg-card-dialog-tools{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0} .pg-card-notice{position:fixed;z-index:9999;bottom:calc(84px + env(safe-area-inset-bottom));left:50%;transform:translateX(-50%);width:max-content;max-width:calc(100% - 28px);padding:12px 16px;border:1px solid var(--pg-border);border-radius:12px;background:var(--pg-block-bg);color:var(--pg-text);box-shadow:var(--pg-shadow-soft);font:400 12px/1.7 var(--pg-interface-font,inherit)} .pg-card-notice button{background:none;border:0;color:var(--pg-link);font:inherit;cursor:pointer;margin-left:9px;padding:3px} html body .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions){flex-wrap:wrap!important;gap:10px!important;height:auto!important;min-height:0} .pg-card-author:not(.pg-directory-card)>.pg-card-actions{align-self:end} .pg-card-author:not(.pg-directory-card)>.pg-author-follow-btn{width:auto;min-height:36px;padding:6px 12px;font-size:11px} .pg-card-author:not(.pg-directory-card)>.pg-author-follow-btn small{display:none} .pg-studio-rank-card:has(>.pg-card-actions){flex-wrap:wrap;row-gap:8px} html body .pg-studio-rank-card>.pg-card-actions{margin-top:4px;padding-top:6px;gap:8px} .pg-studio-rank-card:not(:first-child) .pg-card-share-label{display:none} html body .pg-studio-rank-card:first-child>.pg-card-actions{color:var(--pg-color-white);border-color:color-mix(in srgb,var(--pg-color-white) 20%,transparent);margin-top:18px} html body.wp-theme-psyguild-theme .pg-brand-home .pg-newsroom__grid>.pg-news-card:has(>.pg-card-actions){flex-wrap:wrap!important} .pg-social-ranking{container-type:inline-size} html body.wp-theme-psyguild-theme .pg-explore-rail .pg-author-item:has(>.pg-card-actions):not([hidden]){display:flex!important;flex-direction:column!important;align-items:stretch!important;flex:0 0 auto!important;height:auto!important;min-height:0!important;gap:6px!important} html body.wp-theme-psyguild-theme .pg-explore-rail .pg-author-item[hidden]{display:none!important} .pg-author-item__profile{display:flex;align-items:center;gap:10px;color:inherit;text-decoration:none;min-width:0;width:100%} .pg-author-item__profile .pg-author-info{min-width:0;flex:1} html body .pg-author-item>.pg-author-follow-btn{align-self:flex-start;width:auto;min-height:30px;padding:5px 9px;font-size:10px} .pg-author-item>.pg-author-follow-btn small{display:none} html body .pg-author-item>.pg-card-actions{margin-top:0;padding-top:3px;gap:4px;justify-content:space-between} .pg-author-item .pg-card-share-label{display:none} @container(max-width:260px){ html body .pg-card-actions{gap:2px;font-size:10px} html body .pg-card-actions>:is(a,button,span){min-width:24px;gap:3px} html body .pg-card-actions svg{width:16px;height:16px} .pg-card-actions .pg-card-share-label{display:none} } @media(max-width:767px){ /* Keep the text column when an article gains a third, full-width child. */ html body .pg-card-post:has(>.pg-card-actions):not([hidden]){display:grid;grid-template-columns:var(--pg-mobile-card-image-width,clamp(88px,27vw,116px)) minmax(0,1fr);align-items:start} .pg-card-post:has(>.pg-card-actions)>.pg-card-post__media{grid-column:1;grid-row:1} .pg-card-post:has(>.pg-card-actions)>.pg-card-post__body{grid-column:2;grid-row:1;min-width:0} .pg-card-post>.pg-card-actions{grid-column:1/-1;grid-row:2} html body .pg-card-actions{gap:2px;justify-content:space-between;padding-top:5px;margin-top:8px} html body .pg-card-actions>:is(a,button,span){min-height:44px;min-width:40px;gap:4px} html body .pg-card-actions>:is(a,button){min-width:44px} html body .pg-card-actions>.pg-card-return-count{min-width:32px} html body .pg-studio-rank-card>.pg-card-actions{gap:0} .pg-card-actions [data-pg-card-action=share]{margin-left:0} .pg-card-actions .pg-card-share-label{font-size:10px} .pg-card-dialog{padding:20px} html body .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions){display:grid!important;grid-template-columns:56px minmax(0,1fr);padding:14px!important;gap:7px 12px!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) :is(.pg-card-author__identity,.pg-card-author__content){display:contents!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__avatar{grid-column:1;grid-row:1/4;width:56px!important;height:56px!important;border-radius:15px!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__details{display:flex;flex-direction:column;grid-column:2;grid-row:1;min-width:0} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__name{order:-1;font-size:16px!important;line-height:1.5!important;white-space:normal!important;overflow:visible!important;margin:0 0 3px!important} .pg-card-author:not(.pg-directory-card) .pg-card-author__name a{color:inherit;text-decoration:none} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__field-badge{font-size:8px!important;padding:2px 5px!important;align-self:flex-start;max-width:100%} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__bio{display:none!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__stats{grid-column:2;grid-row:2;margin:0!important;gap:8px!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__stat{padding:0!important;background:none!important;text-align:left!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__stat>div{font-size:10px!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions) .pg-card-author__link{display:none!important} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions)>.pg-author-follow-btn{grid-column:2;grid-row:3;justify-self:start;min-height:40px;width:auto!important;margin:0} .pg-card-author:not(.pg-directory-card):has(>.pg-card-actions)>.pg-card-actions{grid-row:4;grid-column:1/-1} } @media(prefers-reduced-motion:reduce){.pg-card-dialog::backdrop{backdrop-filter:none}} @media(max-width:360px){.pg-card-actions .pg-card-share-label{display:none}} /* Give the three public counters equal space, including on narrow catalog cards. */ html body .pg-card-actions.pg-card-metrics { box-sizing:border-box; gap:5px; padding:9px 0 0; margin-top:10px; align-items:stretch; justify-content:space-between; } html body .pg-card-metrics > :is(button,a) { flex:1 1 0; display:grid; grid-template-columns:auto auto; align-content:center; justify-content:center; column-gap:5px; row-gap:2px; min-width:0; min-height:44px; padding:4px 2px; margin:0; border-radius:9px; color:var(--pg-text); background:var(--pg-bg-soft); } html body .pg-card-metrics > :is(button,a):hover { color:var(--pg-link); } html body .pg-card-metrics > button[aria-pressed=true] { color:var(--pg-danger,#ae3752); background:color-mix(in srgb,var(--pg-danger,#ae3752) 10%,var(--pg-block-bg)); } .pg-card-metrics > button[aria-pressed=true] svg { fill:currentColor; } html body .pg-card-metrics > :is(button,a) svg { width:15px; height:15px; } .pg-card-metrics > :is(button,a) [data-pg-card-count] { font-size:13px; font-weight:700; } .pg-card-metric-label { grid-column:1/-1; text-align:center; font-size:10px; color:var(--pg-muted); white-space:normal; } .pg-card-metrics > .pg-card-social-more { flex:0 0 36px; } .pg-card-metrics .pg-card-social-menu { z-index:15; } .pg-card-metrics .pg-card-social-more > summary { height:100%; } /* PsyGuild source: discussion-social.css */ /* Social discussions share PsyGuild's configured typography and colour tokens. */ .pg-discussion { --social-paper: var(--pg-block-bg); min-width:0; } .pg-discussion button,.pg-social-dialog button { cursor:pointer; font-family:inherit; } .pg-discussion [hidden],.pg-social-dialog [hidden] { display:none!important; } .pg-discussion-controls { margin:0 0 20px; padding:10px 14px 4px; border:1px solid var(--pg-border); border-radius:20px 20px 8px 20px; background:var(--pg-block-bg); box-shadow:0 5px 20px color-mix(in srgb,var(--pg-text) 3%,transparent); font-family:var(--pg-interface-font); } .pg-discussion-composer { display:flex; align-items:center; gap:14px; padding:0 0 10px; margin:0; border:0; border-radius:0; background:transparent; } .pg-discussion-composer__prompt { display:flex; align-items:center; flex:1; min-width:0; gap:12px; text-align:left; min-height:62px; padding:6px 0; border:0; border-radius:12px; background:transparent; color:var(--pg-muted); } .pg-discussion-composer__avatar { display:block; width:44px; height:44px; flex:none; object-fit:cover; border-radius:50%; background:var(--pg-bg); } .pg-discussion-composer__placeholder { display:block; flex:1; min-width:0; padding:12px 16px; border-radius:999px; background:var(--pg-bg); color:var(--pg-muted); font:400 14px/1.5 var(--pg-interface-font); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; transition:background .16s; } .pg-discussion-composer__prompt:hover .pg-discussion-composer__placeholder { background:color-mix(in srgb,var(--pg-text) 5%,var(--pg-bg)); } .pg-discussion-composer__tools { display:flex; flex:none; gap:4px; } .pg-discussion-composer__tools button,.pg-discussion-compose-tools button { display:inline-flex; align-items:center; justify-content:center; gap:7px; min-height:44px; padding:8px 10px; border:0; border-radius:10px; background:transparent; color:var(--pg-text); font-size:12px; font-weight:600; white-space:nowrap; } .pg-discussion-composer__tools button:hover,.pg-discussion-compose-tools button:hover { background:var(--pg-bg); } .pg-discussion-composer__tools button svg { width:18px; height:18px; color:var(--pg-link); } .pg-discussion-composer__tools button[data-pick-kind="video"] svg { color:var(--pg-secondary); } .pg-discussion-composer__tools .pg-discussion-question { margin-left:6px; padding-left:14px; border-left:1px solid var(--pg-border); border-radius:0; color:var(--pg-muted); font-weight:500; } .pg-discussion-toolbar { display:flex; justify-content:space-between; gap:12px; align-items:center; margin:0; padding-top:4px; border-top:1px solid var(--pg-border); } .pg-discussion-toolbar nav { display:flex; gap:4px; min-width:0; overflow-x:auto; scrollbar-width:none; } .pg-discussion-toolbar nav::-webkit-scrollbar { display:none; } .pg-discussion-toolbar nav a { display:flex; align-items:center; gap:6px; min-height:44px; color:var(--pg-muted); padding:8px 10px; border-radius:8px; font-size:12px; font-weight:500; text-decoration:none; white-space:nowrap; } .pg-discussion-toolbar nav a[aria-current] { color:var(--pg-text); font-weight:650; background:transparent; } .pg-discussion-toolbar nav a[aria-current]::before { content:""; width:5px; height:5px; flex:none; border-radius:50%; background:var(--pg-primary); } .pg-discussion-filter { position:relative; flex:none; font-size:13px; } .pg-discussion-filter summary { display:flex; align-items:center; justify-content:center; gap:6px; min-height:44px; cursor:pointer; padding:8px 10px; border-radius:9px; list-style:none; color:var(--pg-muted); font-size:12px; } .pg-discussion-filter summary svg { width:17px; height:17px; } .pg-discussion-filter[open] summary,.pg-discussion-filter summary:hover { color:var(--pg-link); background:var(--pg-bg); } @media(min-width:768px) { @container(max-width:620px) { .pg-discussion-composer { flex-wrap:wrap; gap:0; padding-bottom:0; } .pg-discussion-composer__prompt { flex-basis:100%; } .pg-discussion-composer__tools { width:100%; } .pg-discussion-composer__tools .pg-discussion-question { margin-left:auto; border:0; } } } .pg-discussion-filter summary::-webkit-details-marker,.pg-discussion-menu summary::-webkit-details-marker { display:none; } .pg-discussion-filter form { position:absolute; right:0; top:100%; z-index:8; display:grid; gap:10px; min-width:250px; padding:16px; border:1px solid var(--pg-border); border-radius:12px; background:var(--pg-block-bg); box-shadow:0 12px 36px #001d3520; } .pg-discussion-filter select { max-width:100%; } .pg-discussion-notice:empty { display:none; } .pg-discussion-notice { color:var(--pg-link); font-size:13px; padding:10px 0; } .pg-discussion-feed { display:grid; grid-template-columns:minmax(0,1fr); align-items:start; gap:18px; } .pg-discussion-post { min-width:0; padding:22px; background:var(--pg-block-bg); border:1px solid var(--pg-border); border-radius:12px; box-shadow:none; overflow-wrap:anywhere; } .pg-discussion-post__head { display:flex; align-items:flex-start; justify-content:space-between; gap:12px; margin-bottom:16px; } .pg-discussion-person { display:flex; align-items:center; gap:10px; min-width:0; color:var(--pg-text); text-decoration:none; } .pg-discussion-person img { width:42px; height:42px; border-radius:50%; flex:none; object-fit:cover; background:var(--pg-bg); } .pg-discussion-person span { display:grid; gap:3px; min-width:0; } .pg-discussion-person strong { font:650 14px/1.4 var(--pg-brand-sans); } .pg-discussion-person time { color:var(--pg-muted); font:400 11px/1.5 var(--pg-brand-sans); } .pg-discussion-menu { position:relative; flex:none; } .pg-discussion-menu summary { padding:6px; color:var(--pg-muted); font-size:16px; list-style:none; cursor:pointer; } .pg-discussion-menu>div { position:absolute; right:0; top:100%; z-index:5; display:grid; min-width:185px; padding:5px; background:var(--pg-block-bg); border:1px solid var(--pg-border); border-radius:10px; box-shadow:0 8px 26px #001d351a; } .pg-discussion-menu button { padding:11px; border:0; border-radius:6px; background:transparent; color:var(--pg-text); text-align:left; font-size:13px; } .pg-discussion-menu button:hover { background:var(--pg-bg); } .pg-discussion-topic { display:inline-block; color:var(--pg-link); text-decoration:none; font-size:11px; font-weight:650; margin-bottom:10px; } .pg-discussion-text { display:block; margin:0 0 16px; color:var(--pg-text); font:400 15px/1.75 var(--pg-brand-sans); text-decoration:none; white-space:pre-wrap; } .pg-discussion-post:not(.is-expanded) .pg-discussion-text { display:-webkit-box; -webkit-line-clamp:9; -webkit-box-orient:vertical; overflow:hidden; } .pg-discussion-media { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:3px; overflow:hidden; border-radius:9px; margin:0 0 16px; background:var(--pg-bg); } .pg-discussion-media[data-media-count="1"] { grid-template-columns:minmax(0,1fr); } .pg-discussion-media a { display:block; min-width:0; } .pg-discussion-media img { display:block; width:100%; height:100%; max-height:520px; object-fit:cover; aspect-ratio:1; } .pg-discussion-media[data-media-count="1"] img { height:auto; aspect-ratio:auto; object-fit:contain; } .pg-discussion-media video { display:block; width:100%; max-height:520px; background:#071c29; grid-column:1/-1; } .pg-discussion-media[data-media-count="3"] a:first-child { grid-row:span 2; } .pg-discussion-post .pg-discussion-actions { display:flex; justify-content:space-between; gap:4px; margin:0; padding:12px 0 0; border-top:1px solid var(--pg-border); } .pg-discussion-actions :is(button,a) { display:flex; flex:1; align-items:center; justify-content:center; gap:6px; min-height:42px; padding:6px 7px; color:var(--pg-muted); font-size:12px; } .pg-discussion-actions [aria-pressed="true"] { color:var(--pg-link); background:color-mix(in srgb,var(--pg-primary) 9%,transparent); } .pg-discussion-actions [aria-pressed="true"] svg { fill:color-mix(in srgb,var(--pg-primary) 12%,transparent); } .pg-discussion-read { display:block; padding-top:8px; color:var(--pg-link); text-decoration:none; font-size:11px; } .pg-discussion-read span { float:right; } .pg-discussion-pending { color:var(--pg-muted); font-size:12px; border-top:1px solid var(--pg-border); padding-top:12px; } .pg-discussion-empty { grid-column:1/-1; display:grid; justify-items:center; text-align:center; padding:50px 24px; border:1px dashed var(--pg-border); border-radius:15px; } .pg-discussion-empty>svg { width:38px; height:38px; color:var(--pg-link); margin-bottom:12px; } .pg-discussion-empty h2 { font:650 21px/1.4 var(--pg-brand-sans); margin:0 0 8px; } .pg-discussion-empty p { max-width:440px; color:var(--pg-muted); font-size:14px; line-height:1.7; margin:0 0 20px; } .pg-discussion-rail { display:grid; gap:8px; padding:18px; border:1px solid var(--pg-border); border-radius:12px; background:var(--pg-block-bg); } .pg-discussion-rail h2 { font:650 15px/1.4 var(--pg-brand-sans); margin:0 0 6px; } .pg-discussion-rail>a { display:flex; justify-content:space-between; padding:10px 1px; color:var(--pg-text); text-decoration:none; font-size:13px; } .pg-discussion-rail p { margin:4px 0 0; padding-top:12px; border-top:1px solid var(--pg-border); font-size:11px; color:var(--pg-muted); } .pg-social-modal-open { overflow:hidden; scrollbar-gutter:stable; } .pg-social-dialog { box-sizing:border-box; color:var(--pg-text); background:var(--pg-block-bg); border:1px solid var(--pg-border); border-radius:20px; box-shadow:0 24px 90px #00182740; padding:0; font-family:var(--pg-brand-sans); } .pg-social-dialog:not([open]) { display:none!important; } .pg-social-dialog::backdrop { background:#071a2b80; } .pg-social-dialog--post { width:min(1400px,calc(100vw - 48px)); max-width:none; height:min(930px,calc(100dvh - 48px)); max-height:none; overflow:hidden; } .pg-social-dialog__layout { display:grid; grid-template-columns:minmax(0,1fr) 350px; height:100%; min-height:0; } .pg-social-dialog__main { min-width:0; overflow:auto; overscroll-behavior:contain; padding:32px; scrollbar-width:thin; } .pg-social-dialog__main>[data-post-status]:empty { display:none; } .pg-social-dialog__main .pg-discussion-post { padding:0; border:0; box-shadow:none; border-radius:0; background:transparent; } .pg-social-dialog__aside { min-width:0; padding:64px 24px 28px; border-left:1px solid var(--pg-border); overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; background:var(--pg-block-bg); } .pg-social-dialog__close { position:absolute; top:14px; right:14px; z-index:12; display:grid; place-items:center; width:38px; height:38px; padding:0; border:0; border-radius:50%; color:var(--pg-text); background:var(--pg-bg); } .pg-social-dialog__close:hover { background:color-mix(in srgb,var(--pg-primary) 12%,var(--pg-bg)); } .pg-social-dialog--author { width:min(440px,calc(100vw - 32px)); max-height:85dvh; padding:60px 26px 26px; overflow:auto; } .pg-discussion-author__identity { display:flex; align-items:center; gap:12px; color:var(--pg-text); text-decoration:none; } .pg-discussion-author__identity img { width:60px; height:60px; border:1px solid var(--pg-border); border-radius:50%; object-fit:cover; flex:none; } .pg-discussion-author__identity span { display:grid; min-width:0; gap:5px; } .pg-discussion-author__identity strong { font-size:17px; font-weight:700; line-height:1.4; } .pg-discussion-author__identity small { color:var(--pg-muted); font-size:12px; } .pg-discussion-author__details>summary { display:none; } .pg-discussion-author__bio { margin:18px 0; font-size:13px; line-height:1.8; color:var(--pg-muted); white-space:pre-line; overflow-wrap:anywhere; } .pg-discussion-author__stats { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:8px; margin:18px 0; padding:17px 0; border-block:1px solid var(--pg-border); text-align:center; } .pg-discussion-author__stats dt { color:var(--pg-text); font-size:20px; font-weight:700; } .pg-discussion-author__stats dd { margin:5px 0 0; color:var(--pg-muted); font-size:11px; } .pg-discussion-follow { width:100%; min-height:44px; } .pg-discussion-follow[aria-pressed="true"] { color:var(--pg-link); background:color-mix(in srgb,var(--pg-primary) 10%,var(--pg-block-bg)); } .pg-discussion-author__profile { display:flex; align-items:center; justify-content:space-between; gap:6px; min-height:44px; margin-top:8px; padding:8px 12px; border:1px solid var(--pg-border-strong); border-radius:10px; background:var(--pg-block-bg); color:var(--pg-link); font:650 12px/1.45 var(--pg-interface-font); text-align:center; text-decoration:none; } .pg-discussion-author__profile:hover { border-color:var(--pg-link); background:var(--pg-info-bg,var(--pg-bg-soft)); color:var(--pg-link-hover); } .pg-discussion-author__profile svg { width:17px; height:17px; flex:none; } .pg-discussion-author h3 { font:650 12px/1.5 var(--pg-brand-sans); margin:24px 0 10px; color:var(--pg-muted); text-transform:uppercase; letter-spacing:.04em; } .pg-discussion-author__recent { list-style:none; margin:0; padding:0; } .pg-discussion-author__recent a { display:grid; gap:6px; padding:14px 0; border-top:1px solid var(--pg-border); color:var(--pg-text); text-decoration:none; } .pg-discussion-author__recent span { font-size:13px; font-weight:600; line-height:1.5; } .pg-discussion-author__recent small { font-size:11px; color:var(--pg-muted); } .pg-discussion-comments { margin-top:30px; scroll-margin-top:20px; } .pg-discussion-comments>header { display:flex; align-items:center; justify-content:space-between; padding:0 0 16px; margin:0 0 20px; border-bottom:1px solid var(--pg-border); } .pg-discussion-comments h3 { font:650 20px/1.4 var(--pg-brand-sans); margin:0; } .pg-discussion-comments>header>span { font-size:12px; color:var(--pg-muted); } .pg-discussion-comments>p { font-size:13px; color:var(--pg-muted); } .pg-discussion-comment { margin:0 0 20px; min-width:0; } .pg-discussion-comment__person { display:flex; align-items:center; gap:9px; color:var(--pg-text); text-decoration:none; } .pg-discussion-comment__person img { width:32px; height:32px; border-radius:50%; object-fit:cover; flex:none; } .pg-discussion-comment__person strong { font-size:13px; font-weight:650; } .pg-discussion-comment__text { margin:5px 0 6px 41px; padding:11px 14px; border-radius:0 12px 12px; background:var(--pg-bg); color:var(--pg-text); font-size:14px; line-height:1.7; white-space:pre-wrap; overflow-wrap:anywhere; } .pg-discussion-comment__tools { display:flex; flex-wrap:wrap; align-items:center; gap:12px; margin-left:41px; } .pg-discussion-comment__tools :is(small,button) { color:var(--pg-muted); font:500 11px/1.5 var(--pg-brand-sans); } .pg-discussion-comment__tools button { border:0; padding:4px 0; background:transparent; min-height:30px; } .pg-discussion-comment__tools [aria-pressed="true"] { color:var(--pg-link); font-weight:700; } .pg-discussion-comment__children { margin:16px 0 0 41px; padding-left:12px; border-left:2px solid var(--pg-border); } .pg-discussion-more-replies { margin-left:41px; border:0; padding:6px 0; color:var(--pg-link); background:transparent; font-size:12px; } .pg-discussion-comment-form { display:grid; gap:8px; margin-top:24px; border-top:1px solid var(--pg-border); padding-top:20px; } .pg-discussion-comment-form textarea,.pg-discussion-comment-edit textarea { box-sizing:border-box; width:100%; min-height:80px; padding:14px; border:1px solid var(--pg-border); border-radius:12px; color:var(--pg-text); background:var(--pg-block-bg); font:400 14px/1.6 var(--pg-brand-sans); resize:vertical; } .pg-discussion-comment-tools { display:flex; justify-content:space-between; align-items:center; gap:12px; } .pg-discussion-comment-tools small { color:var(--pg-muted); font-size:10px; } .pg-discussion-comment-status:empty { display:none; } .pg-discussion-comment-status { font-size:12px; color:var(--pg-link); } .pg-discussion-comment-login { display:grid; gap:10px; font-size:13px; color:var(--pg-muted); } .pg-discussion-reply-context { display:flex; align-items:center; gap:8px; margin:0; font-size:12px; color:var(--pg-link); } .pg-discussion-reply-context button { margin-left:auto; background:transparent; color:var(--pg-muted); border:0; } .pg-discussion-comment-edit { margin:10px 0 0 41px; display:flex; flex-wrap:wrap; gap:10px; } .pg-discussion-comment-edit textarea { flex-basis:100%; } .pg-discussion-comment-edit p { flex-basis:100%; font-size:12px; } .pg-social-dialog--compose { width:min(580px,calc(100vw - 32px)); max-height:90dvh; overflow:auto; padding:28px; } .pg-social-compose__heading { margin-bottom:20px; padding-right:30px; } .pg-discussion-eyebrow { font-size:10px; font-weight:650; letter-spacing:.08em; color:var(--pg-link); margin:0 0 8px; } .pg-social-compose__heading h2 { margin:0; font:650 24px/1.3 var(--pg-brand-sans); letter-spacing:-.02em; } .pg-social-dialog [data-discussion-login]>p { font-size:14px; line-height:1.75; color:var(--pg-muted); } .pg-google-login { gap:12px; width:100%; min-height:46px; } .pg-google-login span { font-size:20px; font-weight:700; } .pg-social-dialog [data-discussion-form]>textarea { box-sizing:border-box; width:100%; min-height:170px; margin:0 0 10px; padding:0; border:0; outline-offset:4px; border-radius:0; background:transparent; color:var(--pg-text); font:400 16px/1.7 var(--pg-brand-sans); resize:vertical; } .pg-discussion-topic-label { display:block; font-size:12px; font-weight:600; margin-bottom:7px; } .pg-social-dialog select { box-sizing:border-box; width:100%; padding:10px; border:1px solid var(--pg-border); border-radius:8px; background:var(--pg-block-bg); color:var(--pg-text); font-size:13px; } .pg-discussion-compose-tools { display:flex; align-items:center; gap:8px; margin:14px 0 0; padding:8px 0; border-top:1px solid var(--pg-border); } .pg-discussion-compose-tools>span { margin-right:auto; font-size:12px; color:var(--pg-muted); } .pg-discussion-hint { color:var(--pg-muted); font-size:11px; line-height:1.6; margin:8px 0 15px; } [data-compose-loading]:empty { display:none; } .pg-discussion-submit { width:100%; min-height:44px; } .pg-discussion-previews { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; } .pg-discussion-previews:empty { display:none; } .pg-discussion-previews figure { position:relative; margin:0; border-radius:10px; overflow:hidden; background:var(--pg-bg); } .pg-discussion-previews :is(img,video) { display:block; width:100%; height:150px; object-fit:contain; } .pg-discussion-previews figure>button { position:absolute; right:5px; top:5px; border:0; border-radius:50%; width:30px; height:30px; background:var(--pg-block-bg); color:var(--pg-text); font-size:22px; } .pg-discussion-upload-progress,.pg-discussion-form-status { font-size:12px; color:var(--pg-link); line-height:1.6; } .pg-discussion-drive { margin-top:18px; padding:16px; border:1px solid var(--pg-border); border-radius:10px; background:var(--pg-bg); } .pg-discussion-drive h3 { font:650 16px/1.5 var(--pg-brand-sans); margin:0; } .pg-discussion-drive p { color:var(--pg-muted); font-size:13px; line-height:1.7; } .pg-discussion-drive .pg-btn { margin:0 5px 6px 0; } .pg-discussion-toast { position:fixed; z-index:1000000; left:50%; bottom:90px; transform:translateX(-50%); max-width:min(560px,88vw); padding:14px 20px; border:1px solid var(--pg-border); border-radius:12px; background:var(--pg-block-bg); color:var(--pg-text); box-shadow:0 8px 32px #001d3520; font:500 13px/1.6 var(--pg-brand-sans); } .pg-discussion-article h2 { font:650 28px/1.35 var(--pg-brand-sans); margin:12px 0; } .pg-discussion-article__date { color:var(--pg-muted); font-size:12px; } .pg-discussion-article img { width:100%; height:auto; max-height:340px; object-fit:contain; border-radius:10px; margin:18px 0; } .pg-discussion-article>p:last-of-type { font-size:15px; line-height:1.85; color:var(--pg-muted); } .pg-discussion-detail { display:grid; grid-template-columns:minmax(0,1fr) 300px; gap:24px; margin:24px 0 40px; } .pg-discussion-detail>aside { padding:22px; background:var(--pg-block-bg); border:1px solid var(--pg-border); border-radius:14px; } .pg-discussion-back { display:inline-block; margin-top:20px; color:var(--pg-link); font-size:13px; } .pg-social-dialog :is(button,a,textarea,select):focus-visible,.pg-discussion :is(button,a,select,summary):focus-visible { outline:2px solid var(--pg-primary); outline-offset:3px; } .pg-social-dialog button:disabled { opacity:.6; cursor:wait; } @media(max-width:1023px) { .pg-social-dialog__layout { grid-template-columns:minmax(0,1fr) 290px; } .pg-social-dialog__main { padding:24px; } .pg-social-dialog__aside { padding-inline:20px; } .pg-discussion-detail { grid-template-columns:minmax(0,1fr); } } @media(max-width:767px) { .pg-discussion-controls { padding:8px 10px 2px; margin-bottom:16px; border-radius:18px 18px 7px 18px; box-shadow:none; } .pg-discussion-composer { padding:0; gap:0; flex-wrap:wrap; } .pg-discussion-composer__prompt { flex-basis:100%; min-height:62px; gap:10px; } .pg-discussion-composer__avatar { width:38px; height:38px; } .pg-discussion-composer__placeholder { font-size:12px; padding:13px 12px; } .pg-discussion-composer__tools { width:100%; gap:0; } .pg-discussion-composer__tools button { padding:8px 10px; font-size:11px; } .pg-discussion-composer__tools .pg-discussion-question { margin-left:auto; padding-left:10px; border:0; } .pg-discussion-toolbar { gap:4px; margin:0; padding-top:2px; } .pg-discussion-toolbar nav { gap:0; } .pg-discussion-toolbar nav a { padding:8px; font-size:11px; } .pg-discussion-filter summary { padding:8px; font-size:11px; } .pg-discussion-filter form { min-width:0; width:min(270px,calc(100vw - 56px)); } .pg-discussion-feed { gap:0; } .pg-discussion-post { padding:20px 0; border:0; border-bottom:7px solid color-mix(in srgb,var(--pg-border) 45%,var(--pg-bg)); border-radius:0; background:transparent; box-shadow:none; } .pg-discussion-post__head { margin-bottom:12px; } .pg-discussion-person strong { font-size:14px; } .pg-discussion-text { font-size:15px; } .pg-discussion-action-label { display:inline; } .pg-discussion-actions [data-pg-card-action="share"] .pg-discussion-action-label { display:none; } .pg-discussion-actions :is(button,a) { gap:7px; padding:7px 9px; } .pg-discussion-empty { border:0; padding:36px 10px; } .pg-social-dialog--post { width:100vw; height:100dvh; margin:0; max-width:100vw; max-height:100dvh; border:0; border-radius:0; } .pg-social-dialog__layout { display:flex; flex-direction:column; overflow:auto; overscroll-behavior:contain; } .pg-social-dialog__main { overflow:visible; padding:64px 16px 20px; flex:none; } .pg-social-dialog__aside { overflow:visible; border-left:0; border-top:1px solid var(--pg-border); padding:20px 18px calc(24px + env(safe-area-inset-bottom)); flex:none; } .pg-social-dialog__close { position:fixed; top:calc(10px + env(safe-area-inset-top)); right:12px; width:38px; height:38px; box-shadow:0 2px 12px #001d3515; } .pg-social-dialog--compose { width:100vw; max-width:100vw; height:100dvh; max-height:100dvh; margin:0; border:0; border-radius:0; padding:calc(64px + env(safe-area-inset-top)) 18px calc(24px + env(safe-area-inset-bottom)); } .pg-social-dialog--author { border-radius:18px; padding:60px 20px 24px; } .pg-social-dialog--author .pg-social-dialog__close { position:absolute; } .pg-discussion-author__details>summary { display:block; color:var(--pg-link); font-size:13px; padding:14px 0 4px; cursor:pointer; } .pg-social-dialog--author .pg-discussion-author__details>summary { display:none; } .pg-social-compose__heading h2 { font-size:22px; } .pg-discussion-comment-tools small { max-width:140px; } .pg-discussion-comment-tools .pg-btn { min-height:40px; padding:8px 12px; } .pg-discussion-comment__children { margin-left:18px; padding-left:10px; } .pg-discussion-compose-tools>span { font-size:11px; } .pg-discussion-compose-tools button { padding-inline:7px; } .pg-discussion-article h2 { font-size:24px; } .pg-discussion-rail { display:none; } } @media(prefers-reduced-motion:reduce) { .pg-social-dialog * { scroll-behavior:auto!important; } } /* Author preview uses the site's shared palette and one scrolling dialog. */ #pg-social-author { width:min(1120px,calc(100% - 48px)); max-width:none; max-height:calc(100dvh - 48px); padding:0; overflow:auto; overscroll-behavior:contain; scrollbar-width:thin; background:var(--pg-bg); font-family:var(--pg-interface-font); } #pg-social-author [data-author-status] { margin:16px clamp(16px,3vw,28px); color:var(--pg-muted); font-size:13px; } #pg-social-author [data-author-status]:empty { display:none; } .pg-author-preview-bar { position:sticky; top:0; z-index:2; display:flex; align-items:center; justify-content:space-between; gap:12px; min-height:64px; padding:8px clamp(16px,3vw,28px); border-bottom:1px solid var(--pg-border); background:var(--pg-block-bg); } #pg-social-author .pg-author-preview-bar h2 { margin:0; color:var(--pg-text); font:700 15px/1.4 var(--pg-interface-font); } #pg-social-author .pg-author-preview-bar .pg-social-dialog__close { position:static; flex:none; width:44px; height:44px; border:1px solid var(--pg-border); background:var(--pg-bg-soft); } #pg-social-author .pg-author-preview-bar .pg-social-dialog__close:hover { color:var(--pg-link-hover); background:var(--pg-info-bg,var(--pg-bg-soft)); } .pg-author-preview { display:grid; grid-template-columns:minmax(255px,0.9fr) minmax(0,2fr); align-items:start; gap:clamp(16px,2.5vw,30px); padding:clamp(16px,2.5vw,28px); color:var(--pg-text); } .pg-author-preview__profile { min-width:0; overflow:hidden; border:1px solid var(--pg-border); border-radius:16px; background:var(--pg-block-bg); box-shadow:var(--pg-shadow-soft); } .pg-author-preview__cover { height:92px; background: radial-gradient(ellipse at 94% 0%,color-mix(in srgb,var(--pg-secondary) 33%,transparent),transparent 64%), repeating-radial-gradient(ellipse at 95% 40%,transparent 0 18px,color-mix(in srgb,var(--pg-secondary) 18%,transparent) 19px 20px,transparent 21px 30px), linear-gradient(125deg,var(--pg-brand-ink),var(--pg-palette-blue-deep)); } .pg-author-preview__profile-body { position:relative; padding:0 18px 20px; } .pg-author-preview .pg-discussion-author__identity { display:grid; align-items:start; justify-items:start; gap:9px; width:fit-content; max-width:100%; margin-top:-34px; } .pg-author-preview .pg-discussion-author__identity img { box-sizing:border-box; width:76px; height:76px; border:4px solid var(--pg-block-bg); background:var(--pg-bg-soft); box-shadow:0 2px 10px color-mix(in srgb,var(--pg-brand-ink) 18%,transparent); } .pg-author-preview__identity-copy { min-width:0; overflow-wrap:anywhere; } #pg-social-author .pg-author-preview__identity-copy h3 { margin:0; color:var(--pg-text); font:750 clamp(21px,2vw,27px)/1.25 var(--pg-interface-font); } .pg-author-preview__identity-copy p { margin:4px 0 0; color:var(--pg-muted); font:500 12px/1.6 var(--pg-interface-font); } .pg-author-preview__actions { display:grid; gap:8px; margin-top:17px; } #pg-social-author .pg-author-preview__actions .pg-discussion-author__profile { margin:0; justify-content:center; gap:9px; border-color:transparent; background:var(--pg-action-gradient); color:var(--pg-action-text); } #pg-social-author .pg-author-preview__actions .pg-discussion-author__profile:hover { background:var(--pg-action-gradient-hover); color:var(--pg-action-hover-text); } #pg-social-author .pg-author-preview__actions .pg-discussion-follow { min-height:44px; padding:9px 12px; border:1px solid var(--pg-border-strong); border-radius:10px; color:var(--pg-link); background:var(--pg-block-bg); box-shadow:none; clip-path:none; font:650 12px/1.45 var(--pg-interface-font); } #pg-social-author .pg-author-preview__actions .pg-discussion-follow:is(:hover,[aria-pressed="true"]) { border-color:var(--pg-link); background:var(--pg-info-bg,var(--pg-bg-soft)); color:var(--pg-link-hover); } .pg-author-preview .pg-discussion-author__stats { gap:6px; margin:16px 0; padding:0; border:0; } .pg-author-preview .pg-discussion-author__stats > div { display:flex; flex-direction:column-reverse; justify-content:flex-end; align-items:center; gap:3px; min-width:0; padding:9px 3px; border-radius:9px; background:var(--pg-bg-soft); } .pg-author-preview .pg-discussion-author__stats dt { color:var(--pg-muted); font:500 10px/1.4 var(--pg-interface-font); overflow-wrap:anywhere; } .pg-author-preview .pg-discussion-author__stats dd { margin:0; color:var(--pg-text); font:750 19px/1.2 var(--pg-interface-font); font-variant-numeric:tabular-nums; } .pg-author-preview__biography { padding-top:15px; border-top:1px solid var(--pg-border); } #pg-social-author .pg-author-preview__biography h4 { margin:0 0 7px; color:var(--pg-text); font:700 13px/1.5 var(--pg-interface-font); } .pg-author-preview__bio { font:400 13px/1.75 var(--pg-interface-font); color:var(--pg-muted); overflow-wrap:anywhere; } .pg-author-preview__bio p { font:inherit; margin:0 0 9px; } .pg-author-preview__bio > :last-child { margin-bottom:0; } .pg-author-preview__bio :is(img,video,iframe,table,pre) { max-width:100%; } .pg-author-preview__bio :is(img,video) { height:auto; } .pg-author-preview__bio pre { overflow:auto; } .pg-author-preview__articles { min-width:0; } .pg-author-preview__heading { display:flex; align-items:center; justify-content:space-between; gap:8px 14px; margin:0 0 14px; } #pg-social-author .pg-author-preview__heading h3 { display:flex; align-items:center; gap:8px; margin:0; color:var(--pg-text); font:750 clamp(16px,1.6vw,20px)/1.35 var(--pg-interface-font); } .pg-author-preview__heading h3 svg { color:var(--pg-link); flex:none; } .pg-author-preview__heading > span { flex:none; padding:5px 9px; border:1px solid var(--pg-border); border-radius:999px; background:var(--pg-block-bg); color:var(--pg-muted); font:500 11px/1.4 var(--pg-interface-font); } .pg-author-preview__grid { list-style:none; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:14px; margin:0; padding:0; } .pg-author-preview__grid > li { min-width:0; } .pg-author-preview__card { display:flex; flex-direction:column; height:100%; overflow:hidden; border:1px solid var(--pg-border); border-radius:14px; background:var(--pg-block-bg); color:var(--pg-text); text-decoration:none; transition:border-color .18s ease,box-shadow .18s ease; } .pg-author-preview__card:is(:hover,:focus-visible) { border-color:var(--pg-link); box-shadow:var(--pg-shadow-soft); } .pg-author-preview__media { width:100%; aspect-ratio:16/9; background:var(--pg-bg-soft); overflow:hidden; } .pg-author-preview__media picture { display:block; width:100%; height:100%; } .pg-author-preview__media img { display:block; width:100%; height:100%; object-fit:cover; } .pg-author-preview__copy { display:flex; flex:1; flex-direction:column; min-width:0; gap:7px; padding:14px; } .pg-author-preview__copy time { color:var(--pg-muted); font-size:11px; font-variant-numeric:tabular-nums; } #pg-social-author .pg-author-preview__copy h4 { display:-webkit-box; overflow:hidden; margin:0; color:var(--pg-text); font:700 14px/1.45 var(--pg-interface-font); overflow-wrap:anywhere; -webkit-line-clamp:2; -webkit-box-orient:vertical; } .pg-author-preview__excerpt { display:-webkit-box; overflow:hidden; margin:0 0 5px; color:var(--pg-muted); font:400 12px/1.6 var(--pg-interface-font); overflow-wrap:anywhere; -webkit-line-clamp:2; -webkit-box-orient:vertical; } .pg-author-preview__read { display:flex; align-items:center; justify-content:space-between; gap:8px; margin-top:auto; padding:7px 9px; border-radius:8px; background:var(--pg-bg-soft); color:var(--pg-link); font:650 11px/1.5 var(--pg-interface-font); } .pg-author-preview__card:is(:hover,:focus-visible) .pg-author-preview__read { color:var(--pg-link-hover); background:var(--pg-info-bg,var(--pg-bg-soft)); } .pg-author-preview__read svg { width:15px; height:15px; flex:none; } .pg-author-preview__empty { margin:0; padding:20px; border:1px solid var(--pg-border); border-radius:14px; background:var(--pg-block-bg); color:var(--pg-muted); font-size:13px; } @media(max-width:859px) { .pg-author-preview { grid-template-columns:minmax(0,1fr); } .pg-author-preview__profile-body { padding-inline:16px; } .pg-author-preview__actions { grid-template-columns:minmax(0,1fr); } .pg-author-preview__actions:has(.pg-discussion-follow) { grid-template-columns:minmax(0,1.4fr) minmax(0,1fr); } } @media(max-width:559px) { #pg-social-author { width:calc(100% - 20px); max-height:calc(100dvh - 24px - env(safe-area-inset-top) - env(safe-area-inset-bottom)); border-radius:16px; } .pg-author-preview-bar { min-height:56px; padding:6px 12px; } .pg-author-preview { gap:18px; padding:12px; } .pg-author-preview__cover { height:68px; } .pg-author-preview__profile-body { padding-inline:12px; padding-bottom:15px; } .pg-author-preview .pg-discussion-author__identity { margin-top:-28px; gap:7px; } .pg-author-preview .pg-discussion-author__identity img { width:64px; height:64px; } .pg-author-preview__grid { grid-template-columns:minmax(0,1fr); gap:10px; } .pg-author-preview__card { display:grid; grid-template-columns:minmax(80px,31%) minmax(0,1fr); } .pg-author-preview__media { height:100%; min-height:110px; aspect-ratio:auto; } .pg-author-preview__copy { padding:10px; gap:5px; } .pg-author-preview__excerpt { -webkit-line-clamp:1; } } @media(max-width:359px) { .pg-author-preview__actions:has(.pg-discussion-follow) { grid-template-columns:minmax(0,1fr); } } @media(prefers-reduced-motion:reduce) { .pg-author-preview__card { transition:none; } } /* Mobile post previews stay below the site header and scroll inside one compact frame. */ @media(max-width:767px){ html:has(#pg-social-post[open]) body.wp-theme-psyguild-theme .pg-site-header{transform:none!important;visibility:visible!important;transition:none!important} #pg-social-post{--pg-post-modal-top:calc(max(var(--pg-header-visible-bottom,0px),calc(var(--pg-header-layout-height,56px) + var(--wp-admin--admin-bar--height,0px)),calc(56px + env(safe-area-inset-top))) + 8px);position:fixed;inset:var(--pg-post-modal-top) 10px auto 10px;width:calc(100% - 20px);max-width:none;height:min(78dvh,calc(100dvh - var(--pg-post-modal-top) - 12px - env(safe-area-inset-bottom)));max-height:none;margin:0;padding:0;border:1px solid var(--pg-border);border-radius:20px;overflow:hidden} #pg-social-post>#pg-social-post-title{position:absolute!important;inset:0 0 auto 0!important;display:flex;align-items:center;width:auto!important;height:48px!important;margin:0!important;padding:0 62px 0 16px!important;clip:auto!important;clip-path:none!important;overflow:hidden!important;white-space:nowrap!important;font:600 12px/1.4 var(--pg-interface-font)!important;color:var(--pg-muted);border-bottom:1px solid var(--pg-border)} #pg-social-post>.pg-social-dialog__close{position:absolute;top:4px;right:8px;width:40px;height:40px;box-shadow:none} #pg-social-post>.pg-social-dialog__layout{height:calc(100% - 48px);margin-top:48px;overflow:auto;min-height:0;scrollbar-width:thin;overscroll-behavior:contain} #pg-social-post .pg-social-dialog__main{padding:18px 16px 20px;overflow:visible} #pg-social-post .pg-social-dialog__aside{padding:18px 16px 22px} } /* Keep all quick actions visible on the narrowest phone widths. */ @media(max-width:360px){ .pg-discussion-composer__tools button{padding-inline:7px;gap:5px;font-size:10px} .pg-discussion-composer__tools .pg-discussion-question{padding-left:7px} .pg-discussion-filter summary{width:44px;padding-inline:0} .pg-discussion-filter summary>span{display:none} } /* PsyGuild source: discussion-groups.css */ .pg-discussion-groups{padding:16px 18px;margin-bottom:16px;background:var(--pg-block-bg,#fff);border:1px solid var(--pg-border,#dce3e8);border-radius:16px;color:var(--pg-text,#142533)} .pg-groups-heading{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:12px}.pg-groups-heading h2{font-size:17px;margin:0}.pg-groups-heading button{border:0;background:transparent;color:var(--pg-muted,#60717d);font:inherit;font-size:12px;padding:6px 0;cursor:pointer}.pg-groups-heading button[aria-pressed=true]{color:#008da4;font-weight:700} .pg-groups-list{display:flex;flex-wrap:wrap;gap:8px}.pg-group-card{display:grid;grid-template-columns:32px 1fr;gap:2px 9px;align-items:center;flex:1 1 160px;padding:10px;border:1px solid var(--pg-border,#e1e7eb);border-radius:12px;min-width:0;color:inherit;text-decoration:none;background:transparent;transition:background .15s,border-color .15s}.pg-group-card:hover{background:var(--pg-brand-tint);border-color:color-mix(in srgb,var(--pg-secondary) 52%,var(--pg-border))}.pg-group-card strong{font-size:12px;line-height:1.5;overflow-wrap:anywhere}.pg-group-card small{grid-column:2;font-size:11px;color:var(--pg-muted,#60717d)}.pg-group-mark{display:grid;place-items:center;width:34px;height:34px;border-radius:10px;background:#e2f5f5;color:#008d9e;font-size:17px;font-weight:700;grid-row:span 2}.pg-group-card:nth-child(3n+2) .pg-group-mark{background:#f0ebfb;color:#8160b6}.pg-group-card:nth-child(3n) .pg-group-mark{background:#fff0e3;color:#ab6a35} [data-groups-status]:empty,[data-group-status]:empty{display:none}.pg-discussion-groups [data-groups-status]{font-size:12px;margin:10px 0 0} .pg-group-dialog{width:min(860px,calc(100vw - 32px));max-height:88dvh;padding:0;overflow:auto;color:var(--pg-text,#142533);background:var(--pg-block-bg,#fff)}.pg-group-dialog .pg-social-dialog__close{position:absolute;top:12px;right:12px;font-size:24px;z-index:2}.pg-group-header{padding:28px 26px 20px;display:flex;gap:14px;align-items:center;flex-wrap:wrap}.pg-group-header>.pg-group-mark{width:56px;height:56px;font-size:28px;border-radius:16px}.pg-group-heading{flex:1;min-width:180px;padding-right:24px}.pg-group-heading h2{font-size:24px;margin:0 0 6px;line-height:1.3}.pg-group-heading p{font-size:13px;color:var(--pg-muted,#60717d);margin:0}.pg-group-actions{display:flex;gap:8px;flex-wrap:wrap}.pg-group-join,.pg-group-share{font:inherit;font-size:13px;font-weight:600;border:0;border-radius:9px;padding:11px 15px;min-height:42px;cursor:pointer;background:#edf1f4;color:inherit}.pg-group-join{background:var(--pg-highlight-gradient);color:var(--pg-highlight-text)}.pg-group-join:not([aria-pressed=true]):not(:disabled):hover{background:var(--pg-highlight-gradient-hover)}.pg-group-join[aria-pressed=true]{background:#e2f4ee;color:#277154}.pg-group-join:disabled{opacity:.55;cursor:wait}.pg-group-tabs{display:flex;gap:22px;padding:0 26px;border-top:1px solid var(--pg-border,#e1e7eb);border-bottom:1px solid var(--pg-border,#e1e7eb)}.pg-group-tabs button{background:none;border:0;border-bottom:3px solid transparent;padding:15px 4px 12px;font:inherit;font-size:14px;font-weight:600;color:var(--pg-muted,#60717d);cursor:pointer}.pg-group-tabs button:hover,.pg-group-tabs button[aria-pressed=true]{color:var(--pg-interactive-accent)}.pg-group-tabs button[aria-pressed=true]{border-bottom-color:var(--pg-interactive-accent)}.pg-group-body{padding:20px 26px;background:var(--pg-bg,#f5f8fa);min-height:220px}.pg-group-write{display:flex;align-items:center;justify-content:space-between;gap:12px;width:100%;background:var(--pg-block-bg,#fff);border:1px solid var(--pg-border,#dce3e8);border-radius:12px;padding:16px;margin-bottom:16px;color:var(--pg-muted,#60717d);font:inherit;font-size:14px;text-align:left;cursor:pointer}.pg-group-write span{color:var(--pg-interactive-accent);white-space:nowrap;font-weight:600}.pg-group-body [data-group-status]{font-size:13px;line-height:1.6;color:var(--pg-muted,#60717d)}.pg-group-body [data-group-about]{font-size:14px;line-height:1.8}.pg-group-body [data-group-about] h3{margin-top:0}.pg-group-current{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:8px 0;font-size:12px;color:var(--pg-muted,#60717d)}.pg-group-context{border:0;padding:0;background:none;color:var(--pg-interactive-accent);font:inherit;font-weight:600;cursor:pointer}.pg-group-current small{font-size:11px}.pg-group-dialog :focus-visible,.pg-discussion-groups :focus-visible{outline:2px solid var(--pg-interactive-accent);outline-offset:3px} @media(max-width:600px){.pg-discussion-groups{padding:14px}.pg-group-card{flex-basis:135px;padding:8px;grid-template-columns:28px 1fr;gap:2px 7px}.pg-group-card .pg-group-mark{width:28px;height:30px;font-size:15px}.pg-group-dialog{width:calc(100vw - 16px);max-height:92dvh;border-radius:18px}.pg-group-header{padding:24px 18px 16px;gap:10px}.pg-group-heading h2{font-size:20px}.pg-group-heading p{font-size:12px}.pg-group-header>.pg-group-mark{width:44px;height:44px;font-size:23px}.pg-group-actions{width:100%;padding-top:4px}.pg-group-tabs{padding:0 18px}.pg-group-body{padding:16px 12px}.pg-group-write{font-size:12px;padding:14px 12px}.pg-group-heading{min-width:150px}} .pg-group-empty{font-size:13px;line-height:1.7;color:var(--pg-muted,#60717d)} /* PsyGuild source: article-export.css */ .pg-article-pdf{display:inline-flex;align-items:center;justify-content:center;gap:7px;min-height:44px;padding:10px 14px;border:1px solid var(--pg-border);border-radius:10px;background:var(--pg-block-bg);color:var(--pg-text);font:500 12px/1.5 var(--pg-interface-font);cursor:pointer} .pg-article-pdf:focus-visible{outline:2px solid var(--pg-link);outline-offset:3px}.pg-article-pdf:disabled{opacity:.6;cursor:wait}.pg-article-pdf svg{flex:none} .pg-pdf-status{position:fixed;left:50%;bottom:calc(84px + env(safe-area-inset-bottom));transform:translateX(-50%);z-index:100005;box-sizing:border-box;width:max-content;max-width:calc(100vw - 32px);padding:13px 18px;background:var(--pg-block-bg);color:var(--pg-text);border:1px solid var(--pg-border);border-radius:12px;box-shadow:var(--pg-shadow-soft);font:500 12px/1.7 var(--pg-interface-font)} .pg-pdf-status:empty{display:none} .pg-pdf-download{display:inline-flex;align-items:center;min-height:32px;margin-left:8px;color:var(--pg-link);font-weight:600;text-underline-offset:3px} .pg-featured-post-actions{display:flex;align-items:stretch;flex-wrap:wrap;gap:8px}.pg-featured-post-actions>.pg-featured-read{flex:1;min-width:140px} html body .pg-card-actions:has(>[data-pg-export-pdf]){gap:8px;flex-wrap:wrap} html body .pg-card-actions>[data-pg-export-pdf]{color:var(--pg-link)} @media(max-width:767px){html body .pg-card-actions:has(>[data-pg-export-pdf]){column-gap:2px;row-gap:0}html body .pg-card-actions:has(>[data-pg-export-pdf]) .pg-card-share-label{display:none}html body .pg-card-actions>[data-pg-export-pdf]{min-width:44px;gap:3px}.pg-card-actions>[data-pg-export-pdf] span{font-size:10px}}