/* ── NRT Hot Topics: Agentic AI · Week 2 ─────────────────────── */
:root{
  color-scheme: light;
  --green:#18453B; --green-700:#0f2f28; --green-300:#427164;
  --accent:#C8842B; --accent-soft:#fdf3e3;
  --ink:#16211f; --ink-soft:#4d5b58; --ink-faint:#5d6a66;
  --rule:#e2e7e5; --bg:#fff; --bg-soft:#f8faf9; --bg-tint:#eff4f2;
  --radius:10px;
  --shadow:0 1px 2px rgba(22,33,31,.06), 0 8px 24px -12px rgba(22,33,31,.18);
  --sans:-apple-system,BlinkMacSystemFont,"Segoe UI",Inter,Roboto,"Helvetica Neue",Arial,sans-serif;
  --mono:ui-monospace,SFMono-Regular,"SF Mono",Menlo,Consolas,monospace;
}
*{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--sans);font-size:17px;line-height:1.65;color:var(--ink);background:var(--bg);-webkit-font-smoothing:antialiased}
.wrap{width:min(1080px,100% - 3rem);margin-inline:auto}
a{color:var(--green);text-underline-offset:3px}
a:hover{text-decoration-thickness:2px}
:focus-visible{outline:3px solid var(--accent);outline-offset:2px;border-radius:3px}
h1,h2,h3,h4{line-height:1.2;letter-spacing:-.015em;margin:0 0 .5em}
h1{font-size:clamp(1.9rem,4vw,2.6rem);font-weight:700}
h2{font-size:clamp(1.3rem,2.4vw,1.65rem);margin-top:3rem;padding-bottom:.4rem;border-bottom:1px solid var(--rule)}
h3{font-size:1.12rem;margin-top:1.8rem}
p,ul,ol{margin:0 0 1.1rem}
li+li{margin-top:.3rem}
strong{font-weight:650}
code{font-family:var(--mono);font-size:.88em;background:var(--bg-tint);padding:.12em .38em;border-radius:4px}
pre{background:#f6f8f7;border:1px solid var(--rule);border-radius:var(--radius);padding:1rem 1.1rem;overflow-x:auto;font-size:.85rem;line-height:1.55}
pre code{background:none;padding:0;font-size:inherit}
.eyebrow{font-size:.75rem;letter-spacing:.12em;text-transform:uppercase;font-weight:650;color:var(--green-300);margin:0 0 .6rem}
.lede{font-size:1.14rem;color:var(--ink-soft);max-width:64ch}
.hero-sub{font-size:clamp(1.1rem,2.1vw,1.42rem);font-weight:600;line-height:1.32;letter-spacing:-.01em;color:var(--ink-soft);max-width:52ch;margin:-.2rem 0 1rem}
.muted{color:var(--ink-soft);font-size:.95rem}
.session-line{color:var(--ink);max-width:64ch;margin:.5rem 0 0;font-size:1rem;line-height:1.6}

/* header */
.masthead{border-bottom:1px solid var(--rule);background:#fff;position:sticky;top:0;z-index:20}
/* keep section headings clear of the sticky masthead when jumping to an anchor */
section[id],[id]{scroll-margin-top:84px}
.masthead-inner{display:flex;align-items:center;gap:1rem;padding:.85rem 0}
.brand{display:flex;align-items:center;gap:.7rem;text-decoration:none;color:inherit}
.brand-mark{display:grid;place-items:center;width:38px;height:38px;border-radius:9px;background:var(--green);color:#fff;font-weight:700;font-size:.82rem;letter-spacing:.02em}
.brand-text strong{display:block;font-size:1rem;line-height:1.2}
.brand-text small{display:block;color:var(--ink-faint);font-size:.78rem}
.masthead nav{margin-left:auto;display:flex;gap:1.3rem;font-size:.92rem}
.masthead nav a{text-decoration:none;color:var(--ink-soft);font-weight:550}
.masthead nav a:hover{color:var(--green)}

/* hero */
.hero{background:linear-gradient(180deg,var(--bg-tint),#fff);border-bottom:1px solid var(--rule);padding:3rem 0 2.6rem}
.hero-logos{display:flex;align-items:center;flex-wrap:wrap;gap:2rem;margin-bottom:1.7rem}
.hero-logos img{height:68px;width:auto;max-width:100%;opacity:.92}
.hero-facts{display:flex;flex-wrap:wrap;gap:2.2rem;margin:1.8rem 0 0;padding-top:1.4rem;border-top:1px solid var(--rule)}
.hero-facts div strong{display:block;font-size:1rem}
.hero-facts div span{display:block;color:var(--ink-soft);font-size:.88rem}

/* buttons */
.btn{display:inline-flex;align-items:center;gap:.5rem;background:var(--green);color:#fff;text-decoration:none;font-weight:600;font-size:.93rem;padding:.6rem 1.1rem;border-radius:var(--radius);border:1px solid var(--green)}
.btn:hover{background:var(--green-700)}
.btn-ghost{background:#fff;color:var(--green)}
.btn-ghost:hover{background:var(--bg-tint)}
.btn[aria-disabled="true"]{background:var(--bg-tint);color:var(--ink-faint);border-color:var(--rule);pointer-events:none}

/* the four-level path */
.path{display:grid;grid-template-columns:repeat(4,1fr);gap:.6rem;margin:2rem 0 1rem}
.path div{background:var(--bg-soft);border:1px solid var(--rule);border-top:3px solid var(--green-300);border-radius:8px;padding:.85rem .9rem;position:relative}
.path div span{display:block;font-size:.72rem;letter-spacing:.1em;text-transform:uppercase;color:var(--green-300);font-weight:650;margin-bottom:.25rem}
.path div strong{font-size:.95rem;line-height:1.3;display:block}
.path div::after{content:"→";position:absolute;right:-.52rem;top:50%;transform:translateY(-50%);color:var(--ink-faint);font-size:1rem;z-index:2}
.path div:last-child::after{content:""}
@media(max-width:720px){.path{grid-template-columns:1fr}.path div::after{content:"↓";right:auto;left:50%;top:auto;bottom:-.85rem;transform:translateX(-50%)}}

/* level cards */
.level{border:1px solid var(--rule);border-radius:var(--radius);padding:1.5rem 1.6rem;margin:1.2rem 0;background:#fff;box-shadow:var(--shadow)}
.level.pending{background:var(--bg-soft);box-shadow:none}
.level-head{display:flex;align-items:flex-start;gap:1rem;margin-bottom:.9rem}
.level-num{flex:none;display:grid;place-items:center;width:42px;height:42px;border-radius:50%;background:var(--green);color:#fff;font-weight:700;font-size:1.05rem}
.level.pending .level-num{background:var(--bg-tint);color:var(--ink-faint)}
.level-head h3{margin:0;font-size:1.22rem}
.level-head p{margin:.15rem 0 0;color:var(--ink-soft);font-size:.92rem}
.level-body{display:grid;grid-template-columns:1.4fr 1fr;gap:1.6rem}
@media(max-width:760px){.level-body{grid-template-columns:1fr}}
.level-body h4{margin:0 0 .45rem;font-size:.78rem;letter-spacing:.1em;text-transform:uppercase;color:var(--green-300)}
.level-body ul{margin:0;padding-left:1.1rem;font-size:.95rem}
.level-body ul + h4{margin-top:1.3rem}
.level-body>div:first-child{min-width:0}
.demo-box{background:var(--bg-soft);border:1px solid var(--rule);border-radius:8px;padding:.95rem 1rem;align-self:start}
.demo-box .btn{width:100%;justify-content:center;margin-bottom:.5rem}
.demo-box .muted{margin:0;font-size:.8rem}
.tag{display:inline-block;font-size:.7rem;letter-spacing:.08em;text-transform:uppercase;font-weight:650;padding:.2rem .5rem;border-radius:20px;background:var(--accent-soft);color:#8a5a15;margin-left:.5rem;vertical-align:middle}

/* callout */
.callout{background:var(--accent-soft);border-left:3px solid var(--accent);border-radius:0 8px 8px 0;padding:1rem 1.2rem;margin:1.6rem 0}
.callout p:last-child{margin-bottom:0}
.note{background:var(--bg-tint);border-radius:8px;padding:1rem 1.2rem;margin:1.5rem 0}
.note p:last-child{margin-bottom:0}

/* tables */
table{width:100%;border-collapse:collapse;font-size:.92rem;margin:1.2rem 0}
th,td{text-align:left;padding:.6rem .7rem;border-bottom:1px solid var(--rule);vertical-align:top}
th{font-size:.78rem;letter-spacing:.06em;text-transform:uppercase;color:var(--green-300)}

/* footer */
footer{border-top:1px solid var(--rule);margin-top:4rem;padding:2rem 0 3rem;color:var(--ink-soft);font-size:.9rem}
main{padding:2.5rem 0 1rem}

/* guide pages */
.guide main{max-width:none}
.guide .wrap{width:min(820px,100% - 3rem)}
.steps{counter-reset:step;list-style:none;padding:0;margin:1.5rem 0}
.steps>li{counter-increment:step;position:relative;padding-left:2.6rem;margin-bottom:1.8rem}
.steps>li::before{content:counter(step);position:absolute;left:0;top:-.1rem;width:1.8rem;height:1.8rem;border-radius:50%;background:var(--green);color:#fff;display:grid;place-items:center;font-size:.85rem;font-weight:700}
.steps>li>h3{margin:0 0 .45rem;font-size:1.05rem}
.backlink{display:inline-block;margin-bottom:1.2rem;font-size:.9rem;text-decoration:none}

/* guide page head + part divider */
.pagehead{background:linear-gradient(180deg,var(--bg-tint),#fff);border-bottom:1px solid var(--rule);padding:2.4rem 0 2rem}
.pagehead h1{font-size:clamp(1.7rem,3.4vw,2.3rem);margin-bottom:.5rem}
.pagehead .hero-cta{display:flex;gap:.7rem;flex-wrap:wrap;margin:0}
.guide h2{margin-top:2.8rem}
.guide h2.partmark{margin-top:3.4rem;padding:.75rem 1rem;background:var(--green);color:#fff;border:0;border-radius:var(--radius);font-size:1.15rem}
.guide hr{margin:2.2rem 0}
.guide blockquote{margin:1.2rem 0;padding:.1rem 0 .1rem 1.1rem;border-left:3px solid var(--rule);color:var(--ink-soft)}

/* supplementary file downloads */
.files{display:grid;grid-template-columns:repeat(auto-fit,minmax(230px,1fr));gap:.9rem;margin:1.4rem 0 1.8rem}
.filecard{display:block;text-decoration:none;color:inherit;border:1px solid var(--rule);border-radius:var(--radius);padding:1rem 1.1rem;background:#fff;transition:border-color .15s,box-shadow .15s}
.filecard:hover{border-color:var(--green-300);box-shadow:var(--shadow)}
.filecard .ft{display:block;font-size:.68rem;letter-spacing:.1em;text-transform:uppercase;font-weight:650;color:var(--green-300);margin-bottom:.3rem}
.filecard strong{display:block;font-size:.97rem;line-height:1.3;margin-bottom:.3rem}
.filecard span.fd{display:block;color:var(--ink-soft);font-size:.88rem;line-height:1.5}
.warnbox{background:#fdecea;border-left:3px solid #A6342A;border-radius:0 8px 8px 0;padding:1rem 1.2rem;margin:1.5rem 0}
.warnbox p:last-child{margin-bottom:0}
.setup-paths{display:grid;grid-template-columns:1fr 1fr;gap:1rem;margin:1.2rem 0}
@media(max-width:700px){.setup-paths{grid-template-columns:1fr}}
.setup-paths>div{border:1px solid var(--rule);border-radius:var(--radius);padding:1.1rem 1.2rem;background:var(--bg-soft)}
.setup-paths h4{margin:0 0 .5rem;font-size:1rem;color:var(--ink)}
.setup-paths p:last-child{margin-bottom:0}

/* long reference tables must not push the page wider than the viewport */
.guide table{table-layout:fixed;width:100%}
.guide table th,.guide table td{word-break:break-word;overflow-wrap:anywhere}
.guide table td code,.guide table th code{white-space:normal;word-break:break-all}
.guide pre{max-width:100%}

/* long file names must not push the page sideways on a phone */
code{overflow-wrap:anywhere}
pre{overflow-x:auto;max-width:100%;min-width:0}
pre code{overflow-wrap:normal;white-space:pre}
main,.wrap,.guide main{min-width:0}
.pagehead .btn{max-width:100%;white-space:normal;text-align:center}
pre{width:100%;box-sizing:border-box}
.btn{overflow-wrap:anywhere}

/* bottom navigation on guide pages */
.guidenav{display:flex;gap:.7rem;flex-wrap:wrap;align-items:center;margin:2.6rem 0 .4rem;padding-top:1.6rem;border-top:1px solid var(--rule)}
.guidenav .btn{max-width:100%;white-space:normal;text-align:center}

/* narrow screens: let the masthead nav take its own line instead of overflowing */
@media (max-width:560px){
  .masthead-inner{flex-wrap:wrap;gap:.4rem}
  .masthead nav{margin-left:0;width:100%;gap:1.1rem;flex-wrap:wrap}
}

/* screenshots */
.shot{margin:1.1rem 0 0}
.shot a{display:block;line-height:0}
.shot img{width:100%;height:auto;display:block;border:1px solid var(--rule);border-radius:var(--radius)}
.shot figcaption{margin-top:.45rem;color:var(--ink-soft);font-size:.85rem;line-height:1.45}
.guide .shot{margin:1.4rem 0}

/* collapsible code panels in guides */
details.code{border:1px solid var(--rule);border-radius:var(--radius);margin:1.1rem 0;background:#fbfcfc}
details.code>summary{cursor:pointer;padding:.7rem .95rem;font-size:.92rem;color:var(--green);list-style:none}
details.code>summary::-webkit-details-marker{display:none}
details.code>summary::before{content:"\25B8  ";font-size:.85rem}
details.code[open]>summary::before{content:"\25BE  "}
details.code>summary:hover{background:#f1f5f3}
details.code>summary:focus-visible{outline:2px solid var(--green);outline-offset:2px}
details.code>summary code{font-size:.9em}
details.code>summary::after{content:" \2014 show the code";color:var(--ink-soft);font-size:.86em}
details.code[open]>summary::after{content:" \2014 hide"}
details.code pre{margin:0;border:0;border-top:1px solid var(--rule);border-radius:0 0 var(--radius) var(--radius)}
details.code.prose>summary::after{content:" \2014 read the walkthrough"}
details.code.prose[open]>summary::after{content:" \2014 hide"}
details.code.prose>div,details.code.prose>p,details.code.prose>ol,details.code.prose>ul{margin-left:.95rem;margin-right:.95rem}
details.code.prose>ol,details.code.prose>ul{padding-left:2.2rem}
details.code.prose>*:last-child{margin-bottom:1rem}
details.code.prose.anatomy>summary::after{content:" \2014 read the anatomy"}
details.code.prose.anatomy[open]>summary::after{content:" \2014 hide"}
details.code.prose>details.code{margin-left:.95rem;margin-right:.95rem}
details.code.prose>table,details.code.prose>pre,details.code.prose>h4,details.code.prose>figure{margin-left:.95rem;margin-right:.95rem}
details.code.prose>table{width:calc(100% - 1.9rem)}
details.code.prose.optional>summary::after{content:" \2014 show the commands"}
details.code.prose.optional[open]>summary::after{content:" \2014 hide"}
details.code.prose.optional>summary{font-size:1rem}
details.code.prose>h3{margin-left:.95rem;margin-right:.95rem}

/* collapsible week panels (index) */
details.wk{border:1px solid var(--rule);border-radius:var(--radius);margin:.85rem 0;background:#fff}
details.wk[open]{box-shadow:var(--shadow)}
details.wk>summary{cursor:pointer;list-style:none;display:flex;align-items:center;gap:.65rem;padding:.95rem 1.1rem;font-weight:650;font-size:1.02rem;color:var(--ink)}
details.wk>summary::-webkit-details-marker{display:none}
details.wk>summary::before{content:"+";flex:none;display:grid;place-items:center;width:22px;height:22px;border-radius:50%;border:1px solid var(--green-300);color:var(--green);font-size:.95rem;font-weight:700;line-height:1}
details.wk[open]>summary::before{content:"\2212"}
details.wk>summary:hover{background:var(--bg-soft)}
details.wk>summary:focus-visible{outline:2px solid var(--green);outline-offset:2px}
details.wk>summary .sum-note{margin-left:auto;font-weight:450;font-size:.84rem;color:var(--ink-soft);text-align:right}
details.wk>.wk-body{padding:.2rem 1.1rem 1.2rem;border-top:1px solid var(--rule)}
details.wk>.wk-body>h3:first-child{margin-top:1.1rem}
.opennote{color:var(--ink-soft);font-size:.95rem;margin-top:.9rem}
.opennote strong{color:var(--ink)}
@media(max-width:620px){details.wk>summary{font-size:.97rem}details.wk>summary .sum-note{display:none}}
