.about-version-switch{position:fixed;right:20px;bottom:188px;z-index:10002;display:flex;gap:4px;padding:4px;border:1px solid #b8a6d055;border-radius:12px;background:#28262d;font:12px Arial}
.about-version-switch button{padding:8px 12px;border:0;border-radius:8px;background:transparent;color:#ece5fa;cursor:pointer}
.about-version-switch button[aria-pressed="true"]{background:#ece5fa;color:#28262d}
.about-icon-grid>.about-tile .about-icon-alternative{display:none}
[data-about-version="icons"] .about-icon-grid>.about-tile .about-emoji:not(.about-icon-alternative){display:none}
[data-about-version="icons"] .about-icon-grid>.about-tile .about-icon-alternative{display:block}
.about-icon-grid>.about-tile .about-icon-alternative svg{display:block;width:100%;height:100%;fill:none;stroke:currentColor}
@media print{.about-version-switch{display:none}}
.about-icon-grid>.about-tile .about-icon-alternative svg[data-icon-style="fill"]{fill:currentColor;stroke:none}
.about-icon-grid>.about-tile .about-icon-alternative svg[data-icon-style="outline"]{fill:none;stroke:currentColor}
.about-icon-grid>.about-tile .about-icon-alternative img{display:block;width:100%;height:100%;object-fit:contain}

/* Strengthen the translate icon while preserving its dimensions. */
.about-icon-grid > .about-tile[data-detail="sprog"] .about-icon-alternative svg[data-icon-style="fill"] {
  stroke: currentColor;
  stroke-width: 8;
  stroke-linecap: round;
  stroke-linejoin: round;
}

/* Size icons in proportion to their circle, independently of emoji styling. */
body[data-about-version="icons"] .about-icon-grid > .about-tile { container-type: inline-size; }
body[data-about-version="icons"] .about-icon-grid > .about-tile .about-icon-alternative {
  width: 28cqw;
  height: 28cqw;
  flex: 0 0 auto;
}
body[data-about-version="icons"] .about-icon-grid > .about-tile[data-detail="tanker"] .about-icon-alternative,
body[data-about-version="icons"] .about-icon-grid > .about-tile[data-detail="proces"] .about-icon-alternative {
  width: 30cqw;
  height: 30cqw;
}
body[data-about-version="icons"] .about-icon-grid > .about-tile[data-detail="persona"] .about-icon-alternative {
  width: 26cqw;
  height: 26cqw;
}
body[data-about-version="icons"] .about-icon-grid > .about-tile[data-detail="baggrund"] .about-icon-alternative {
  width: 26cqw;
  height: 26cqw;
}

/* Equal icon-to-label spacing in every icon bubble. */
body[data-about-version="icons"] .about-icon-grid > .about-tile {
  gap: 8px;
}

/* Stack each label directly below its icon. */
body[data-about-version="icons"] .about-icon-grid > .about-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
}
body[data-about-version="icons"] .about-icon-grid > .about-tile > .about-icon-alternative {
  order: 0;
}
body[data-about-version="icons"] .about-icon-grid > .about-tile > span:not(.about-emoji):not(.layout-handle) {
  order: 1;
}

/* Match the light glass surface from UngeKræfter's design-detail stage. */
#om .about-icon-grid > .about-tile {
 background:#ffffff59;
 border-color:#ffffffa6;
 box-shadow:0 8px 32px #30243e08;
 backdrop-filter:blur(24px) saturate(115%);
 -webkit-backdrop-filter:blur(24px) saturate(115%);
 color:#252422;
}
#om .about-icon-grid > .about-tile:is(:hover,:focus-visible) {
 background:#ffffff70;
 color:#252422;
}
#om .about-icon-grid > .about-tile > span { color:inherit; }
#om .about-icon-grid > .about-tile .about-icon-alternative :is(img,svg) {
 filter:brightness(0);
}
[data-theme="dark"] #om .about-icon-grid > .about-tile {
 background:linear-gradient(135deg,#eee7ff0e,#dce9cc06);
 border-color:#eee7ff24;
 box-shadow:inset 0 1px 0 #ffffff0b,0 12px 40px #08080b18;
 color:#fff;
}
[data-theme="dark"] #om .about-icon-grid > .about-tile .about-icon-alternative :is(img,svg) {
 filter:brightness(0) invert(1);
}
