/* About 2.7: a regional variant of the Project Map composition.
 * All text roles use the shared Prototype 6 typography register. */
.gn-section { --gn-blue:#065baa; --gn-line:#d4deea; }
.gn-intro { max-width:56ch; }
.gn-instruction,.gn-name-en,.gn-detail dt { font-family:var(--type-supporting-family); font-size:var(--type-functional-supporting); font-weight:var(--type-functional-reading-weight); font-style:normal; font-synthesis:none; line-height:var(--type-supporting-leading); letter-spacing:0; }
.gn-instruction { margin:0 0 22px; color:var(--muted); }
.gn-layout { display:grid; grid-template-columns:minmax(0,1fr); gap:26px; }
.gn-controls,.gn-stage,.gn-detail { min-width:0; }
.gn-tabs { display:flex; gap:8px; overflow-x:auto; padding:3px 2px 12px; scroll-padding-inline:2px; scrollbar-width:thin; }
.gn-tab { flex:none; min-height:46px; padding:11px 16px; border:1px solid var(--gn-line); background:#fff; color:var(--tank-blue); font-family:var(--type-action-family); font-size:var(--type-functional-action); font-weight:var(--type-action-weight); font-synthesis:none; line-height:var(--type-action-leading); white-space:nowrap; cursor:pointer; }
.gn-tab[aria-selected="true"] { background:var(--tank-blue); border-color:var(--tank-blue); color:#fff; }
.gn-tab:hover:not([aria-selected="true"]) { background:var(--soft-blue); }
.gn-tab:focus-visible { outline:3px solid var(--gn-blue); outline-offset:3px; }
.gn-frame { width:100%; max-width:660px; height:clamp(240px,26vw,360px); overflow:hidden; background:#e6f1f8; }
.gn-map-embed { display:block; width:100%; height:100%; border:0; }
.gn-map-link { display:flex; align-items:center; gap:10px; width:fit-content; max-width:100%; margin-top:12px; color:var(--gn-blue); font-family:var(--type-action-family); font-size:var(--type-functional-action); font-weight:var(--type-action-weight); line-height:var(--type-action-leading); text-decoration:underline; text-underline-offset:4px; }
.gn-detail [hidden] { display:none!important; }
.gn-detail { padding-top:22px; }
.gn-name-th { margin:0 0 10px; color:var(--tank-blue); text-wrap:balance; }
/* This heading remains Thai even while the surrounding interface is English. */
html[lang][data-language] main[id] .gn-name-th[data-type] { font-size:var(--type-item-th); }
.gn-name-en { margin:0 0 28px; color:var(--muted); }
.gn-name-en[lang="en"] { font-weight:400; }
.gn-detail dl { margin:0; }
.gn-detail dl>div { border-top:1px solid var(--gn-line); padding:18px 0; }
.gn-detail dt { color:var(--muted); margin:0 0 8px; }
.gn-detail dd { margin:0; overflow-wrap:anywhere; }
.gn-detail a { color:var(--gn-blue); text-decoration:underline; text-underline-offset:4px; }
@media(min-width:1000px) {
  .gn-layout { grid-template-columns:minmax(0,1.15fr) minmax(300px,1fr); grid-template-areas:"controls detail" "stage detail"; gap:12px 48px; align-items:start; }
  .gn-controls { grid-area:controls; }
  .gn-stage { grid-area:stage; }
  .gn-detail { grid-area:detail; }
}
