/* AI Atlas layout. Typography, colors and components come from the frozen Atlas UI. */
:root{color-scheme:light}
body{min-width:320px}
a{text-underline-offset:4px}
img,svg{max-width:100%}
svg{flex-shrink:0}
button,input,select{max-width:100%}
main{min-height:50vh}
.container{width:min(100% - 64px,var(--content-width));margin-inline:auto}
.skip-link{position:fixed;top:8px;left:16px;padding:12px 16px;background:var(--text);color:var(--surface);z-index:100;transform:translateY(-150%);border-radius:var(--radius-md)}
.skip-link:focus{transform:translateY(0)}
.sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}
.site-header{background:var(--surface);border-bottom:1px solid var(--border)}
.header-inner{min-height:80px;display:flex;align-items:center;justify-content:space-between;gap:24px;width:min(100% - 64px,var(--content-width));margin-inline:auto}
.brand{display:inline-flex;align-items:center;gap:10px;font-size:20px;line-height:28px;font-weight:600;letter-spacing:-.5px;text-decoration:none;white-space:nowrap}
.brand svg,.brand img{width:28px;height:28px}
.main-nav{display:flex;align-items:center;gap:8px;flex-wrap:wrap}
.main-nav a{display:inline-flex;align-items:center;gap:8px;min-height:44px;padding:8px 12px;color:var(--muted);text-decoration:none;border-radius:var(--radius-md)}
.main-nav a:hover,.main-nav a[aria-current=page]{background:var(--subtle);color:var(--text)}
[data-shortlist-count]{display:inline-flex;align-items:center;justify-content:center;min-width:24px;height:24px;padding:0 6px;font-size:14px;line-height:20px;border-radius:var(--radius-pill);background:var(--accent-soft);color:var(--accent)}
.page-intro{padding:40px 0 28px;display:grid;gap:12px}
.page-intro h1{max-width:900px;text-wrap:balance}
.page-intro .lead{max-width:760px;color:var(--muted)}
.eyebrow{color:var(--accent);font-size:16px;line-height:24px;font-weight:500;display:flex;gap:8px;align-items:center}
.hero-search,.search-bar{display:flex;gap:12px;max-width:820px;margin-top:8px;align-items:flex-end}
.hero-search .field,.hero-search .search-field,.hero-search input,.search-bar .field,.search-bar .search-field{flex:1;min-width:0}
.hero-search .btn,.search-bar .btn{min-height:48px}
.hero-search input{min-height:48px}
.home-search{display:flex;align-items:center;gap:12px;max-width:820px;width:100%;margin-top:8px}
.home-search .search-field{flex:1;min-width:0}
.home-search>.btn{min-height:48px;flex:none}
.btn-primary img.icon{filter:invert(1)}
.section-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.section-heading h2{font-size:24px;line-height:32px;letter-spacing:-.6px}
.section-heading .eyebrow{margin-bottom:4px}
.section{margin-block:32px}
.section-header,.results-heading{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;margin-bottom:16px}
.section-header h2,.results-heading h2{font-size:24px;line-height:32px;letter-spacing:-.6px}
.section-header p,.results-heading p{color:var(--muted)}
.stack{display:grid;gap:16px}
.stack-sm{display:grid;gap:8px}
.collection-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}
.collection-link{display:flex;align-items:center;gap:12px;border:1px solid var(--border);border-radius:var(--radius-md);background:var(--surface);padding:18px 20px;min-height:80px;text-decoration:none;transition:border-color var(--duration-fast),background var(--duration-fast)}
.collection-link:hover{border-color:var(--border-strong);background:var(--subtle)}
.collection-link>svg,.collection-link>img{width:24px;height:24px;color:var(--accent);flex:none}
.collection-link>span,.collection-link>div{min-width:0}
.collection-link strong{display:block;font-size:16px;line-height:24px}
.collection-link p{color:var(--muted);font-size:16px;line-height:24px}
.collection-link small,.collection-link .count{color:var(--muted);font-size:14px;line-height:20px}
.collection-link .count{margin-left:auto;white-space:nowrap}
.collection-link h3{font-size:20px;line-height:28px;letter-spacing:-.3px;margin-bottom:6px}
.collection-link>img:last-child{margin-left:auto;width:20px;height:20px}
.collection-link .caption{display:block;margin-top:8px;color:var(--muted)}
.results-panel>.collection-grid{margin-bottom:24px}
.sidebar-note{margin-top:24px;padding-top:20px;border-top:1px solid var(--border);display:grid;gap:12px}
.sidebar-note h3{margin-bottom:0}
.method-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px;padding-top:24px;border-top:1px solid var(--border)}
.method-strip>div{display:grid;gap:8px;align-content:start}
.method-strip h3{font-size:20px;line-height:28px;letter-spacing:-.3px}
.directory-layout{display:grid;grid-template-columns:220px minmax(0,1fr);gap:32px;align-items:start;margin-block:4px 40px}
.sidebar{min-width:0}
.sidebar h2,.sidebar h3{font-size:16px;line-height:24px;font-weight:600;letter-spacing:0;margin:0 0 10px}
.sidebar .section{margin:24px 0}
.sidebar .section:first-child{margin-top:0}
.category-nav{display:grid;gap:4px}
.nav-item{display:flex;align-items:center;gap:10px;padding:10px 12px;min-height:44px;border-radius:var(--radius-md);color:var(--muted);text-decoration:none}
.nav-item .count{margin-left:auto;font-size:14px;line-height:20px}
.nav-item:hover{background:var(--subtle);color:var(--text)}
.nav-item.active,.nav-item[aria-current=page]{color:var(--accent);background:var(--accent-soft);font-weight:500}
.nav-item svg,.nav-item img{height:20px;width:20px;flex:none}
.results-panel{min-width:0}
.tool-list{display:grid;gap:0;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);overflow:hidden}
.tool-row{display:flex;align-items:flex-start;gap:16px;padding:24px;border-bottom:1px solid var(--border);min-width:0}
.tool-row:last-child{border-bottom:0}
.tool-symbol{display:flex;align-items:center;justify-content:center;flex:0 0 44px;width:44px;height:44px;background:var(--subtle);color:var(--accent);border:1px solid var(--border);border-radius:var(--radius-md);font-size:20px;line-height:28px;font-weight:500}
.tool-symbol svg,.tool-symbol img{width:24px;height:24px}
.tool-info{min-width:0;flex:1}
.tool-heading{display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin-bottom:6px}
.tool-heading h2,.tool-heading h3,.tool-heading>a{font-size:20px;line-height:28px;font-weight:600;letter-spacing:-.3px;overflow-wrap:anywhere}
.tool-heading a{text-decoration:none}
.tool-heading a:hover{text-decoration:underline}
.tool-info>p{color:var(--muted);font-size:16px;line-height:24px;overflow-wrap:anywhere}
.tool-meta{display:flex;gap:8px;align-items:center;flex-wrap:wrap;margin-top:12px;color:var(--muted);font-size:14px;line-height:20px}
.tool-meta a:hover{color:var(--text)}
.tool-actions{display:flex;gap:8px;align-items:center;flex-wrap:wrap;flex-shrink:0}
.tool-actions .btn{padding-inline:12px}
[data-shortlist][aria-pressed=true]{color:var(--accent);border-color:var(--accent);background:var(--accent-soft)}
.breadcrumbs{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding-top:24px;color:var(--muted);font-size:14px;line-height:20px;overflow-wrap:anywhere}
.breadcrumbs ol{display:flex;flex-wrap:wrap;gap:8px;list-style:none;margin:0;padding:0}
.breadcrumbs li{display:flex;gap:8px;align-items:center}
.breadcrumbs a{text-decoration:none}
.breadcrumbs a:hover{text-decoration:underline}
.breadcrumbs+.page-intro{padding-top:24px}
.product-layout{display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:32px;align-items:start;margin-bottom:40px}
.product-main,.product-aside{min-width:0}
.product-intro{grid-template-columns:auto minmax(0,1fr);align-items:center;gap:20px}
.product-intro>div:last-child{display:grid;gap:8px}
.product-symbol{height:64px;width:64px;display:flex;align-items:center;justify-content:center;background:var(--accent-soft);border:1px solid var(--border);border-radius:var(--radius-lg)}
.product-symbol img{width:32px;height:32px}
.task-links,.source-links,.action-row{display:flex;align-items:center;gap:12px;flex-wrap:wrap;margin-block:16px}
.command-block{display:grid;gap:8px;margin-block:16px;justify-items:start;min-width:0}
.command-block pre{width:100%;margin:0}
.guide{display:grid;gap:12px}
.guide h2{font-size:24px;line-height:32px;letter-spacing:-.6px}
.prose{max-width:820px}
.prose h2{font-size:24px;line-height:32px;letter-spacing:-.6px;margin-bottom:12px}
.prose p+p{margin-top:12px}
.product-main>.section:first-child,.product-aside>.section:first-child{margin-top:0}
.product-main h2,.product-aside h2{font-size:24px;line-height:32px;letter-spacing:-.6px;margin-bottom:12px}
.product-main h3{font-size:20px;line-height:28px;letter-spacing:-.3px;margin-bottom:8px}
.product-main p+p{margin-top:12px}
.product-main ul,.product-main ol{padding-left:24px}
.product-main li+li{margin-top:8px}
.product-aside{display:grid;gap:16px}
.product-aside>.panel,.product-aside>.section,.product-aside>.card{padding:24px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);margin:0}
.product-aside .btn{width:100%;white-space:normal;text-align:center}
.product-aside .btn+.btn{margin-top:8px}
.product-aside .tool-meta{margin-top:16px}
.detail-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 24px;margin:0}
.fact{padding:16px 0;border-bottom:1px solid var(--border);min-width:0}
.fact dt,.fact .fact-label{font-size:14px;line-height:20px;color:var(--muted);margin-bottom:4px}
.fact dd{margin:0;overflow-wrap:anywhere}
.fact a{overflow-wrap:anywhere}
.product-aside .detail-grid{grid-template-columns:1fr}
.product-aside .fact:first-child{padding-top:0}
.product-aside .fact:last-child{border:0;padding-bottom:0}
.command{display:flex;align-items:flex-start;gap:12px;background:var(--subtle);border:1px solid var(--border);border-radius:var(--radius-md);padding:16px}
.command code,.command pre{flex:1;min-width:0;overflow-wrap:anywhere;white-space:pre-wrap;margin:0;font-size:16px;line-height:24px}
pre{padding:16px;background:var(--subtle);border-radius:var(--radius-md);overflow-x:auto;max-width:100%;font-size:16px;line-height:24px}
code{font-family:var(--font-mono);overflow-wrap:anywhere}
#search-form{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px;align-items:end;margin:0 0 24px;padding:24px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface)}
#search-form>.search-field,#search-form>.search-query,#search-form>.field:first-child{grid-column:1 / -2}
#search-form>.field{min-width:0}
#search-form input,#search-form select{width:100%}
#search-form>.btn{min-height:48px}
#search-form>.query-field{grid-column:1 / 4;grid-row:1}
#search-form>.field:not(.query-field):not(.sort-field){grid-row:2}
#search-form>.sort-field{grid-column:1;grid-row:3}
#search-form>button[type=submit]{grid-column:4;grid-row:1}
#search-form>[data-reset-search]{grid-column:2 / -1;grid-row:3;justify-self:start}
#search-status,#compare-status{color:var(--muted);margin-bottom:16px}
.search-help{margin:12px 0 24px;color:var(--muted)}
.empty-state{border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface)}
.empty-state h2{font-size:24px;line-height:32px;letter-spacing:-.6px}
.empty-state p{color:var(--muted)}
.compare-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(240px,1fr));gap:16px;margin-bottom:32px;align-items:start}
.compare-card{padding:24px;border:1px solid var(--border);border-radius:var(--radius-lg);background:var(--surface);min-width:0;display:grid;gap:16px}
.compare-card h2{font-size:24px;line-height:32px;letter-spacing:-.6px;overflow-wrap:anywhere}
.compare-card h2 a{text-decoration:none}
.compare-card h2 a:hover{text-decoration:underline}
.compare-card p{color:var(--muted)}
.compare-card dl{margin:0}
.compare-card .fact{padding:12px 0}
.compare-card .fact:first-child{padding-top:0}
.compare-card .fact:last-child{border:0;padding-bottom:0}
.compare-card .btn{white-space:normal}
.compare-card .card-actions{display:grid;gap:8px}
.compare-setup{display:grid;gap:12px;border-top:1px solid var(--border);padding-top:16px}
.compare-setup h3{font-size:20px;line-height:28px;margin:0}
.editorial{max-width:820px}
.editorial h2{font-size:24px;line-height:32px;letter-spacing:-.6px;margin:28px 0 12px}
.editorial h3{font-size:20px;line-height:28px;margin:20px 0 8px}
.editorial p+p{margin-top:12px}
.editorial li+li{margin-top:8px}
.site-footer{margin-top:48px;border-top:1px solid var(--border);background:var(--surface)}
.footer-inner{width:min(100% - 64px,var(--content-width));margin-inline:auto;padding:28px 0;display:flex;align-items:flex-start;justify-content:space-between;gap:24px}
.footer-inner p{color:var(--muted);max-width:65ch;font-size:14px;line-height:20px}
.footer-inner nav{display:flex;flex-wrap:wrap;gap:8px 20px;flex-shrink:0}
.footer-inner nav a{display:inline-flex;align-items:center;min-height:44px}
.footer-inner .brand{margin-bottom:8px}
@media(min-width:1100px){.sidebar{position:sticky;top:24px}}
@media(max-width:1050px){.tool-row{flex-wrap:wrap}.tool-actions{margin-left:60px;flex-basis:calc(100% - 60px)}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.directory-layout{grid-template-columns:200px minmax(0,1fr);gap:24px}.product-layout{grid-template-columns:minmax(0,1fr) 280px;gap:24px}}
@media(max-width:760px){.container,.header-inner,.footer-inner{width:calc(100% - 32px)}.header-inner{min-height:72px;padding-block:12px;gap:12px;flex-wrap:wrap}.main-nav{gap:0}.main-nav a{padding:8px 10px}.page-intro{padding:28px 0 24px}.page-intro h1{font-size:32px;line-height:40px;letter-spacing:-1px}.directory-layout{grid-template-columns:1fr;gap:24px}.sidebar .category-nav{display:flex;flex-wrap:wrap;gap:4px}.sidebar>.section{margin:12px 0}.sidebar .nav-item{padding:8px 12px}.sidebar .nav-item .count{margin-left:0}.product-layout{grid-template-columns:1fr}.product-aside{grid-row:1}.product-aside .detail-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.product-aside .fact:first-child{padding-top:16px}.collection-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.collection-link{padding:16px;align-items:flex-start}.tool-row{padding:20px;gap:12px}.tool-actions{margin-left:56px;flex-basis:calc(100% - 56px)}.section{margin-block:24px}#search-form{padding:20px;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}#search-form>.search-field,#search-form>.search-query,#search-form>.field:first-child{grid-column:1 / -1}.footer-inner{flex-direction:column;gap:16px}.site-footer{margin-top:32px}}
@media(max-width:480px){.brand{font-size:20px}.main-nav{width:100%;justify-content:space-between}.main-nav a{padding-inline:8px}.hero-search,.search-bar{flex-wrap:wrap}.hero-search .field,.hero-search .search-field,.hero-search input,.search-bar .field,.search-bar .search-field{flex-basis:100%}.hero-search>.btn,.search-bar>.btn{width:100%}.collection-grid{grid-template-columns:1fr}.collection-link{align-items:center}.tool-row{padding:16px}.tool-symbol{flex-basis:40px;width:40px;height:40px}.tool-heading{gap:8px}.tool-actions{margin-left:52px;flex-basis:calc(100% - 52px)}.tool-actions .btn{flex:1;white-space:normal;text-align:center}.detail-grid,.product-aside .detail-grid{grid-template-columns:1fr}.product-aside>.panel,.product-aside>.section,.product-aside>.card{padding:20px}.section-header{gap:8px}.command{flex-wrap:wrap}.command code,.command pre{flex-basis:100%}.compare-grid{grid-template-columns:1fr}#search-form{padding:16px}.btn{white-space:normal;text-align:center}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*,*::before,*::after{animation:none!important;transition:none!important}}
@media(max-width:760px){.method-strip{grid-template-columns:1fr;gap:20px}.method-strip>div{grid-template-columns:24px minmax(0,1fr);gap:6px 12px}.method-strip>div>img{grid-row:1 / 3}.method-strip p{grid-column:2}.product-intro{gap:16px}.product-symbol{width:52px;height:52px}.product-symbol img{width:24px;height:24px}#search-form>.query-field{grid-column:1 / -1;grid-row:auto}#search-form>.field:not(.query-field):not(.sort-field){grid-row:auto}#search-form>.sort-field{grid-column:auto;grid-row:auto}#search-form>button[type=submit]{grid-column:auto;grid-row:auto}#search-form>[data-reset-search]{grid-column:auto;grid-row:auto;justify-self:stretch}.section-heading{gap:12px}.footer-inner nav{flex-shrink:1}}
@media(max-width:480px){.home-search{flex-wrap:wrap}.home-search .search-field{flex-basis:100%}.home-search>.btn{width:100%}.product-intro{grid-template-columns:1fr}.section-heading h2{font-size:24px;line-height:32px}}

.component-list{margin:0;padding-left:24px;overflow-wrap:anywhere}
.component-list li+li{margin-top:8px}

.product-main .component-list{margin-block:12px}
#components>.link{display:inline-flex;margin-top:12px}