/* Theme layer: re-skins existing ph.css pages (home, recipes, lists) into the "br" light dev-infra system. Loaded after ph.css by api/page.js. */
:root{--c:#F38020;--t:#0B0F19;--m:#5B6475;--l:#E6E8EC;--bg:#FAFAFB}
body{font-family:Inter,system-ui,-apple-system,"Segoe UI",sans-serif!important;background:var(--bg);color:var(--t)}
header.ph{background:rgba(255,255,255,.82);-webkit-backdrop-filter:saturate(1.8) blur(12px);backdrop-filter:saturate(1.8) blur(12px);z-index:50}
.ph .in{max-width:1200px;padding:0 24px;min-height:60px}
.ph .logo b,.ph .links a,.ph a.sub{white-space:nowrap}
.ph .links{flex-wrap:nowrap;overflow-x:auto;scrollbar-width:none;min-width:0}
.ph .logo i{border-radius:6px;background:var(--t);font-family:"JetBrains Mono",ui-monospace,monospace;font-style:normal}
.ph .links a{font-size:14px;color:var(--m);padding:7px 10px;border-radius:6px;text-decoration:none;transition:color .15s,background-color .15s}
@media (hover:hover){.ph .links a:hover{color:var(--t);background:#F3F4F6}}
.ph .links a.br-tl{color:var(--t);font-weight:500}
.ph .srch{border:1px solid #D5D9E0;border-radius:8px;background:#fff}
.ph a.sub{border-radius:8px;background:var(--t);color:#fff;border-color:var(--t)}
main{max-width:1200px;padding:28px 24px 48px}
.hero{position:relative;padding:40px 0 24px}
.hero::before{content:"";position:absolute;inset:-28px -24px 0;z-index:-1;background-image:linear-gradient(var(--l) 1px,transparent 1px),linear-gradient(90deg,var(--l) 1px,transparent 1px);background-size:48px 48px;-webkit-mask-image:radial-gradient(ellipse 80% 90% at 30% 0,#000 20%,transparent 75%);mask-image:radial-gradient(ellipse 80% 90% at 30% 0,#000 20%,transparent 75%)}
.hero .eyebrow{font:500 12px/1 "JetBrains Mono",ui-monospace,monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--m);background:#fff;border:1px solid var(--l);border-radius:6px;padding:6px 10px}
.hero h1,h1.h{font-size:clamp(32px,4.4vw,52px);line-height:1.05;letter-spacing:-.035em;font-weight:600}
aside .card,.card{border-radius:12px;background:#fff;border-color:var(--l)}
.btn,button.up{border-radius:8px}
.chips a,.rtag{font-family:"JetBrains Mono",ui-monospace,monospace;font-size:12px;border-radius:6px}
pre,code{font-family:"JetBrains Mono",ui-monospace,monospace}
footer.pf{background:#fff}
.grid>aside.side{position:relative}
.grid>aside.side .br-sticky{position:static;margin:0 0 16px}
@media (max-width:900px){.grid>aside.side .br-sticky{position:static}
 .br-side{display:flex;gap:10px;overflow-x:auto;scroll-snap-type:x mandatory;padding-bottom:4px}
 .br-side>.br-eyebrow,.br-side>.br-more{display:none}
 .br-side .br-mini{flex:0 0 82%;scroll-snap-align:start}}
.br-inline{display:none}
@media (max-width:900px){.br-inline{display:block;margin:18px 0}.grid>aside.side .br-sticky{display:none}}
/* mobile nav overflow fix (Oct 15): links scroll inside the header, never the page */
html,body{max-width:100%}
.ph .in{flex-wrap:nowrap;min-width:0}
.ph .in>*{min-width:0}
.ph .links{flex:1 1 auto;min-width:0;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:none;-webkit-mask-image:linear-gradient(90deg,#000 85%,transparent);mask-image:linear-gradient(90deg,#000 85%,transparent)}
.ph .links::-webkit-scrollbar{display:none}
@media (max-width:640px){.ph .in{gap:8px;padding:0 12px}.ph .srch{flex:0 1 120px;min-width:0}.ph .srch input{min-width:0;width:100%}.ph .logo b{display:none}.ph a.sub{padding:7px 10px;font-size:13px}}
main,.grid,.grid>*{min-width:0}
.grid{grid-template-columns:minmax(0,1fr) 320px}
@media (max-width:900px){.grid{grid-template-columns:minmax(0,1fr)}}
pre{max-width:100%;overflow-x:auto}
/* recipe page overflow fix #2 (Oct 15, tested on preview dpl_Zwra8KeH HTML) */
header.ph,.ph .in,.mnav{max-width:100%;min-width:0}
.mnav{overflow-x:auto;overscroll-behavior-x:contain}
#wform,.crow{display:flex;flex-wrap:wrap;gap:8px;max-width:100%}
#wform input[type=email],.crow input:not(.hp),.crow textarea{flex:1 1 180px;min-width:0;max-width:100%}
#wform button,.crow button{flex:0 1 auto;max-width:100%;white-space:normal}
.side,.br-sticky,.br-inline,.br-side,.br-mini,.br-pair,.br-pair-g{max-width:100%;min-width:0}
.br-mini .br-ctas{flex-wrap:wrap}.br-mini .br-btn{flex:1 1 90px;min-width:0}
@media (max-width:900px){.br-side{overflow-x:auto;overscroll-behavior-x:contain}}

/* sidebar fix (Oct 15): tools block is a normal-flow box like the other side cards; only the last side box sticks */
.grid>aside.side .br-sticky{position:static!important;top:auto;z-index:auto;transform:none}
.grid>aside.side>.br-sticky{display:block;border:1px solid var(--l);border-radius:14px;background:#fff;padding:16px}
.grid>aside.side .br-side{display:grid;gap:10px;position:static}
.grid>aside.side .br-side>.br-eyebrow{margin:0 0 2px;display:block}
.grid>aside.side .br-mini{border:1px solid var(--l);border-top:2px solid var(--a);border-radius:10px;padding:12px;gap:8px;box-shadow:none}
.grid>aside.side .br-more{display:block;position:static;margin-top:2px}
@media (min-width:901px){.grid>aside.side>:last-child:not(.br-sticky){position:sticky;top:76px}}
@media (max-width:900px){.grid>aside.side>.br-sticky{display:none}}
/* /agents/ v3 layout (Oct 15) */
.ag-doc{min-width:0}
.ag-doc>.k{font:500 12px/1 "JetBrains Mono",ui-monospace,monospace;text-transform:uppercase;letter-spacing:.08em;color:var(--m);margin:8px 0 12px}
.ag-doc>h1{font-size:clamp(32px,4.4vw,48px);line-height:1.05;letter-spacing:-.035em;font-weight:600;margin:0 0 12px}
.ag-doc>.lead{font-size:18px;color:var(--m);line-height:1.55;margin:0 0 28px;max-width:640px}
.ag-doc h2{font-size:21px;letter-spacing:-.02em;margin:36px 0 12px;padding-top:20px;border-top:1px solid var(--l);scroll-margin-top:80px}
.ag-doc section.ag3{border:1px solid var(--l);border-radius:14px;background:#fff;padding:20px;margin:0 0 24px}
.ag-doc section.ag3 h2{border:0;padding:0;margin:0 0 6px}
.ag-doc pre{background:#0B0F19;color:#D7DCE5;border-radius:10px;padding:14px 16px;font-size:12.5px;line-height:1.65;overflow-x:auto;max-width:100%;position:relative}
.ag-doc ul.codes{list-style:none;padding:0;margin:0;border:1px solid var(--l);border-radius:12px;background:#fff;overflow:hidden}
.ag-doc ul.codes li{padding:10px 14px;border-top:1px solid var(--l);font-size:14.5px;line-height:1.5}.ag-doc ul.codes li:first-child{border-top:0}
.ag-doc ol.steps li{margin:0 0 6px}
.ag-doc :not(pre)>code{font-size:.86em;background:#F3F4F6;border:1px solid var(--l);border-radius:5px;padding:1px 5px;overflow-wrap:anywhere}
.ag-toc a{display:block;font-size:14px;color:var(--m);text-decoration:none;padding:5px 0;border-left:2px solid transparent;padding-left:10px;margin-left:-2px;transition:color .15s,border-color .15s}
@media (hover:hover){.ag-toc a:hover{color:var(--t);border-color:var(--c)}}
.ag-toc b{display:block;margin-bottom:6px}
@media (max-width:900px){.ag-toc{display:none}}