{"version":3,"sourceRoot":"","sources":["ai-agents-research.scss"],"names":[],"mappings":"CAQA,YACE,eAEA,cACE,qBAGF,eACE,iBAIJ,eACE,eAEA,wCACA,2EAIF,gBACE,eAEA,kCACE,cACA,qBACA,SAEA,gDACE,4CACA,mBAGF,sCACE,cACA,WACA,YACA,mBAIJ,gCACE,aACA,gDACA,UACA,eACA,UACA,gBAGF,mBACE,kBACA,0BACA,iEACA,mBACA,uDAIF,8BACE,YACA,kBACA,QACA,YACA,YACA,2BACA,6BACA,kBAGF,6BACE,cACA,mBACA,6BACA,gBACA,gBACA,cAGF,mBACE,gBACA,iBACA,iBAGF,kBACE,SACA,eACA,gBAGF,2BACE,gBACA,gBAKJ,WACE,kBACA,0BACA,oDACA,4BACA,uDAEA,aACE,SAGF,gCACE,cACA,mBACA,6BACA,gBACA,iBAKJ,WACE,eAEA,cACE,SACA,UACA,gBAGF,cACE,gBACA,oEAEA,yBACE,uEAIJ,aACE,SAGF,gCACE,cACA,mBAIF,qBACE,oBACA,mBACA,yDACA,6BACA,gBACA,mCACA,2BAKJ,cACE,eAEA,iBACE,SACA,UACA,gBACA,qBAGF,iBACE,aACA,2CACA,UACA,eACA,oBACA,iEACA,mBACA,uDACA,yBAEA,yBACE,8CACA,6BACA,gBACA,gBACA,cAIJ,gBACE,SAIJ,oBACE,qBACA,gEACA,qBAEA,kCACE,4CACA,mBAKF,0BACE,eACA,mBACA,gBACA,eACA,gBAGF,4BACE,oBACA,gBACA,gBAGF,8CACE,mBACA,yBAGF,6CACA,8CACA,8CACA,8CAEA,0CACE,cACA,oBAKJ,mBACE,kBACA,cACA,kBACA,iCACA,kBACA,iEACA,mBACA,mCACA,yBACA,wCACA,gBACA,iBACA,uBAEA,2BACE,aAIJ,mBACE,uBAEA,8BACE,aACA,WACA,mBAGF,oCACE,aACA,mBACA,6BAGF,qCACE,YAOJ,qCACE,gCACE,kBACA,UACA,WACA,YACA,gBACA,sBAIJ,aACE,gDAGF,qCAEI,+CAEA,gCACE,0BAGF,8BACE,YACA,WACA,OACA,WACA,kBACA,gBAMN,mBACE,aACA,eACA,iBACA,iBACA,gBAEA,wCACE,gBACA","sourcesContent":["// Consume the shared light/dark palette when present. Fallbacks preserve the\n// existing gold-on-charcoal theme until the shared theme change lands.\n$gold: #ceb888;\n$gold-bold: #d4c294;\n\n// Reading layout. The theme's centred column is 65em wide and puts 2em after every\n// paragraph; narrow the whole column (title, text, figure, and tables alike) to\n// about 100 characters per line and tighten the gaps.\n#one > .inner {\n  max-width: 48em;\n\n  > p {\n    margin-bottom: 1.25em;\n  }\n\n  > h2 {\n    margin-top: 1.5em;\n  }\n}\n\n.article-cover {\n  margin: 1.5em 0;\n\n  a { display: block; border: 0; }\n  img { display: block; width: 100%; height: auto; border-radius: 0.5em; }\n}\n\n// Sizes use em so the figure scales with the theme's body font, which grows on wide screens.\n.research-setup {\n  margin: 2.5em 0;\n\n  .research-diagram {\n    display: block;\n    margin-bottom: 1.25em;\n    border: 0;\n\n    &:focus-visible {\n      outline: 2px solid var(--highlight, #{$gold-bold});\n      outline-offset: 4px;\n    }\n\n    img {\n      display: block;\n      width: 100%;\n      height: auto;\n      border-radius: 0.5em;\n    }\n  }\n\n  .research-steps {\n    display: grid;\n    grid-template-columns: repeat(3, minmax(0, 1fr));\n    gap: 2.5em;\n    margin: 0 0 1em;\n    padding: 0;\n    list-style: none;\n  }\n\n  li {\n    position: relative;\n    padding: 1.4em 1.5em 1.5em;\n    border: 1px solid var(--accent-border, rgba($gold, 0.25));\n    border-radius: 0.5em;\n    background: var(--accent-bg, rgba($gold, 0.05));\n  }\n\n  // Arrow centered in the gap before each step after the first.\n  li + li::before {\n    content: \"\\2192\";\n    position: absolute;\n    top: 50%;\n    left: -2.5em;\n    width: 2.5em;\n    transform: translateY(-50%);\n    color: var(--accent, #{$gold-bold});\n    text-align: center;\n  }\n\n  .step-number {\n    display: block;\n    margin-bottom: 0.5em;\n    color: var(--accent, #{$gold-bold});\n    font-size: 1.6em;\n    font-weight: 700;\n    line-height: 1;\n  }\n\n  h3 {\n    margin: 0 0 0.6em;\n    font-size: 1.05em;\n    line-height: 1.35;\n  }\n\n  p {\n    margin: 0;\n    font-size: 0.9em;\n    line-height: 1.6;\n  }\n\n  figcaption {\n    font-size: 0.85em;\n    line-height: 1.6;\n  }\n}\n\n// An objection, set as a pull quote, followed by our response.\n.objection {\n  margin: 0 0 1.75em;\n  padding: 1.1em 1.4em 1.2em;\n  border-left: 3px solid var(--accent-border, #{$gold-bold});\n  border-radius: 0 0.5em 0.5em 0;\n  background: var(--accent-bg, rgba($gold, 0.05));\n\n  p {\n    margin: 0;\n  }\n\n  p > strong:first-child {\n    display: block;\n    margin-bottom: 0.5em;\n    color: var(--accent, #{$gold-bold});\n    font-size: 1.1em;\n    line-height: 1.45;\n  }\n}\n\n// Question-and-position list; each position is highlighted in its own words.\n.positions {\n  margin: 0 0 2em;\n\n  ul {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n  }\n\n  li {\n    padding: 1.2em 0;\n    border-top: 1px solid var(--accent-border, rgba($gold, 0.2));\n\n    &:last-child {\n      border-bottom: 1px solid var(--accent-border, rgba($gold, 0.2));\n    }\n  }\n\n  p {\n    margin: 0;\n  }\n\n  p > strong:first-child {\n    display: block;\n    margin-bottom: 0.4em;\n  }\n\n  // Highlighter mark using the active accent palette.\n  .position {\n    padding: 0.05em 0.25em;\n    border-radius: 0.2em;\n    background: var(--accent-mark, rgba($gold, 0.16));\n    color: var(--accent, #{$gold-bold});\n    font-weight: 600;\n    -webkit-box-decoration-break: clone;\n    box-decoration-break: clone;\n  }\n}\n\n// Numbered action cards, echoing the step numbers in Figure 1.\n.action-steps {\n  margin: 0 0 2em;\n\n  ol {\n    margin: 0;\n    padding: 0;\n    list-style: none;\n    counter-reset: action;\n  }\n\n  li {\n    display: grid;\n    grid-template-columns: 2.2em minmax(0, 1fr);\n    gap: 0 1em;\n    margin: 0 0 1em;\n    padding: 1.2em 1.4em;\n    border: 1px solid var(--accent-border, rgba($gold, 0.25));\n    border-radius: 0.5em;\n    background: var(--accent-bg, rgba($gold, 0.05));\n    counter-increment: action;\n\n    &::before {\n      content: counter(action, decimal-leading-zero);\n      color: var(--accent, #{$gold-bold});\n      font-size: 1.6em;\n      font-weight: 700;\n      line-height: 1;\n    }\n  }\n\n  p {\n    margin: 0;\n  }\n}\n\n.research-inventory {\n  margin-bottom: 2.5rem;\n  border: 1px solid var(--accent-border, rgba($gold, 0.2));\n  border-radius: 0.25rem;\n\n  &:focus-visible {\n    outline: 2px solid var(--highlight, #{$gold-bold});\n    outline-offset: 3px;\n  }\n\n  // Sized in em so the table fits the 48em reading column and scales with the body\n  // font; narrower screens scroll the table sideways instead of squeezing it.\n  table {\n    min-width: 36em;\n    table-layout: fixed;\n    margin-bottom: 0;\n    font-size: 0.9em;\n    line-height: 1.7;\n  }\n\n  caption {\n    padding: 0.75rem 1rem;\n    text-align: left;\n    font-weight: 600;\n  }\n\n  th, td {\n    vertical-align: top;\n    overflow-wrap: break-word;\n  }\n\n  th:nth-child(1) { width: 6%; }\n  th:nth-child(2) { width: 64%; }\n  th:nth-child(3) { width: 16%; }\n  th:nth-child(4) { width: 14%; }\n\n  td > strong:first-child {\n    display: block;\n    margin-bottom: 0.5rem;\n  }\n}\n\n// Popup created by assets/js/reference-previews.js.\n.reference-preview {\n  position: absolute;\n  z-index: 10001;\n  width: max-content;\n  max-width: min(30em, calc(100vw - 16px));\n  padding: 0.75em 1em;\n  border: 1px solid var(--accent-border, rgba($gold, 0.35));\n  border-radius: 0.4em;\n  background: var(--surface, #242424);\n  color: var(--fg, #{$gold});\n  box-shadow: 0 0.5em 1.5em rgba(0, 0, 0, 0.45);\n  font-size: 0.85em;\n  line-height: 1.55;\n  overflow-wrap: anywhere;\n\n  &[hidden] {\n    display: none;\n  }\n}\n\n#refs.csl-bib-body {\n  overflow-wrap: anywhere;\n\n  .csl-entry {\n    display: flex;\n    gap: 0.75rem;\n    margin-bottom: 1rem;\n  }\n\n  .csl-left-margin {\n    flex: 0 0 2em;\n    white-space: nowrap;\n    color: var(--accent, #{$gold-bold});\n  }\n\n  .csl-right-inline {\n    min-width: 0;\n  }\n}\n\n// The diagram contains the same complete wording as the ordered list.\n// Show it once on desktop; retain selectable, stacked text on phones and in print.\n// Clipping keeps the list available to assistive technology on desktop.\n@media screen and (min-width: 737px) {\n  .research-setup .research-steps {\n    position: absolute;\n    width: 1px;\n    height: 1px;\n    margin: -1px;\n    overflow: hidden;\n    clip-path: inset(50%);\n  }\n}\n\n@media print {\n  .research-setup .research-diagram { display: none; }\n}\n\n@media screen and (max-width: 736px) {\n  .research-setup {\n    .research-diagram { display: none; }\n\n    .research-steps {\n      grid-template-columns: 1fr;\n    }\n\n    li + li::before {\n      content: \"\\2193\";\n      top: -2.5em;\n      left: 0;\n      width: 100%;\n      line-height: 2.5em;\n      transform: none;\n    }\n  }\n}\n\n// Use language names so readers can find their version without knowing English.\n.article-languages {\n  display: flex;\n  flex-wrap: wrap;\n  gap: 0.75em 1.25em;\n  margin: 0 0 1.5em;\n  font-size: 0.85em;\n\n  a[aria-current=\"page\"] {\n    font-weight: 600;\n    border-bottom-style: solid;\n  }\n}\n"],"file":"ai-agents-research.css"}