/* LABS / 003 — sound is the image; the machine shows its decisions. */
.bird-midi { --bird-red:#d62d20; --bird-paper:#f5f3ed; --bird-yellow:#edff47; --bird-rule:#aaa69d; background:#fff; color:#171715; min-height:75svh; }
.bird-midi button,.bird-midi select,.bird-midi input { border-radius:0; }
.bird-lab-number,.bird-library header>span,.bird-library header>p,.bird-analysis-register,.bird-analysis-foot,.bird-controls label>span,.bird-object,.bird-method summary,.bird-debug { font:11px/1.35 var(--mono); letter-spacing:.025em; text-transform:uppercase; }
.bird-arrival { min-height:calc(100svh - var(--header)); padding:clamp(28px,4vw,64px) var(--gutter); display:grid; grid-template-rows:auto minmax(min-content,1fr) auto auto; row-gap:28px; background:#fff; }
.bird-arrival h1 { align-self:center; font-size:clamp(72px,14vw,230px); line-height:.74; letter-spacing:-.09em; min-width:0; max-width:100%; overflow-wrap:anywhere; }
.bird-arrival>p { position:static; justify-self:end; max-width:100%; font-size:clamp(20px,2vw,36px); line-height:1.02; letter-spacing:-.05em; }
.bird-arrival-action { align-self:end; width:100%; min-height:96px; border-top:1px solid var(--ink); border-bottom:1px solid var(--ink); display:flex; justify-content:space-between; align-items:center; font-size:clamp(22px,2.7vw,44px); text-align:left; }
.bird-arrival-action:hover,.bird-arrival-action:focus-visible { background:var(--bird-yellow); padding-inline:18px; }
.bird-arrival-action span { font-size:1.5em; font-weight:200; }
.bird-library { min-height:calc(100svh - var(--header)); padding:32px var(--gutter) 60px; }
.bird-library header { display:grid; grid-template-columns:1fr 3fr 1fr; gap:24px; align-items:end; border-bottom:1px solid var(--ink); padding-bottom:24px; }
.bird-library h2 { font-size:clamp(50px,8vw,130px); line-height:.82; letter-spacing:-.075em; }
.bird-library header>p { text-align:right; }
.bird-choice-list { border-bottom:1px solid var(--ink); }
.bird-choice { width:100%; min-height:110px; display:grid; grid-template-columns:70px minmax(220px,1.5fr) minmax(220px,1fr) 50px; gap:20px; align-items:center; border-top:1px solid var(--bird-rule); text-align:left; }
.bird-choice:first-child { border-top:0; }
.bird-choice:hover,.bird-choice:focus-visible { background:var(--bird-red); color:#fff; padding-inline:15px; }
.bird-choice-index,.bird-choice-data,.bird-choice em,.bird-choice small { font:10px/1.4 var(--mono); text-transform:uppercase; font-style:normal; }
.bird-choice strong { display:block; font-size:clamp(22px,2.5vw,39px); font-weight:400; letter-spacing:-.045em; text-transform:uppercase; }
.bird-choice em { display:block; margin-top:5px; text-transform:none; }
.bird-choice-data { display:flex; flex-direction:column; gap:8px; }
.bird-choice>span:last-child { justify-self:end; font-size:32px; }
.bird-library-back { min-height:64px; padding-top:22px; font:11px var(--mono); }
.bird-instrument { outline:0; }
.bird-instrument-heading { padding:32px var(--gutter) 28px; display:grid; grid-template-columns:minmax(0,1fr) auto; gap:30px; align-items:end; border-bottom:1px solid var(--ink); }
.bird-instrument-heading h2 { margin-top:24px; font-size:clamp(58px,9vw,148px); line-height:.75; letter-spacing:-.085em; overflow-wrap:anywhere; }
.bird-instrument-heading p { margin-top:18px; font:italic clamp(15px,1.5vw,22px) Georgia,serif; }
.bird-instrument-heading button { min-height:48px; border:1px solid var(--ink); padding:0 18px; font:10px var(--mono); }
.bird-instrument-heading button:hover { background:var(--bird-yellow); }
.bird-analysis { position:relative; background:var(--bird-paper); border-bottom:1px solid var(--ink); }
.bird-analysis-register,.bird-analysis-foot { min-height:43px; padding:0 var(--gutter); display:flex; align-items:center; justify-content:space-between; gap:20px; }
.bird-analysis-register span:first-child { color:#6d6962; }
.bird-analysis-register span:last-child { color:var(--ink); }
.bird-analysis canvas { display:block; width:100%; height:auto; max-height:68svh; min-height:430px; object-fit:fill; border-top:1px solid var(--bird-rule); border-bottom:1px solid var(--bird-rule); }
.bird-analysis-foot { font:10px/1 var(--mono); }
.bird-machine { border-bottom:1px solid var(--ink); }
.bird-transport { display:grid; grid-template-columns:1.5fr 1fr 1fr; min-height:116px; border-bottom:1px solid var(--ink); }
.bird-modes { display:grid; grid-template-columns:repeat(3,1fr); }
.bird-modes button { border-right:1px solid var(--ink); font:11px var(--mono); }
.bird-modes button[aria-pressed=true] { background:var(--bird-red); color:#fff; }
.bird-play { border-right:1px solid var(--ink); display:flex; align-items:center; justify-content:space-between; padding:0 34px; font-size:clamp(24px,3vw,42px); }
.bird-play:hover { background:var(--bird-yellow); }
.bird-transport>p { display:flex; align-items:center; padding:24px; font:10px/1.4 var(--mono); }
.bird-controls { display:grid; grid-template-columns:1.2fr repeat(4,1fr); border-bottom:1px solid var(--ink); }
.bird-controls label { min-height:138px; padding:20px; display:grid; grid-template-rows:auto 1fr auto; gap:12px; border-right:1px solid var(--ink); }
.bird-controls label:last-child { border-right:0; }
.bird-controls output { justify-self:end; font:11px var(--mono); }
.bird-controls select { align-self:end; width:100%; min-height:45px; border:0; border-top:1px solid var(--ink); background:#fff; font:15px var(--mono); }
.bird-controls input[type=range] { align-self:end; width:100%; accent-color:var(--bird-red); }
.bird-result { min-height:150px; display:grid; grid-template-columns:2fr 1fr; }
.bird-result p { padding:28px var(--gutter); display:flex; align-items:center; font-size:clamp(20px,2.3vw,38px); line-height:1; letter-spacing:-.045em; text-transform:uppercase; }
.bird-result button { border-left:1px solid var(--ink); padding:0 30px; display:flex; align-items:center; justify-content:space-between; font-size:clamp(18px,2vw,29px); text-align:left; }
.bird-result button:hover { background:var(--bird-red); color:#fff; }
.bird-result button span:last-child { font-size:1.5em; }
.bird-object { padding:35px var(--gutter); display:grid; grid-template-columns:1.1fr 2fr; gap:4vw; border-bottom:1px solid var(--ink); }
.bird-source { display:flex; flex-direction:column; gap:12px; overflow-wrap:anywhere; }
.bird-source strong { font-weight:400; text-transform:none; }
.bird-source a,.bird-object dd a { text-decoration:underline; text-underline-offset:4px; }
.bird-object dl { margin:0; display:grid; grid-template-columns:1fr 1fr; gap:24px; }
.bird-object dl div { border-top:1px solid var(--bird-rule); padding-top:9px; }
.bird-object dt { color:#67635c; }
.bird-object dd { margin:7px 0 0; text-transform:none; }
.bird-object>p { grid-column:2; max-width:80ch; line-height:1.55; text-transform:none; }
.bird-method { border-bottom:1px solid var(--ink); }
.bird-method summary { min-height:72px; padding:0 var(--gutter); display:flex; align-items:center; justify-content:space-between; cursor:pointer; }
.bird-method summary span { font-size:22px; }
.bird-method[open] summary span { transform:rotate(45deg); }
.bird-method>div { padding:0 var(--gutter) 42px; display:grid; grid-template-columns:1fr 1fr; gap:4vw; max-width:1200px; font-size:18px; line-height:1.55; }
.bird-debug { margin:0; padding:28px var(--gutter); background:#171715; color:#edff47; white-space:pre-wrap; }
.bird-midi [hidden] { display:none!important; }
@media(max-width:820px) {
  .bird-arrival { min-height:720px; padding-top:25px; }
  .bird-arrival h1 { align-self:start; margin-top:22svh; font-size:clamp(66px,24vw,112px); }
  .bird-arrival>p { justify-self:start; font-size:23px; }
  .bird-arrival-action { min-height:72px; font-size:22px; }
  .bird-library { padding-top:22px; }
  .bird-library header { grid-template-columns:1fr auto; }
  .bird-library h2 { grid-column:1/-1; grid-row:2; font-size:58px; }
  .bird-library header>p { grid-column:2; grid-row:1; }
  .bird-choice { min-height:132px; grid-template-columns:36px 1fr 30px; gap:10px; }
  .bird-choice-data { grid-column:2; }
  .bird-choice>span:last-child { grid-column:3; grid-row:1/3; }
  .bird-instrument-heading { padding-top:24px; position:relative; grid-template-columns:minmax(0,1fr); }
  .bird-instrument-heading h2 { margin-top:35px; font-size:clamp(52px,17vw,82px); line-height:.82; overflow-wrap:anywhere; }
  .bird-instrument-heading button { position:absolute; top:24px; right:var(--gutter); font-size:8px; padding-inline:10px; }
  .bird-analysis canvas { min-height:390px; width:100%; min-width:0; }
  .bird-analysis-register { font-size:8px; }
  .bird-transport { grid-template-columns:1fr; }
  .bird-modes { min-height:64px; border-bottom:1px solid var(--ink); }
  .bird-play { min-height:92px; border-right:0; border-bottom:1px solid var(--ink); }
  .bird-transport>p { min-height:54px; }
  .bird-controls { grid-template-columns:1fr 1fr; }
  .bird-controls label { min-height:120px; border-bottom:1px solid var(--ink); }
  .bird-controls label:nth-child(even) { border-right:0; }
  .bird-controls label:last-child { grid-column:1/-1; min-height:98px; border-bottom:0; }
  .bird-result { grid-template-columns:1fr; }
  .bird-result p { min-height:130px; }
  .bird-result button { min-height:90px; border-left:0; border-top:1px solid var(--ink); }
  .bird-object { grid-template-columns:1fr; }
  .bird-object>p { grid-column:1; }
  .bird-method>div { grid-template-columns:1fr; }
}
@media(max-width:430px) {
  .bird-choice strong { font-size:22px; }
  .bird-choice-data { font-size:8px; }
  .bird-analysis-foot { font-size:8px; }
  .bird-object dl { grid-template-columns:1fr; }
}
@media(prefers-reduced-motion:reduce) {
  .bird-midi * { scroll-behavior:auto!important; transition-duration:1ms!important; }
}

/* An open flight corridor keeps the birds away from chart and tap targets. */
.bird-flight {position:relative;height:210px;overflow:hidden;border-bottom:1px solid var(--bird-rule);background:#f7f4e9;pointer-events:none;contain:layout paint;}
.bird-flight-scene {display:block;width:100%;height:210px;overflow:hidden;}
.bird-flight-caption,.bird-flight-credit {position:absolute;top:16px;left:var(--gutter);font:8px var(--mono);letter-spacing:.08em;color:#777566;}
.bird-flight-credit {top:auto;bottom:12px;left:auto;right:var(--gutter);font:italic 12px Georgia,serif;letter-spacing:0;}
.bird-perch {fill:none;stroke:#b8b4a1;stroke-width:1;}
.bird-song {fill:none;stroke:var(--bird-red);stroke-width:1;opacity:0;}
.bird-song text {stroke:none;fill:var(--bird-red);font:10px var(--mono);}
.bird-portrait {overflow:visible;}
@media(prefers-reduced-motion:reduce){.bird-flight * {transition:none!important;animation:none!important;}}

/* The flock shares the page's air, while every control remains above it. */
.bird-airspace {position:fixed;inset:0;width:100vw;height:100svh;z-index:8;pointer-events:none;overflow:hidden;contain:strict;}
.bird-airspace[hidden] {display:none;}
.bird-air-song {fill:none;stroke:#d62d20;stroke-width:1.8;opacity:0;}
.bird-air-song text {stroke:none;fill:#d62d20;font:14px var(--mono);}
.bird-flight-away [data-bird-flight-carrier],.bird-flight-away .bird-song {visibility:hidden;}
.bird-midi button:focus-visible {outline:2px solid var(--bird-red);outline-offset:4px;}
@media(prefers-reduced-motion:reduce){.bird-airspace{display:none!important;}}