/* Public atlas study: deliberately separate from the viewport-sized game UI. */
.study-page { max-width: 1280px; margin: auto; padding: 38px 48px 40px; }
.study-heading { display: flex; justify-content: space-between; align-items: center; margin-bottom: 28px; }
.study-heading h1 { font-size: clamp(32px, 3.5vw, 46px); font-weight: 430; letter-spacing: -1.5px; line-height: 1.2; margin: 9px 0 10px; }
.study-heading p { color: #b2c3c7; font-size: 14px; }
.study-atlas-mark { color: #75989f; padding-right: 7px; }
.study-categories { display: grid; grid-template-columns: repeat(8, minmax(0, 1fr)); gap: 8px; }
.study-category { position: relative; display: flex; flex-direction: column; align-items: flex-start; gap: 13px; min-height: 96px; padding: 14px 12px; border: 1px solid var(--line); border-radius: 8px; color: #bdcdd0; background: #ffffff02; font-size: 11px; line-height: 1.35; }
.study-category > svg { color: var(--category-color); }
.study-category > i { position: absolute; right: 11px; top: 16px; border: 1px solid #698087; width: 7px; height: 7px; border-radius: 50%; }
.study-category[aria-checked="true"] { border-color: var(--category-color); background: color-mix(in srgb, var(--category-color) 12%, var(--ocean)); color: var(--bone); }
.study-category[aria-checked="true"] > i { background: var(--category-color); border-color: var(--category-color); }
.study-category:hover { border-color: var(--category-color); }
.study-toolbar { display: flex; justify-content: space-between; align-items: center; gap: 20px; margin: 21px 0 2px; }
.study-scope { display: flex; flex-wrap: wrap; gap: 4px; padding: 4px; border: 1px solid var(--line); border-radius: 7px; }
.study-scope a { font-size: 11px; color: #acbfc5; padding: 8px 11px; border-radius: 4px; min-height: 36px; display: flex; align-items: center; }
.study-scope a[aria-checked="true"] { color: var(--bone); background: #254650; }
.study-find-link { display: inline-flex; align-items: center; gap: 8px; color: var(--study-color); font-size: 12px; min-height: 44px; }
.study-layout { display: grid; grid-template-columns: minmax(0, 1fr) 310px; gap: 40px; align-items: start; }
.study-world { min-width: 0; }
.study-globe { max-width: 620px; margin: 0 auto; }
.study-globe .globe-surface { width: 100%; margin: 0 auto; }
.study-globe .world-canvas { touch-action: none; }
.study-globe .globe-loading { white-space: normal; width: min(300px, 85%); text-align: center; }
.study-globe.is-unavailable .globe-orbit { display: none; }
.study-globe .world-canvas:focus-visible { outline: 2px solid var(--study-color); outline-offset: -10px; border-radius: 50%; }
.study-globe .globe-tooltip { max-width: min(280px, calc(100vw - 24px)); width: max-content; white-space: normal; z-index: 30; text-align: left; line-height: 1.6; border: 1px solid #6a8790; padding: 10px 13px; font-size: 11px; color: var(--bone); background: #09232bf5; box-shadow: 0 5px 20px #0004; }
.study-globe .globe-tooltip strong, .study-globe .globe-tooltip span { display: block; }
.study-globe .globe-tooltip strong { font-size: 13px; font-weight: 550; }
.study-globe .globe-tooltip span:last-child { color: #b4c9cf; }
.study-globe .globe-zoom { margin-top: -9px; position: relative; }
.study-globe .globe-zoom button { height: 40px; width: 42px; }
.study-globe-caption { display: flex; justify-content: center; align-items: center; gap: 18px; color: var(--slate); font-size: 10px; margin: 11px 0 22px; }
.study-legend { max-width: 520px; margin: 0 auto 28px; }
.study-legend-title { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 8px; align-items: baseline; margin-bottom: 9px; }
.study-legend-title h2 { font-size: 12px; font-weight: 500; }
.study-legend-title > span { font-size: 11px; color: var(--study-color); }
.study-ramp { height: 10px; border-radius: 3px; background: linear-gradient(to right, var(--ramp-light), var(--ramp-dark)); border: 1px solid #a0b7c440; }
.study-ramp-labels { display: flex; justify-content: space-between; font-size: 10px; color: #beced2; margin-top: 5px; }
.study-available { display: block; color: #b4c4c8; font-size: 10px; margin-top: 10px; }
.study-legend > p { color: var(--slate); font-size: 10px; line-height: 1.7; margin-top: 11px; max-width: 65ch; }
.study-neutral-legend { display: flex; gap: 10px 22px; flex-wrap: wrap; font-size: 10px; color: #b4c4c8; margin-top: 12px; }
.study-neutral-legend > span { display: flex; align-items: center; gap: 7px; }
.study-swatch { display: inline-block; width: 11px; height: 11px; border-radius: 2px; flex: none; border: 1px solid #7d9ca766; }
.study-swatch--missing { background: repeating-linear-gradient(135deg, #708086 0 3px, #aab5b7 3px 4px); }
.study-swatch--outside { background: #28434b; border: 1px dashed #79929a; }
.study-details { margin-top: 42px; padding: 23px; border: 1px solid var(--line); border-radius: 10px; background: #ffffff02; min-width: 0; }
.study-details:focus-visible { outline: 2px solid var(--study-color); outline-offset: 4px; }
.study-country-heading { display: flex; gap: 13px; align-items: center; }
.study-country-heading h2 { font-size: 24px; font-weight: 450; line-height: 1.3; letter-spacing: -.5px; margin-top: 4px; overflow-wrap: anywhere; }
.study-country-heading .eyebrow { font-size: 9px; }
.study-flag { width: 43px; height: 29px; object-fit: contain; flex: none; }
.study-primary-value { padding: 28px 0 18px; }
.study-value-label { display: flex; align-items: center; gap: 8px; color: var(--study-color); font-size: 11px; margin-bottom: 11px; }
.study-primary-value > strong { font-size: clamp(30px, 3.1vw, 43px); font-weight: 430; line-height: 1.15; letter-spacing: -1px; overflow-wrap: anywhere; }
.study-value-unit { color: #b6c7cc; font-size: 13px; margin-left: 7px; }
.study-primary-value > p { color: #c2d0d3; font-size: 12px; margin-top: 10px; }
.study-rank { display: inline-block; font-size: 11px; color: var(--study-color); padding: 6px 10px; border-radius: 4px; background: #ffffff05; }
.study-definition { margin: 22px 0; }
.study-definition h3 { font-size: 10px; font-weight: 500; color: #bdcdd0; margin-bottom: 8px; }
.study-definition p { font-size: 12px; color: #aebfc4; line-height: 1.8; }
.study-definition > span { display: block; color: var(--study-color); font-size: 10px; margin-top: 10px; }
.study-disclosure { border-top: 1px solid var(--line); }
.study-disclosure summary { padding: 15px 0; cursor: pointer; font-size: 11px; color: #c6d4d7; }
.study-source { font-size: 11px; line-height: 1.8; margin: 0 0 14px; }
.study-source dt { color: var(--slate); font-size: 10px; margin-top: 10px; }
.study-source dd { margin: 0; overflow-wrap: anywhere; }
.study-source dd + dd { margin-top: 10px; }
.study-source dd p { margin-top: 5px; color: var(--slate); }
.study-source a { text-decoration: underline; text-underline-offset: 3px; }
.study-other-values { margin: 0 0 14px; font-size: 10px; }
.study-other-values > div { display: flex; justify-content: space-between; gap: 12px; padding: 8px 0; border-top: 1px solid #ffffff08; }
.study-other-values dt { color: var(--slate); }
.study-other-values dd { margin: 0; text-align: right; }
.study-other-values small { display: block; margin-top: 5px; color: var(--slate); }
.study-empty-detail { padding-top: 10px; }
.study-empty-detail > svg { color: var(--study-color); margin-bottom: 15px; }
.study-empty-detail h2 { font-size: 23px; font-weight: 430; letter-spacing: -.4px; }
.study-empty-detail p { margin-top: 12px; font-size: 12px; color: var(--slate); line-height: 1.8; }
.study-directory { border-top: 1px solid var(--line); padding-top: 24px; }
.study-directory-heading { display: flex; align-items: center; justify-content: space-between; gap: 20px; }
.study-directory-heading h2 { font-size: 21px; font-weight: 450; letter-spacing: -.3px; }
.study-search { display: flex; gap: 8px; max-width: 420px; width: 100%; }
.study-search input[type="search"] { background: #09232b; border: 1px solid #3c5b65; border-radius: 6px; min-width: 0; width: 100%; color: var(--bone); padding: 10px 12px; font-size: 12px; min-height: 44px; scroll-margin-top: 24px; }
.study-search-button { border: 1px solid #3c5b65; border-radius: 6px; padding: 10px 13px; background: #173b45; color: var(--bone); font-size: 12px; cursor: pointer; }
.study-list-count { font-size: 10px; color: var(--slate); margin: 12px 0; }
.study-country-list { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 0 24px; list-style: none; margin: 0; padding: 0 8px 0 0; max-height: 330px; overflow-y: auto; scrollbar-color: #4a6c77 transparent; }
.study-country-list li { min-width: 0; }
.study-country-list a { display: flex; align-items: center; justify-content: space-between; gap: 12px; min-height: 49px; padding: 9px 7px; border-bottom: 1px solid #ffffff0b; font-size: 11px; border-radius: 3px; }
.study-country-list a:hover, .study-country-list a[aria-current="true"] { background: #ffffff06; }
.study-country-list a[aria-current="true"] { outline: 1px solid var(--study-color); outline-offset: -1px; }
.study-country-list a:focus-visible { outline-offset: -2px; }
.study-list-name { overflow-wrap: anywhere; }
.study-list-name > small { color: var(--slate); display: block; font-size: 9px; }
.study-list-value { color: #c2d0d3; display: flex; gap: 7px; align-items: center; text-align: right; font-size: 10px; }
.study-reference-note { font-size: 11px; color: var(--slate); margin-top: 28px; }
.study-status, .study-reload { color: var(--study-color); font-size: 12px; }
.study-status:empty { display: none; }
.study-status { margin-top: 12px; }
.study-reload { display: inline-block; padding: 10px 0; text-decoration: underline; }
.study-no-results, .study-fallback { font-size: 12px; color: var(--slate); padding: 20px 0; }
@media (max-width: 1050px) {
  .study-page { padding-inline: 32px; }
  .study-layout { grid-template-columns: minmax(0, 1fr) 285px; gap: 20px; }
  .study-categories { grid-template-columns: repeat(4, minmax(0, 1fr)); }
  .study-category { flex-direction: row; align-items: center; min-height: 60px; padding-right: 24px; gap: 10px; }
  .study-category > i { top: 10px; right: 8px; }
  .study-country-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}
@media (max-width: 700px) {
  .study-page { padding: 25px 20px 30px; }
  .study-heading { margin-bottom: 23px; }
  .study-heading p { font-size: 12px; }
  .study-heading h1 { font-size: 34px; }
  .study-atlas-mark { display: none; }
  .study-categories { gap: 7px; grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .study-category { min-height: 57px; font-size: 11px; }
  .study-toolbar { display: block; margin-top: 16px; }
  .study-scope { width: fit-content; }
  .study-scope a { font-size: 10px; min-height: 38px; padding: 7px 9px; }
  .study-find-link { margin-top: 5px; }
  .study-layout { display: flex; flex-direction: column; gap: 0; }
  .study-world { width: 100%; }
  .study-globe { max-width: 480px; }
  .study-globe .globe-surface { width: 100%; min-width: 0; }
  .study-globe .globe-size-toggle { display: inline-flex; min-height: 40px; }
  .study-globe .globe-zoom button { width: 44px; height: 44px; }
  .study-globe-caption { margin-bottom: 16px; gap: 12px; }
  .study-globe.is-expanded { position: fixed; inset: 0; z-index: 80; background: var(--ocean); padding: 20px; max-width: none; display: flex; flex-direction: column; justify-content: center; }
  .study-globe.is-expanded .globe-surface { width: min(100%, calc(100dvh - 160px)); max-width: 640px; margin-inline: auto; }
  .study-legend { margin-bottom: 23px; }
  .study-details { width: 100%; margin: 0 0 28px; padding: 22px; }
  .study-primary-value > strong { font-size: 40px; }
  .study-directory { width: 100%; }
  .study-directory-heading { display: block; }
  .study-search { margin-top: 15px; max-width: none; }
  .study-country-list { grid-template-columns: minmax(0, 1fr); }
  .study-country-list a { min-height: 53px; font-size: 12px; }
}
@media (max-width: 360px) {
  .study-page { padding-inline: 15px; }
  .study-category { font-size: 10px; padding-left: 9px; gap: 7px; }
  .study-category > svg { width: 20px; height: 20px; }
  .study-scope a { padding-inline: 7px; }
}