/* Every rule is scoped to lot 1; Explorer and the shared shell keep their CSS. */
.ux-lot1 .ux-icon{width:1.4rem;height:1.4rem;flex-shrink:0;vertical-align:middle}
.ux-lot1 :is(.ux-provider,.ux-provider-panel,.ux-contact-card,.ux-demo,.ux-access-guide){box-sizing:border-box;min-width:0}
.ux-lot1 [hidden]{display:none!important}
.ux-lot1 :is(button,.ux-action){font:inherit;font-size:1rem;line-height:1.45}
.ux-lot1 button{cursor:pointer}
.ux-lot1 button:disabled{cursor:default;opacity:.65}
.ux-lot1 :is(a,button,input,summary):focus-visible{outline:3px solid var(--focus);outline-offset:4px}
.ux-lot1 :is(a,button).ux-action{display:inline-flex;gap:.6rem;align-items:center;justify-content:center;min-height:48px;max-width:100%;padding:.75rem 1rem;border:1px solid var(--action);border-radius:9px;background:var(--action);color:var(--bg);text-decoration:none;white-space:normal;text-align:center;overflow-wrap:anywhere;font-weight:650}
.ux-lot1 :is(a,button).ux-action:is(:hover,:visited){color:var(--bg)}
.ux-lot1 .ux-action:hover{background:var(--action-hover)}
html[data-theme=dark] .ux-lot1 :is(.ux-action,.ux-action:visited,.ux-action:hover){color:var(--bg)}
.ux-lot1 .ux-meta{font-size:.875rem;color:var(--muted);line-height:1.55;margin:.65rem 0}
.ux-lot1 .ux-kicker{color:var(--accent-ink);font-size:.875rem;font-weight:650;margin:0 0 .4rem}
.ux-lot1 .ux-platform-browser{margin:0 0 2rem}
.ux-lot1 .ux-filters{display:flex;flex-wrap:wrap;gap:.5rem;margin-bottom:1rem}
.ux-lot1 .ux-filters button{display:inline-flex;align-items:center;gap:.4rem;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:999px;min-height:44px;padding:.5rem .9rem;font-size:.875rem}
.ux-lot1 .ux-filters button[aria-pressed=true]{background:var(--action);color:var(--bg);border-color:var(--action)}
.ux-lot1 .ux-filters .ux-icon{width:1.1rem;height:1.1rem}
.ux-lot1 .ux-platform-workspace{display:grid;gap:1.5rem;align-items:start}
.ux-lot1 .ux-provider-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.7rem;align-items:stretch}
.ux-lot1 .ux-provider{display:flex;flex-direction:column;gap:.75rem;min-height:148px;padding:1rem;border:1px solid var(--line);border-radius:12px;background:var(--surface);color:var(--ink);text-decoration:none;position:relative;overflow-wrap:anywhere}
.ux-lot1 .ux-provider:visited{color:var(--ink)}
html[data-theme=dark] .ux-lot1 :is(.ux-provider,.ux-provider:visited){color:var(--ink)}
.ux-lot1 .ux-provider:hover{border-color:var(--accent);background:var(--surface-soft)}
.ux-lot1 .ux-provider[aria-current=true]{border-color:var(--accent-ink);box-shadow:inset 0 0 0 1px var(--accent-ink);background:var(--surface-soft)}
.ux-lot1 .ux-provider strong{font-size:1.05rem;line-height:1.35}
.ux-lot1 .ux-provider small{font-size:.875rem;line-height:1.45;color:var(--muted);margin-top:auto}
.ux-lot1 .ux-tags{display:flex;flex-wrap:wrap;gap:.35rem .6rem;font-size:.875rem;color:var(--accent-ink)}
.ux-lot1 .ux-tags>span{display:inline-flex;align-items:center;flex-wrap:wrap;gap:.3rem}
.ux-lot1 .ux-tags .ux-icon{width:1.1rem;height:1.1rem}
.ux-lot1 .ux-provider-panels{display:grid;gap:1.5rem;min-width:0}
.ux-lot1 .ux-provider-panel{border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:12px;padding:1.5rem;background:var(--surface);scroll-margin-top:1rem;overflow-wrap:anywhere}
.ux-lot1 .ux-provider-panel header{padding-bottom:1rem;border-bottom:1px solid var(--line);margin-bottom:1rem}
.ux-lot1 .ux-provider-panel h2{margin:.3rem 0 .6rem;font-size:1.8rem;line-height:1.25}
.ux-lot1 .ux-provider-panel h3{font-size:1.1rem;margin:1.3rem 0 .6rem}
.ux-lot1 .ux-provider-panel p{font-size:1rem;line-height:1.65;margin:.75rem 0}
.ux-lot1 .ux-provider-panel .ux-model{font-weight:650}
.ux-lot1 .ux-provider-panel .ux-price{color:var(--muted)}
.ux-lot1 .ux-provider-panel .platform-sources{gap:.4rem 1rem;margin:1rem 0}
.ux-lot1 .ux-provider-panel .platform-sources a{display:inline-flex;align-items:center;min-height:44px;font-size:.875rem}
.ux-lot1 .ux-book-strip{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:.85rem;margin:1rem 0 1.5rem}
.ux-lot1 .ux-book{display:flex;flex-direction:column;align-items:flex-start;gap:.4rem;min-width:0;text-decoration:none;font-size:.875rem;font-weight:600;line-height:1.4}
.ux-lot1 .ux-book:hover span{text-decoration:underline}
.ux-lot1 .ux-book img{width:min(100%,96px);height:auto;aspect-ratio:1;object-fit:contain;object-position:left center;border-radius:6px;background:var(--surface-soft)}
.ux-lot1 .ux-book small{font-size:.75rem;font-weight:400;color:var(--muted)}
.ux-lot1 .ux-demo-steps{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:.75rem;margin:0 0 1rem}
.ux-lot1 .ux-demo-steps button{display:flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:.65rem;padding:.85rem .6rem;min-height:64px;min-width:0;background:var(--surface);color:var(--ink);border:1px solid var(--line);border-radius:10px}
.ux-lot1 .ux-demo-steps button span{min-width:0;overflow-wrap:anywhere}
.ux-lot1 .ux-demo-steps small{font-size:.875rem;color:var(--muted)}
.ux-lot1 .ux-demo-steps button[aria-pressed=true]{background:var(--surface-soft);border-color:var(--accent-ink);box-shadow:inset 0 0 0 1px var(--accent-ink)}
.ux-lot1 .ux-demo{display:grid;grid-template-columns:minmax(0,160px) minmax(0,1fr);gap:1.5rem;background:var(--surface);border:1px solid var(--line);border-top:3px solid var(--accent);border-radius:12px;padding:1.5rem;align-items:start}
.ux-lot1 .ux-demo-book{display:flex;flex-direction:column;align-items:flex-start;gap:.5rem;text-decoration:none;font-size:1rem;line-height:1.45}
.ux-lot1 .ux-demo-book img{width:128px;max-width:100%;height:auto;aspect-ratio:1;object-fit:contain;object-position:left center;border-radius:8px;background:var(--surface-soft);margin-bottom:.4rem}
.ux-lot1 .ux-demo-book span{color:var(--muted);font-size:.875rem}
.ux-lot1 .ux-demo-stage{margin-bottom:1.5rem;min-width:0}
.ux-lot1.ux-enhanced .ux-demo-stage{margin-bottom:0}
.ux-lot1 .ux-demo-stage h2{font-size:1.65rem;line-height:1.3;margin:0 0 .75rem}
.ux-lot1 .ux-demo-stage p{font-size:1rem;line-height:1.6;margin:.65rem 0 1rem}
.ux-lot1 .ux-search-example{display:flex;align-items:center;gap:.75rem;padding:1rem;border:1px solid var(--line);border-radius:8px;background:var(--bg)}
.ux-lot1 .ux-demo-editions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:.75rem;margin:1.25rem 0}
.ux-lot1 .ux-demo-editions>div{display:grid;gap:.5rem;padding:1rem;background:var(--surface-soft);border-radius:8px;font-size:.875rem;line-height:1.5;overflow-wrap:anywhere}
.ux-lot1 .ux-demo-editions strong{font-size:1rem}
.ux-lot1 .ux-demo-editions small{font-size:.875rem;color:var(--muted)}
.ux-lot1 .ux-demo-note{display:flex;align-items:flex-start;gap:.5rem;font-size:.875rem;color:var(--muted);margin:1rem 0 2rem;line-height:1.6}
.ux-lot1 .ux-demo-note .ux-icon{width:1.1rem;height:1.1rem;margin-top:.15rem}
.ux-lot1 .ux-stars{display:flex;flex-wrap:wrap;gap:.35rem;margin:1.25rem 0}
.ux-lot1 .ux-stars button{padding:.5rem;min-width:44px;min-height:44px;background:var(--surface-soft);color:var(--accent-ink);border:1px solid var(--line);border-radius:8px}
.ux-lot1 .ux-stars button.ux-star-filled .ux-icon{fill:currentColor}
.ux-lot1 .ux-read{display:flex;align-items:center;gap:.7rem;min-height:44px;font-size:1rem;cursor:pointer}
.ux-lot1 .ux-read input{width:1.3rem;height:1.3rem;accent-color:var(--accent-ink);flex-shrink:0}
.ux-lot1 .ux-demo-tools{display:flex;flex-wrap:wrap;gap:.75rem;margin:.75rem 0}
.ux-lot1 .ux-demo-tools button,.ux-lot1 .ux-copy{display:inline-flex;align-items:center;justify-content:center;gap:.5rem;min-height:44px;padding:.5rem .85rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--action);white-space:normal}
.ux-lot1 .ux-demo-stage .ux-demo-status{color:var(--accent-ink);font-size:.875rem;margin:.75rem 0 0}
.ux-lot1 .ux-demo-status:empty{display:none}
.ux-lot1 .ux-demo>.ux-demo-context .ux-meta{margin:.5rem 0 0}
.ux-lot1 .ux-access-guide{background:var(--surface-soft);padding:1.5rem 2rem;border-radius:12px;margin:2rem 0}
.ux-lot1 .ux-access-guide>.ux-icon{color:var(--accent-ink);width:2rem;height:2rem}
.ux-lot1 .ux-access-guide h2{margin:.5rem 0;font-size:1.6rem}
.ux-lot1 .ux-access-guide p{max-width:85ch}
.ux-lot1 .ux-more-guide{margin:2rem 0}
.ux-lot1 :is(.ux-more-guide details,.ux-contact-info){border-top:1px solid var(--line);padding:1rem 0}
.ux-lot1 :is(.ux-more-guide summary,.ux-contact-info summary){font-size:1rem;font-weight:650;min-height:44px;cursor:pointer;line-height:1.6}
.ux-lot1 .ux-contact-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:1.25rem}
.ux-lot1 .ux-contact-card{display:flex;flex-direction:column;align-items:flex-start;padding:1.5rem;background:var(--surface);border:1px solid var(--line);border-radius:12px}
.ux-lot1 .ux-symbol{display:inline-flex;padding:.75rem;background:var(--surface-soft);color:var(--accent-ink);border-radius:10px}
.ux-lot1 .ux-symbol .ux-icon{width:1.8rem;height:1.8rem}
.ux-lot1 .ux-contact-card h2{font-size:1.4rem;line-height:1.35;margin:1rem 0 .65rem}
.ux-lot1 .ux-contact-card p{margin:0 0 1.5rem;font-size:1rem;line-height:1.65}
.ux-lot1 .ux-contact-card .ux-action{margin-top:auto}
.ux-lot1 .ux-contact-direct{display:flex;align-items:center;justify-content:space-between;gap:1.5rem 2rem;flex-wrap:wrap;padding:1.5rem 0;border-block:1px solid var(--line);margin:2rem 0}
.ux-lot1 .ux-contact-direct h2{font-size:1.6rem;margin:0 0 .4rem}
.ux-lot1 .ux-contact-direct p{margin:.5rem 0}
.ux-lot1 .ux-email{display:block;min-height:44px;font-weight:650;font-size:1.1rem;overflow-wrap:anywhere;user-select:text}
.ux-lot1 .ux-contact-info section{margin:1rem 0}
@media(min-width:1000px){
 .ux-lot1.ux-enhanced .ux-platform-workspace{grid-template-columns:minmax(0,1fr) minmax(0,1.05fr);gap:2rem}
 .ux-lot1.ux-enhanced .ux-provider-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:900px){
 .ux-lot1 .ux-contact-grid{grid-template-columns:1fr}
 .ux-lot1 .ux-contact-card{display:grid;grid-template-columns:3.5rem minmax(0,1fr);gap:0 1rem;align-items:start}
 .ux-lot1 .ux-symbol{grid-column:1;grid-row:1/3;justify-self:start}
 .ux-lot1 .ux-contact-card :is(h2,p){grid-column:2}
 .ux-lot1 .ux-contact-card h2{margin:0 0 .6rem}
 .ux-lot1 .ux-contact-card p{margin-bottom:1rem}
 .ux-lot1 .ux-contact-card .ux-action{grid-column:2;justify-self:start}
 .ux-lot1 .ux-demo{grid-template-columns:minmax(0,160px) minmax(0,1fr);gap:1.5rem;padding:1.5rem}
}
@media(max-width:600px){
 .ux-lot1 .ux-provider-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
 .ux-lot1 .ux-provider{padding:.85rem;min-height:128px;gap:.6rem}
 .ux-lot1 .ux-provider-panel{padding:1rem}
 .ux-lot1 .ux-demo-steps{grid-template-columns:repeat(2,minmax(0,1fr));gap:.6rem}
 .ux-lot1 .ux-demo-steps button{min-height:56px;justify-content:flex-start;padding:.65rem .85rem}
 .ux-lot1 .ux-demo{grid-template-columns:1fr;padding:1rem;gap:1rem}
 .ux-lot1 .ux-demo-book{display:grid;grid-template-columns:68px minmax(0,1fr);gap:.35rem .85rem}
 .ux-lot1 .ux-demo-book img{width:68px;grid-row:1/3;margin:0}
 .ux-lot1 .ux-demo-book strong{align-self:end}
 .ux-lot1 .ux-demo-book span{grid-column:2}
 .ux-lot1 .ux-demo-stage h2{font-size:1.3rem;margin-bottom:.5rem}
 .ux-lot1 .ux-demo-editions{grid-template-columns:1fr}
 .ux-lot1 .ux-access-guide{padding:1rem;margin:1.5rem 0}
 .ux-lot1 .ux-access-guide h2{font-size:1.35rem;line-height:1.3}
 .ux-lot1 .ux-demo-note{margin:.75rem 0 1.5rem}
 .ux-lot1 .ux-provider-panel .platform-sources{gap:.25rem .75rem;margin:.75rem 0}
 .ux-lot1 .ux-book-strip{gap:.75rem;margin:.75rem 0 1rem}
 .ux-lot1 .ux-contact-card{display:flex;padding:1.25rem;gap:0}
 .ux-lot1 .ux-contact-card h2{margin:1rem 0 .65rem}
 .ux-lot1 .ux-contact-card .ux-action{width:100%}
}
@media(max-width:360px){
 .ux-lot1 .ux-provider-grid{grid-template-columns:1fr}
 .ux-lot1 .ux-provider{min-height:120px}
 .ux-lot1 .ux-book-strip{grid-template-columns:repeat(2,minmax(0,1fr))}
 .ux-lot1 .ux-demo-steps button{gap:.4rem;padding:.5rem}
}
/* How it works: a single disclosure list and four visible guide destinations. */
.ux-lot1[data-ux-lot1=how] .ux-more-guide{margin:2rem 0}
.ux-lot1[data-ux-lot1=how] .ux-more-guide details{padding:.5rem 0;border:0;border-bottom:1px solid var(--line);border-radius:0;background:transparent;box-shadow:none;margin:0}
.ux-lot1[data-ux-lot1=how] .ux-more-guide summary{display:list-item;list-style-position:inside;min-height:44px;padding:.65rem 0;font-size:1rem;line-height:1.6;color:var(--ink);font-weight:650}
.ux-lot1[data-ux-lot1=how] .ux-more-guide :is(p,.guide-reference-body){font-size:1rem;line-height:1.7;max-width:90ch}
.ux-lot1[data-ux-lot1=how] .ux-guide-entry{margin:2.5rem 0;scroll-margin-top:1rem}
.ux-lot1[data-ux-lot1=how] .ux-guide-entry h2{font-size:1.6rem;line-height:1.4;margin:0 0 1rem}
.ux-lot1[data-ux-lot1=how] .ux-guide-entry nav{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:1rem}
.ux-lot1[data-ux-lot1=how] .ux-guide-entry a{display:flex;align-items:center;gap:1rem;min-width:0;min-height:64px;padding:1.1rem;border:1px solid var(--line);border-radius:8px;background:var(--surface);color:var(--action);font-size:1rem;line-height:1.6;text-decoration:none;overflow-wrap:anywhere}
.ux-lot1[data-ux-lot1=how] .ux-guide-entry a:hover{background:var(--surface-soft);border-color:var(--accent-ink)}
.ux-lot1[data-ux-lot1=how] .guide-index{color:var(--accent-ink);font-size:.875rem;flex-shrink:0}
.ux-lot1[data-ux-lot1=how] .page-actions{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:1rem;padding:1.5rem 0;margin:0 0 2rem;border-block:1px solid var(--line)}
.ux-lot1[data-ux-lot1=how] .page-actions a{min-width:0;white-space:normal;line-height:1.6;overflow-wrap:anywhere}
@media(max-width:650px){.ux-lot1[data-ux-lot1=how] .ux-guide-entry nav{grid-template-columns:1fr}.ux-lot1[data-ux-lot1=how] .ux-guide-entry h2{font-size:1.4rem}.ux-lot1[data-ux-lot1=how] .page-actions{align-items:stretch;flex-direction:column}.ux-lot1[data-ux-lot1=how] .page-actions a{display:flex;align-items:center;justify-content:center;min-height:48px;text-align:center}}