#about { width:min(820px,calc(100vw - 32px)); max-width:none; max-height:calc(100dvh - 36px); padding:0; overflow:hidden; border:1px solid #b8c7d2; }
#about[open] { display:flex; flex-direction:column; }
.info-header { padding:24px 28px 0; flex-shrink:0; }
.info-header .dialog-heading { margin-bottom:14px; }
.info-header h2 { font-size:24px; line-height:1.4; margin:0 0 18px; }
.info-tabs { display:flex; gap:4px; border-bottom:1px solid #d5dfe6; padding-bottom:10px; }
.info-tabs button { border:0; background:transparent; padding:9px 12px; color:#718391; font-size:11px; border-radius:3px; white-space:nowrap; }
.info-tabs button[aria-selected=true] { background:#304e64; color:#fff; }
.info-tabs button:hover:not([aria-selected=true]) { background:#eaf0f4; }
.info-tabs button:focus-visible, .info-model-card:focus-visible { outline:2px solid #8faabf; outline-offset:2px; }
#info-scroll { padding:24px 28px 28px; overflow:auto; overscroll-behavior:contain; min-height:0; }
.info-section-heading > span { font-size:9px; letter-spacing:1px; color:#8196a5; }
#about h3 { font-size:23px; line-height:1.5; letter-spacing:-.6px; margin:10px 0; }
#about p { font-size:12px; line-height:1.9; color:#627786; }
.info-model-grid { display:grid; grid-template-columns:1fr 1fr; gap:12px; margin:22px 0; }
.info-model-card { border:1px solid #d4dfe6; border-radius:4px; background:#f4f7f9; padding:18px; text-align:left; }
.info-model-card:hover { border-color:#8ea8bb; background:#eaf1f6; }
.info-model-card > span { font-size:10px; color:#7793a8; }
.info-model-card b { display:block; font-size:16px; color:#344f63; margin-top:8px; }
#about .info-model-card p { font-size:11px; margin:8px 0 15px; }
.info-model-card small { font-size:10px; color:#6a879b; }
.info-note { background:#eef3f6; border-left:2px solid #8ba3b4; padding:15px 17px; margin:20px 0; }
.info-note b { font-size:12px; color:#3e5e74; }
#about .info-note p { margin:7px 0 0; font-size:11px; }
#about .info-footnote { font-size:10px; color:#80929f; line-height:1.9; }
.info-io { margin:23px 0; }
.info-io > div { padding:12px 0; border-top:1px solid #e1e7eb; display:grid; grid-template-columns:112px 1fr; gap:16px; }
.info-io dt { font-size:11px; font-weight:600; color:#516b7d; }
.info-io dd { margin:0; font-size:12px; line-height:1.85; color:#647988; }
.info-training { margin-top:24px; }
#about h4 { font-size:13px; color:#344f63; margin:24px 0 14px; }
#about table { width:100%; font-size:11px; table-layout:fixed; }
#about caption { text-align:left; font-size:10px; color:#7b909f; margin-bottom:8px; }
#about th,#about td { padding:10px; }
#about th[scope=row] { font-weight:400; }
.reference-entry { display:grid; grid-template-columns:92px 1fr; gap:15px; padding:18px 0; border-top:1px solid #dce4e9; }
.info-model-label { font-size:11px; font-weight:600; color:#45667c; }
#about .reference-entry a { display:block; font-size:12px; line-height:1.7; color:#426982; overflow-wrap:anywhere; }
.reference-entry small { display:block; font-size:10px; color:#8b9ba6; margin:4px 0 10px; }
#about .reference-entry a:last-child { font-size:11px; }
@media(max-width:600px) {
  .info-header { padding:18px 18px 0; }
  #info-scroll { padding:20px 18px; }
  .info-tabs { display:grid; grid-template-columns:repeat(3,1fr); gap:4px; }
  .info-tabs button { padding:9px 4px; }
  .info-model-grid { gap:8px; }
  .info-model-card { padding:13px; }
  #about h3 { font-size:21px; }
  .info-io > div { grid-template-columns:1fr; gap:6px; }
  .reference-entry { grid-template-columns:1fr; gap:8px; }
}
