/* Shared readable type sizes; layout dimensions and map coordinates stay unchanged. */
body{font-size:15px}
#main-nav.tabs .tab{font-size:clamp(13px,1.2vw,13px);letter-spacing:1.5px}
.fg-card .fg-desc{font-size:15px;line-height:1.8;color:#c9c1b1}
#panel-guide .fg-phenology-list li{font-size:14px;line-height:1.65;color:#d1c9b9}
#panel-guide .fg-ph-label,#panel-guide .fg-phenology-hdr{font-size:13px;color:#c4b99f;line-height:1.5}
.bt-guide-text{font-size:15px;line-height:1.65;color:#ddd5c3}
.bt-guild-pill,.atlas-history-dock .a-scope-pill,
.atlas-history-dock .a-yr-pick label,.calling-subnav .a-yr-pick label,
.atlas-history-dock #a-yr-select,.atlas-history-dock #a-month-select{font-size:13px}
.a-map-left-rail .a-item,.a-map-left-rail .a-item span{font-size:13px}
.app-footer,.app-footer-seo{font-size:13px;line-height:1.6;color:#afa797}
.learn-desc,.learn-intro,.learn-help,.learn-result{font-size:15px;line-height:1.65}
/* Remove the amber radial waveform behind the call-learning dial. */
.learn-waveform-wrap--behind-dial{display:none}

/* A single reading scale for prose, supporting labels, and controls. */
:root{--reading-body:16px;--reading-small:13px;--reading-leading:1.65}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{font-size:var(--reading-body);line-height:1.5}
:where(p,li,dd){overflow-wrap:break-word}
:where(h1,h2,h3,h4){text-wrap:balance;line-height:1.25}
:where(button,input,select,textarea){font-family:inherit}
.fg-card-desc,.fg-card .fg-desc,.learn-intro,.learn-desc,.learn-help,
.learn-hub-item-desc,.compare-notes,.quiz-detail,
#panel-auto-forecast .auto-forecast-gate-desc,
#panel-auto-forecast .auto-forecast-card-desc{
  font-size:var(--reading-body);line-height:var(--reading-leading);color:#d6cebd;
  max-width:68ch;overflow-wrap:break-word;text-align:left;
}
.learn-intro{margin:12px auto 20px}
.fg-card-desc{margin-block:12px 16px}
#panel-calling .bt-guide-text{font-size:16px;max-width:72ch;text-align:left;line-height:1.65;margin:16px auto}
#panel-calling .bt-guild-pill,#panel-calling .bt-view-pill,
#panel-calling .bt-guild-toggles-lbl,#panel-calling .bt-legend,
#panel-calling .bt-survey,#panel-calling .bt-week-readout,
.bt-heatmap-scale-labels,.bt-month,.quiz-progress{
  font-size:var(--reading-small);line-height:1.5;letter-spacing:.04em;color:#beb5a4;
}
#panel-calling .bt-guild-toggles{flex-wrap:wrap;gap:8px}
#panel-calling .bt-guild-pill,#panel-calling .bt-view-pill{min-height:36px;white-space:normal}
#panel-calling #bt-rows .bt-latin{font-size:13px;line-height:1.4}
@media(max-width:700px){
  #main-nav.tabs .tab{font-size:13px;letter-spacing:.04em;min-height:44px}
  .fg-card-desc,.learn-intro,.learn-desc,.learn-help,.quiz-detail{max-width:100%}
  #panel-calling .bt-guide-text{max-width:100%;padding-inline:12px;box-sizing:border-box}
  #panel-calling .bt-guild-pill,#panel-calling .bt-view-pill{min-height:44px}
  input,select,textarea{font-size:16px}
  .learn-intro{padding-inline:12px;box-sizing:border-box}
}
/* Persistent footer and header audio visualization. */
#main-nav a.tab{text-decoration:none;display:flex;align-items:center}
#main-nav #hdr-waveform-slot{display:flex;align-items:center;flex:0 0 100px;margin:0 14px 0 auto;min-width:0}
#main-nav #hdr-waveform-slot .hdr-waveform-wrap{width:100%;height:32px;min-width:0;max-width:100px}
#main-nav #hdr-waveform-slot .hdr-waveform{width:100%;height:32px;max-width:100%;max-height:32px}
.amb-bar-toggles{flex-wrap:wrap;gap:8px}
.amb-bar-group .amb-toggle{font-size:13px;line-height:1.4;min-height:32px;display:inline-flex;align-items:center}
@media(max-width:700px){
  #main-nav #hdr-waveform-slot{flex-basis:56px;margin-inline:6px}
  .amb-bar-group{grid-template-columns:1fr;grid-template-areas:"social" "toggles"}
  .amb-bar-toggles{flex-wrap:wrap;overflow:visible;justify-content:center}
  .amb-bar-group .amb-toggle{min-height:36px;white-space:normal}
}
#compare-chart-host{overflow-x:auto}
#compare-chart-host .compare-chart-svg{min-width:920px}
#compare-chart-host text{font-size:13px}
#compare-summary{font-size:15px;line-height:1.65}
#compare-summary span{font-size:13px!important}
#a-timeline-lbl{color:#bfb6a4!important;letter-spacing:.04em!important}
/* Field guide photo captions sit on the paper, never over the specimen. */
#panel-guide .fg-photo-pile-canvas .fg-stage .fg-stage-img{
  background:#eee8d8;border-color:#c8bfa9;border-radius:3px;
}
#panel-guide .fg-photo-pile-canvas .fg-stage-img > .fg-stage-lbl,
#panel-guide .fg-photo-pile-canvas .fg-stage.fg-stage--light-field-text .fg-stage-img > .fg-stage-lbl{
  position:relative;inset:auto;order:2;align-self:stretch;
  display:block;max-height:none;overflow:visible;-webkit-line-clamp:unset;
  margin:10px 0 0;padding:9px 3px 2px;border-top:1px solid #c9bfaa;
  font-family:'IBM Plex Mono',monospace;font-size:14px;font-weight:400;
  font-style:normal;line-height:1.5;letter-spacing:0;text-transform:none;
  color:#38352d;text-align:left;text-shadow:none;
}
#panel-guide .fg-photo-pile-canvas .fg-stage-img > .fg-stage-source-word,
#panel-guide .fg-photo-pile-canvas .fg-stage.fg-stage--light-field-text .fg-stage-img > .fg-stage-source-word{
  position:relative;inset:auto;order:3;align-self:flex-start;
  display:block;margin:4px 0 0;padding:2px 3px;
  font-size:13px;line-height:1.5;letter-spacing:0;text-transform:none;
  color:#625a4b;text-shadow:none;
}
/* Fit the quiz dial to the space left after instructions and playback controls. */
#panel-vocalizations #learn-view-quiz:not([hidden]){height:100%;min-height:0}
#panel-vocalizations #learn-view-quiz:not([hidden]) .learn-dial-stack{
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  flex:1 1 0;min-height:0;max-height:none;width:100%;padding:8px 12px 16px;box-sizing:border-box;
}
#learn-view-quiz .learn-dial-play-wrap{flex:0 0 auto;margin:0 auto 8px}
#panel-vocalizations #learn-view-quiz .learn-selector{
  flex:1 1 0;min-height:0;width:100%;max-width:100%;padding:0;
  container-type:size;display:grid;place-items:center;
}
#panel-vocalizations #learn-view-quiz .learn-dial-stage{
  width:min(90cqw,90cqh);height:min(90cqw,90cqh);max-width:none;max-height:none;
  flex-shrink:0;margin:0;
}
#panel-vocalizations #learn-view-quiz .learn-intro{margin:6px auto 8px;font-size:14px;line-height:1.5}
#panel-vocalizations #learn-view-quiz .learn-toolbar{margin:0 auto 4px}
#panel-vocalizations #learn-view-quiz .learn-result:empty{min-height:0;margin:0}
@media(max-height:550px){
 #panel-vocalizations #learn-view-quiz .learn-intro{font-size:13px;margin:2px auto;line-height:1.3}
 #learn-view-quiz .learn-dial-play-wrap{margin-bottom:4px}
}
/* Atlas species list: portraits match the Learn wheel. */
#panel-historical .a-map-left-rail{width:min(360px,calc(100% - 24px));padding:10px;background:rgba(16,17,15,.92);border:1px solid #383a31;border-radius:12px;box-shadow:0 8px 28px #0004}
#panel-historical .a-map-left-rail .a-legend{display:flex;flex-direction:column;gap:5px}
#panel-historical .a-map-left-rail .a-legend .a-item{display:flex;align-items:center;gap:7px;padding:7px;border:1px solid transparent;border-radius:8px;background:rgba(255,255,255,.025);min-height:54px;box-sizing:border-box}
#panel-historical .a-map-left-rail .a-legend .a-item:hover{background:rgba(255,255,255,.065);border-color:#575548}
#panel-historical .a-map-left-rail .a-legend .a-item.solo{background:#302b1c;border-color:#a78b49}
#panel-historical .a-map-left-rail .a-legend .a-item.inat-solo{border-right:2px solid #82afd2}
#panel-historical .a-map-left-rail .a-legend .a-item.off{opacity:.5}
#panel-historical .a-species-portrait{position:relative;flex:0 0 42px;width:42px;height:42px;border-radius:50%;background:#25281f;display:grid;place-items:center}
#panel-historical .a-species-portrait img{width:42px;height:42px;object-fit:contain}
#panel-historical .a-map-left-rail .a-name{min-width:0;font-size:14px;line-height:1.4;font-weight:400;letter-spacing:0;color:#e1dccd}
#panel-historical .a-map-left-rail .a-solo-btn{width:27px;min-height:30px;padding:0;border:1px solid #57594d;border-radius:5px;color:#c2c2b4;font-size:13px}
#panel-historical .a-map-left-rail .a-solo-btn.on{color:#f3d78c;border-color:#a78b49;background:#40361f}
#panel-historical .a-legend-instructions{margin:0 0 9px;padding:0 3px 10px;border:0;border-bottom:1px solid #383a31;font-size:13px;line-height:1.6;color:#bbbbaa}
#panel-historical .a-map-left-rail .a-map-rail-status{padding:10px 4px 2px;border-top:1px solid #383a31;color:#bbbbaa}
@media(max-width:700px){#panel-historical .a-map-left-rail{width:min(340px,calc(100% - 24px))}}
/* Compact Atlas controls: one row on wide screens, natural wrapping on small ones. */
.atlas-history-dock .atlas-history-dock-inner{padding:4px 12px;max-width:100%;gap:4px;min-height:0}
.atlas-history-dock .atlas-history-dock-seg{gap:5px;padding-right:7px;margin-right:0}
.atlas-history-dock .atlas-dock-map-layers{flex:1 1 auto;min-width:0}
.atlas-history-dock .a-layers{display:flex;flex-wrap:wrap;align-items:center;gap:4px 10px;margin:0;padding:0}
.atlas-history-dock .a-layer-row{margin:0;padding:2px 0;min-height:28px;white-space:nowrap}
.atlas-history-dock .a-play{min-width:70px;padding:4px 8px}
.atlas-history-dock .a-mode-pill,.atlas-history-dock .a-scope-pill{padding:4px 7px}
.atlas-history-dock .a-yr-pick{gap:4px}
@media(min-width:1400px){.atlas-history-dock .atlas-history-dock-inner{flex-wrap:nowrap}.atlas-history-dock .a-layers{flex-wrap:nowrap}}
/* Larger header brand, shared by the main site and coming-soon pages. */
#main-nav .nav-frog-logo-wrap{width:44px;height:44px}
#main-nav .nav-brand-frognight{font-size:24px}
#main-nav .main-nav-brand{min-height:48px;gap:12px}
@media(max-width:700px){
 #main-nav .nav-frog-logo-wrap{width:34px;height:34px}
 #main-nav .nav-brand-frognight{font-size:20px}
 #main-nav .main-nav-brand{gap:8px}
}
/* Seasonal dividers and a compact calendar key. */
#panel-calling .bt-season-marker{display:flex;align-items:center;gap:12px;flex:0 0 auto;margin:14px 0 7px;font-size:13px;line-height:1.4;font-weight:500;letter-spacing:.06em;color:#a4d6c8}
#panel-calling .bt-season-marker::after{content:'';height:1px;flex:1;background:rgba(117,183,159,.3)}
#panel-calling .bt-season-marker[data-bt-guild="mid"]{color:#79c5a5}
#panel-calling .bt-season-marker[data-bt-guild="late"]{color:#59b694}
#panel-calling .bt-season-marker[hidden]{display:none}
#panel-calling .bt-timeline-controls{margin-top:16px;padding:14px 0;border-top:1px solid #29362e}
#panel-calling .bt-guild-toggles{display:flex;flex-direction:row;align-items:center;justify-content:center;flex-wrap:wrap;gap:10px}
#panel-calling .bt-guild-toggles-lbl{font-size:13px;letter-spacing:.03em}
#panel-calling .bt-guide-text{font-size:14px;line-height:1.5;text-align:center;max-width:none;margin:10px 0 0;color:#b8c2b9}
#panel-calling .bt-guide-text strong{font-weight:500;color:#d4e4d8}
/* Align calendar filters and their explanation with the chart's left edge. */
#panel-calling .bt-guild-toggles{justify-content:flex-start}
#panel-calling .bt-guild-pills{justify-content:flex-start}
#panel-calling .bt-guide-text{text-align:left;margin-left:0;margin-right:0}
/* Let the complete Atlas legend determine the page height. */
#panel-historical .atlas-wrap{overflow-y:auto;overflow-x:hidden;display:block}
#panel-historical .atlas-map{min-height:100%;overflow:hidden;border:0;box-sizing:border-box}
#panel-historical .atlas-map::before{display:none}
#panel-historical .a-map-left-rail{position:relative;top:auto;left:auto;bottom:auto;margin:10px;overflow:visible;height:auto;max-height:none}
#panel-historical .a-map-left-rail-scroll{flex:none;overflow:visible;height:auto;max-height:none}
#panel-historical .a-map-rail-status:has(#a-now:empty){display:none}
@media(max-width:900px){
 #panel-historical .atlas-wrap:not(.atlas-species-rail-open) .a-map-left-rail{display:none}
}
/* Explore Data: paired selectors, a full-size chart and concise results. */
/* About uses a wide editorial layout with short, readable text columns. */
#panel-about > .about-page{width:100%;max-width:1440px;margin:0 auto;padding:clamp(24px,4vw,56px) clamp(20px,4vw,56px) 60px;box-sizing:border-box}
#panel-about .about-hero{display:grid;grid-template-columns:minmax(0,1fr) 240px;align-items:center;gap:40px;padding-bottom:32px}
#panel-about .about-eyebrow{font-size:13px;letter-spacing:.12em;text-transform:uppercase;color:#cba76b;margin:0 0 16px}
#panel-about .about-hero h1{font-size:clamp(34px,4.7vw,64px);line-height:1.1;letter-spacing:-.025em;max-width:16ch;margin:0 0 22px;color:#e6d6b3}
#panel-about .about-hero .about-intro{font-size:19px;line-height:1.65;max-width:58ch;margin:0;color:#cec9bb}
#panel-about .about-hero img{width:100%;max-width:240px;height:auto;max-height:260px;object-fit:contain;justify-self:center}
#panel-about .about-facts{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;border-block:1px solid #383a2e;padding:26px 0;margin-bottom:38px}
#panel-about .about-facts div{display:flex;flex-direction:column;gap:6px}
#panel-about .about-facts strong{font-size:clamp(25px,3vw,36px);font-weight:500;color:#b7cbae}
#panel-about .about-facts span{font-size:14px;line-height:1.5;color:#bbb8aa}
#panel-about .about-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:30px 64px}
#panel-about .about-page h2{font-size:24px;line-height:1.3;margin:0 0 14px;color:#dbcaab;letter-spacing:0}
#panel-about .about-page h2::before{content:none}
#panel-about .about-page p{font-size:16px;line-height:1.75;max-width:none;color:#c6c2b5;margin:0}
#panel-about .about-call-scale{margin-top:38px;padding:28px;border:1px solid #343b30;border-radius:10px;background:#0c100b}
#panel-about .about-scale-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin:22px 0}
#panel-about .about-scale-grid div{display:flex;align-items:center;gap:14px;font-size:15px;color:#cdd4c4}
#panel-about .about-scale-grid strong{display:grid;place-items:center;width:44px;height:44px;flex-shrink:0;border-radius:50%;background:#283924;font-size:24px;color:#cee5bd;font-weight:500}
#panel-about .about-call-scale p{font-size:14px;color:#b6bdaf}
#panel-about .about-credits{margin-top:38px;padding-top:30px;border-top:1px solid #383a2e}
#panel-about .about-credits dl{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:24px 64px;margin:22px 0 30px}
#panel-about .about-credits dt{font-size:13px;line-height:1.5;color:#aca998;margin-bottom:6px}
#panel-about .about-credits dd{margin:0;color:#ded8c7;font-size:17px;line-height:1.5}
#panel-about .about-credit-notes{display:grid;gap:10px}
#panel-about .about-credit-notes p{font-size:14px}
#panel-about .about-credit-notes strong{color:#ccc2a9;font-weight:500;margin-right:8px}
@media(max-width:700px){
 #panel-about .about-hero{grid-template-columns:1fr;gap:20px}
 #panel-about .about-hero img{width:120px;grid-row:1;justify-self:start}
 #panel-about .about-hero .about-intro{font-size:17px}
 #panel-about .about-grid,#panel-about .about-credits dl{grid-template-columns:1fr;gap:26px}
 #panel-about .about-facts{gap:12px}
 #panel-about .about-facts span{font-size:13px}
 #panel-about .about-call-scale{padding:20px}
 #panel-about .about-scale-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
 #panel-about .about-scale-grid div{font-size:14px;gap:8px}
}
#panel-compare > .page-scroll{max-width:1440px;padding:24px clamp(16px,3vw,44px) 40px;gap:16px}
#panel-compare h2{margin:0;font-size:clamp(28px,4vw,40px)}
#panel-compare .compare-lead{font-size:16px;margin:0;color:#bcb9ad}
#panel-compare .compare-controls{padding:0;margin:6px 0 0;border:0;background:none;flex-shrink:0}
#panel-compare .compare-ab-grid{gap:16px;grid-template-columns:repeat(2,minmax(0,1fr))}
#panel-compare .compare-ab-col{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;padding:18px;background:#10110f;border:1px solid #454036;border-top:3px solid #f0b054;box-shadow:none;border-radius:10px}
#panel-compare .compare-ab-col:first-child{border-color:#343f36;border-top-color:#56e48c;box-shadow:none}
#panel-compare .compare-ab-hdr{grid-column:1/-1;font-size:15px;letter-spacing:0;margin:0}
#panel-compare .compare-point{min-width:0;gap:6px}
#panel-compare .compare-point label{color:#c6c2b5;font-size:13px;letter-spacing:0}
#panel-compare .compare-point select{width:100%;max-width:none;min-width:0;min-height:44px;padding:8px 10px;font-size:14px;letter-spacing:0;color:#eee9da;background:#191b17;border:1px solid #45483f;border-radius:5px}
#panel-compare .compare-chart-stage{max-height:none;flex:none;min-height:0;padding:18px 0;background:#090b09;border:1px solid #30352e;border-radius:10px;overflow:hidden}
#panel-compare #compare-chart-host{max-height:none;min-height:0;justify-content:flex-start;overflow-x:auto}
#panel-compare .compare-chart-svg{height:auto;max-height:none;width:100%;min-width:720px;flex-shrink:0}
#panel-compare .compare-chart-svg text{font-size:13px;fill:#c1beaf}
#panel-compare .compare-chart-series{stroke-width:2}
#panel-compare #compare-summary{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin:0;padding:0}
#panel-compare .explore-stat{display:flex;flex-direction:column;gap:8px;padding:16px 18px;border:1px solid #34352d;border-radius:8px;background:#10110f;font-size:13px;color:#bcb9ad}
#panel-compare .explore-stat-label{min-height:2.8em;line-height:1.4}
#panel-compare .explore-stat strong{font-size:clamp(26px,3vw,38px);line-height:1.1;font-weight:500;color:#eee9da}
#panel-compare .explore-stat-a strong{color:#56e48c}
#panel-compare .explore-stat-b strong{color:#f0b054}
#panel-compare .explore-method{color:#bcb9ad;font-size:14px;line-height:1.6;padding:4px 0}
#panel-compare .explore-method summary{cursor:pointer;width:fit-content}
#panel-compare .explore-method p{max-width:75ch;margin:12px 0}
@media(max-width:700px){
 #panel-compare .compare-ab-grid{grid-template-columns:1fr}
 #panel-compare #compare-summary{grid-template-columns:1fr;gap:8px}
 #panel-compare .explore-stat-label{min-height:0}
 #panel-compare .compare-ab-col{padding:14px}
 #panel-compare .compare-metric-row{grid-column:1/-1}
}