/* site-glass — shared refinement for FRADOMA, CCS and Account.
   Presentation only: no form, navigation, authentication or visibility changes. */
:root {
  --glass-ink: #172335;
  --glass-muted: #526278;
  --glass-accent: #174fc6;
  --glass-stroke: rgba(112, 137, 173, .22);
  --glass-fill: rgba(255, 255, 255, .7);
  --glass-elevation: 0 12px 36px -22px rgba(31, 53, 87, .22), inset 0 1px 0 rgba(255, 255, 255, .96);
  --glass-radius: 22px;
  --glass-ease: cubic-bezier(.2, .7, .25, 1);
}
html { background: #f5f8fc; }
html body.site-glass {
  color: var(--glass-ink);
  background: radial-gradient(ellipse 80% 600px at 8% 0, rgba(208, 225, 249, .5), transparent 72%),
    radial-gradient(ellipse 60% 600px at 96% 20%, rgba(225, 230, 245, .38), transparent 75%), #f7f9fc !important;
  -webkit-font-smoothing: antialiased;
  text-rendering: optimizeLegibility;
}
html body.site-glass > header,
html body.site-glass.fradoma-ccs-design > header {
  background: rgba(255, 255, 255, .78) !important;
  border-bottom: 1px solid var(--glass-stroke) !important;
  box-shadow: 0 4px 24px -16px rgba(31, 53, 87, .18), inset 0 -1px 0 rgba(255, 255, 255, .65) !important;
  -webkit-backdrop-filter: blur(22px) saturate(145%) !important;
  backdrop-filter: blur(22px) saturate(145%) !important;
}
html body.site-glass > header.is-scrolled { background: rgba(255, 255, 255, .88) !important; }
html body.site-glass > header :is(.links, .main-nav) a {
  color: #35465d;
  text-underline-offset: 6px;
  transition: color .16s ease;
}
html body.site-glass > header :is(.links, .main-nav) a:hover,
html body.site-glass > header :is(.links, .main-nav) a[aria-current=page] { color: var(--glass-accent); }
html body.site-glass main :is(.card, .article-card, .portal-card, .portal-empty, .notice, .empty, .band, .org, .pillars, .principles, .feat > div),
html body.site-glass.fradoma-ccs-design main :is(.card, .band),
html body.site-glass .home-directory {
  background: linear-gradient(145deg, rgba(255, 255, 255, .84), rgba(255, 255, 255, .58)) !important;
  border: 1px solid var(--glass-stroke) !important;
  border-radius: var(--glass-radius) !important;
  box-shadow: var(--glass-elevation) !important;
}
/* A single blurred shell is preferable to a blur layer on every card. */
html body.site-glass main :is(.card, .article-card, .portal-card, .band, .pillars, .principles) {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}
html body.site-glass main a:is(.card, .article-card, .portal-card):hover {
  background: rgba(255, 255, 255, .94) !important;
  border-color: rgba(97, 128, 171, .4) !important;
  box-shadow: 0 16px 36px -24px rgba(31, 53, 87, .32), inset 0 1px 0 #fff !important;
  transform: none !important;
}
html body.site-glass :is(.btn, .button, .settings-button) {
  min-height: 44px;
  border-radius: 12px !important;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .85) !important;
  transition: background-color .18s ease, border-color .18s ease, box-shadow .18s ease !important;
}
html body.site-glass :is(.text-link, .card-link) { text-underline-offset: 5px; }
html body.site-glass :is(.text-link, .card-link):hover { text-decoration: underline; }
html body.site-glass :is(a, button, input, textarea, select):focus-visible {
  outline: 2px solid #174fc6 !important;
  outline-offset: 4px;
}
html body.site-glass :is(.languages, .locale-trigger, .portal-search-field) {
  border-color: var(--glass-stroke) !important;
  border-radius: 12px !important;
  background: rgba(255, 255, 255, .76) !important;
}
html body.site-glass .portal-search-field:focus-within { box-shadow: 0 0 0 4px rgba(23, 79, 198, .08); }
html body.site-glass :is(.prose, .intro, .portal-intro, .article-body p) { color: var(--glass-muted); }
html body.site-glass .article-body p { line-height: 1.8; }
html body.site-glass .home-directory { padding: 26px; }
html body.site-glass .home-directory a { border-color: var(--glass-stroke); padding-block: 20px; }
html body.site-glass .home-directory strong { font-size: 20px; }
html body.site-glass .home-directory p { font-size: 14px; line-height: 1.6; color: var(--glass-muted); }
html body.home-expanded.site-glass main .wrap { max-width: 1480px; }
html body.home-expanded.site-glass.fradoma-ccs-design .future-hero > .wrap,
html body.home-expanded.site-glass .hero > .wrap { max-width: 1480px !important; gap: 42px; }
html body.home-expanded.site-glass.fradoma-ccs-design .fradoma-carousel,
html body.home-expanded.site-glass .ccs-carousel { min-height: 550px; }
html body.site-glass .professional-carousel :is(.carousel-arrows, .fradoma-carousel__arrows) {
  background: rgba(255, 255, 255, .84);
  border-color: var(--glass-stroke);
  box-shadow: var(--glass-elevation);
}
html body.site-glass > footer,
html body.site-glass.fradoma-ccs-design > footer {
  background: rgba(255, 255, 255, .7) !important;
  border-top: 1px solid var(--glass-stroke) !important;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
html body.site-glass footer :is(.footer-grid, .fgrid) { gap: 32px; }
html body.site-glass footer a { text-underline-offset: 5px; }
/* Account: the same glass material, without adding a public navigation header. */
html body.site-glass .account-stage { padding: 64px 24px 30px; }
html body.site-glass .account-panel {
  max-width: 480px;
  padding: 44px 42px 38px;
  border: 1px solid rgba(255, 255, 255, .9);
  border-radius: 28px;
  background: linear-gradient(145deg, rgba(255, 255, 255, .76), rgba(255, 255, 255, .52));
  box-shadow: 0 30px 80px -38px rgba(33, 65, 107, .28), 0 2px 8px rgba(33, 65, 107, .025), inset 0 1px 0 #fff;
  -webkit-backdrop-filter: blur(24px) saturate(135%);
  backdrop-filter: blur(24px) saturate(135%);
  animation: glass-account-in .32s var(--glass-ease) both;
}
html body.site-glass .account-brand { width: 184px; margin-bottom: 32px; }
html body.site-glass .account-field { gap: 10px; color: #34465f; }
html body.site-glass :is(.account-field input, .settings-form input, .settings-form select, .settings-form textarea) {
  min-height: 48px;
  border: 1px solid rgba(104, 131, 166, .32);
  border-radius: 12px;
  background: rgba(255, 255, 255, .84);
  color: var(--glass-ink);
  box-shadow: inset 0 1px 2px rgba(31, 53, 87, .025);
  transition: background-color .16s ease, border-color .16s ease, box-shadow .16s ease;
}
html body.site-glass :is(.account-field input, .settings-form input, .settings-form select, .settings-form textarea):focus {
  background: #fff;
  border-color: #4778cc;
  box-shadow: 0 0 0 4px rgba(23, 79, 198, .08);
}
html body.site-glass .account-primary {
  min-height: 48px;
  border-radius: 12px;
  border-color: #17448f;
  background: linear-gradient(180deg, #245ca9, #174789);
  color: #fff;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .2), 0 4px 10px -5px rgba(23, 71, 137, .35);
  transition: background .18s ease, box-shadow .18s ease;
}
html body.site-glass .account-primary:hover:not(:disabled) { background: #163e78; box-shadow: 0 5px 14px -6px rgba(23, 71, 137, .48); }
html body.site-glass :is(.account-primary, .settings-button):disabled { cursor: wait; opacity: .55; }
html body.site-glass .account-utilities { max-width: 480px; gap: 18px; }
html body.site-glass .account-languages { padding: 4px; border: 1px solid var(--glass-stroke); border-radius: 14px; background: rgba(255, 255, 255, .5); }
html body.site-glass .account-languages button { border-radius: 10px; min-height: 36px; }
html body.site-glass .account-languages button[aria-pressed=true] { background: rgba(255, 255, 255, .96); box-shadow: 0 2px 6px rgba(31, 53, 87, .06); }
html body.site-glass.account-dashboard .account-stage { padding-top: 48px; }
html body.site-glass.account-dashboard .account-panel { max-width: 1120px; padding: 36px; }
html body.site-glass.account-dashboard .account-brand { width: 166px; margin-bottom: 28px; }
html body.site-glass.account-dashboard .account-utilities { max-width: 1120px; }
html body.site-glass #account-settings { column-gap: 28px; border-color: var(--glass-stroke); }
html body.site-glass .settings-tabs { padding: 8px; border: 1px solid rgba(255, 255, 255, .85); border-radius: 18px; background: rgba(255, 255, 255, .44); }
html body.site-glass .settings-tabs a[data-account-tab] { min-height: 46px; border-radius: 11px; color: #435771; }
html body.site-glass .settings-tabs a[aria-current=page] { background: rgba(232, 240, 255, .95); border-color: rgba(73, 120, 196, .2); color: #16499e; box-shadow: inset 0 1px 0 rgba(255, 255, 255, .9); }
html body.site-glass .settings-tabs a:hover { background: rgba(255, 255, 255, .82); }
html body.site-glass :is(.settings-section, .settings-section:first-child, .settings-section:last-child) {
  padding: 26px;
  border: 1px solid rgba(134, 155, 183, .2);
  border-radius: 20px;
  background: rgba(255, 255, 255, .58);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .95);
}
html body.site-glass .settings-section h2 { font-size: 20px !important; }
html body.site-glass .settings-details { column-gap: 28px; }
html body.site-glass .settings-details div { border-color: var(--glass-stroke); }
html body.site-glass .settings-details dt { color: var(--glass-muted); }
html body.site-glass .settings-button { border-color: var(--glass-stroke); background: rgba(255, 255, 255, .84); }
html body.site-glass .settings-button.danger { color: #9e2828; border-color: #e0bcbc; }
html body.site-glass .settings-button.danger:hover { background: #fff4f4; }
html body.site-glass .settings-mfa { border-color: var(--glass-stroke); border-radius: 15px; background: rgba(255, 255, 255, .68); }
html body.site-glass .settings-mfa img { background: #fff; }
html body.site-glass .settings-actions { border-color: var(--glass-stroke); }
html body.site-glass .settings-actions .account-primary { color: #34465f; background: rgba(255, 255, 255, .84); border-color: var(--glass-stroke); box-shadow: none; }
html body.site-glass .settings-actions .account-primary:hover { background: #fff; }
html body.site-glass .b2b-domain-input { border-radius: 12px; background: rgba(237, 243, 250, .8); }
html[data-density=compact] body.site-glass .settings-section { padding: 18px 20px; margin-bottom: 14px; }
@keyframes glass-account-in { from { opacity: .85; transform: translateY(6px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width:1100px) {
  html body.home-expanded.site-glass.fradoma-ccs-design .future-hero > .wrap,
  html body.home-expanded.site-glass .hero > .wrap { gap: 16px; }
}
@media (max-width:800px) {
  html body.site-glass.account-dashboard .account-stage { padding: 24px 16px; }
  html body.site-glass.account-dashboard .account-panel { padding: 26px; }
  html body.site-glass .settings-tabs { padding: 6px; }
  html body.site-glass .settings-section { padding: 22px; }
}
@media (max-width:620px) {
  :root { --glass-radius: 18px; }
  html body.site-glass .home-directory { padding: 20px; }
  html body.site-glass .home-directory a { padding-block: 16px; }
  html body.home-expanded.site-glass.fradoma-ccs-design .fradoma-carousel,
  html body.home-expanded.site-glass .ccs-carousel { min-height: 490px; }
  html body.site-glass .account-stage { padding: 32px 18px 24px; }
  html body.site-glass .account-panel { padding: 32px 26px; border-radius: 24px; -webkit-backdrop-filter: blur(16px); backdrop-filter: blur(16px); }
  html body.site-glass.account-dashboard .account-panel { padding: 26px 18px; }
  html body.site-glass .settings-section,
  html body.site-glass .settings-section:first-child,
  html body.site-glass .settings-section:last-child { padding: 20px 16px; border-radius: 16px; }
}
@supports not ((backdrop-filter:blur(1px)) or (-webkit-backdrop-filter:blur(1px))) {
  html body.site-glass .account-panel { background: #f9fbfe; }
}
@media (prefers-reduced-transparency:reduce) {
  html body.site-glass { background: #f7f9fc !important; }
  html body.site-glass .account-panel,
  html body.site-glass > header,
  html body.site-glass.fradoma-ccs-design > header { background: #fff !important; -webkit-backdrop-filter: none !important; backdrop-filter: none !important; }
  html body.site-glass :is(.settings-section, .settings-tabs, .home-directory, .card, .article-card, .portal-card) { background: #fff !important; }
}
@media (prefers-reduced-motion:reduce) {
  html body.site-glass *, html body.site-glass *::before, html body.site-glass *::after { animation: none !important; transition: none !important; scroll-behavior: auto !important; }
}
html[data-motion=reduced] body.site-glass *,
html[data-motion=reduced] body.site-glass *::before,
html[data-motion=reduced] body.site-glass *::after { animation: none !important; transition: none !important; }
@media (forced-colors:active) {
  html body.site-glass :is(.account-panel, .settings-section, .settings-tabs, .card, .portal-card) { border: 1px solid CanvasText !important; box-shadow: none !important; }
}
/* Unified FRADOMA network header; brand artwork remains service-specific. */
html body.site-glass>header{min-height:112px!important;background:rgba(255,255,255,.96)!important;border-bottom:1px solid #dce3ec!important;box-shadow:none!important;backdrop-filter:blur(18px)!important;-webkit-backdrop-filter:blur(18px)!important}
html body.site-glass>header>.wrap,html body.site-glass>header .header-inner{width:min(100% - 48px,1760px)!important;max-width:none!important;min-height:112px!important;margin:auto!important;padding:0!important;display:flex!important;align-items:center!important}
html body.site-glass>header nav{width:100%!important;min-height:112px!important;display:flex!important;align-items:center!important;gap:28px!important}
html body.site-glass>header .links,html body.site-glass>header .main-nav{display:flex!important;align-items:center!important;gap:28px!important;margin:0!important}
html body.site-glass>header a{font-size:13px!important;color:#29364b!important;text-decoration:none!important;white-space:nowrap}
html body.site-glass>header .logo,html body.site-glass>header .wordmark{margin-left:auto!important;order:20!important}
html body.site-glass>header .logo img,html body.site-glass>header .wordmark img{display:block!important;width:auto!important;max-width:190px!important;height:66px!important;object-fit:contain!important;filter:none!important}
html body.site-glass>header .account-link,html body.site-glass>header .btn.hd,html body.site-glass>header .header-cta{min-height:44px!important;padding:0 18px!important;border:1px solid #d6deea!important;border-radius:11px!important;background:#fff!important;color:#1d2a3e!important;box-shadow:none!important}
@media(max-width:900px){html body.site-glass>header{min-height:86px!important}html body.site-glass>header>.wrap,html body.site-glass>header .header-inner,html body.site-glass>header nav{min-height:86px!important;width:min(100% - 28px,1760px)!important}html body.site-glass>header .links a:nth-child(n+4),html body.site-glass>header .main-nav a:nth-child(n+4),html body.site-glass>header .btn.hd,html body.site-glass>header .header-cta{display:none!important}html body.site-glass>header .logo img,html body.site-glass>header .wordmark img{max-width:150px!important;height:54px!important}}
@media(max-width:620px){html body.site-glass>header .links,html body.site-glass>header .main-nav{gap:15px!important;overflow-x:auto!important}html body.site-glass>header .account-link{display:none!important}html body.site-glass>header .logo img,html body.site-glass>header .wordmark img{max-width:112px!important;height:44px!important}}

/* Mobile-first motion fixes. */
@media(max-width:700px){html{scroll-behavior:smooth}body.site-glass main :is(.card,.article-card,.portal-card,.game-card){transition:transform .22s ease,box-shadow .22s ease,background-color .22s ease!important;will-change:auto}body.site-glass main :is(.card,.article-card,.portal-card,.game-card):active{transform:scale(.985)!important}.carousel-track,.game-track{touch-action:pan-y pinch-zoom!important;transition:transform .42s cubic-bezier(.22,.8,.24,1)!important;will-change:transform}.carousel-slide,.game-slide{transform:translateZ(0);backface-visibility:hidden}.carousel-controls button,.slider-buttons button,.slider-dots button,.account-primary,.button,.btn{transition:transform .16s ease,background-color .2s ease,border-color .2s ease,opacity .2s ease!important}.carousel-controls button:active,.slider-buttons button:active,.account-primary:active,.button:active,.btn:active{transform:scale(.94)!important}header,footer{transition:none!important}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto!important}*,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;transition-delay:0s!important}.carousel-track,.game-track{transition:none!important}.carousel-slide,.game-slide{scroll-behavior:auto!important}}

