/* Steadline account shell and marketplace pages (2026-10-26). White and light-grey surfaces, dark text, one blue for primary actions. */
.ash-body{background:#F6F7F9}
.ash{display:grid;grid-template-columns:248px minmax(0,1fr);min-height:100vh}
.ash .sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.ash-top{display:none}
.ash-side{background:#FFFFFF;border-right:1px solid var(--line-2,#EAECF0);position:relative} /* the white column runs the full page height; its content sticks */
.ash-sidein{display:flex;flex-direction:column;position:sticky;top:0;height:100vh;overflow:auto;box-sizing:border-box;padding:18px 14px 14px}
.ash-brand{display:flex;align-items:center;gap:10px;font-weight:700;font-size:17px;color:var(--ink);text-decoration:none;padding:4px 8px 18px}
.ash-nav{display:grid;gap:2px}
.ash-link{display:flex;align-items:center;gap:10px;min-height:40px;padding:0 10px;border-radius:8px;color:#344054;text-decoration:none;font-weight:600;font-size:14.5px}
.ash-link:hover{background:#F2F4F7;color:var(--ink)}
.ash-link[aria-current="page"]{background:#EEF4FF;color:#1D4ED8}
.ash-link svg{flex:none;color:#667085}.ash-link[aria-current="page"] svg{color:#1D4ED8}
.ash-acct{margin-top:auto;padding-top:12px;border-top:1px solid var(--line-2,#EAECF0)}
.ash-prod{margin:14px 0 0;padding:12px 0 0;border-top:1px solid var(--line-2,#EAECF0);display:grid;gap:2px}
.ash-back{display:inline-flex;align-items:center;gap:6px;color:#475467;font-size:13px;font-weight:600;text-decoration:none;padding:4px 10px;min-height:32px}
.ash-back:hover{color:var(--ink)}
.ash-pn{margin:6px 10px 4px;font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#667085}
.ash-sub{display:flex;align-items:center;min-height:36px;padding:0 10px 0 14px;border-radius:8px;color:#344054;text-decoration:none;font-size:14px;font-weight:500}
.ash-sub:hover{background:#F2F4F7}.ash-sub[aria-current="page"]{background:#EEF4FF;color:#1D4ED8;font-weight:600}
.ash-me{position:relative;margin-top:10px}
.ash-me summary{list-style:none;display:flex;align-items:center;gap:10px;min-height:44px;padding:6px 10px;border-radius:8px;cursor:pointer;font-size:13.5px;color:#344054}
.ash-me summary::-webkit-details-marker{display:none}.ash-me summary:hover{background:#F2F4F7}
.ash-av{flex:none;display:grid;place-items:center;width:28px;height:28px;border-radius:50%;background:#F2F4F7;color:#475467}
.ash-em{overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.ash-menu-pop{position:absolute;left:0;right:0;bottom:calc(100% + 6px);background:#fff;border:1px solid var(--line,#D0D5DD);border-radius:10px;box-shadow:0 12px 32px rgba(16,24,40,.12);padding:6px;display:grid;z-index:20}
.ash-menu-pop a,.ash-menu-pop button{display:flex;align-items:center;min-height:38px;padding:0 10px;border-radius:6px;color:#344054;text-decoration:none;font:500 14px var(--f,inherit);background:none;border:0;width:100%;text-align:left;cursor:pointer}
.ash-menu-pop a:hover,.ash-menu-pop button:hover{background:#F2F4F7}
.ash-menu-pop form{margin:0}.ash-who{margin:4px 10px 8px;font-size:12.5px;color:#667085;overflow-wrap:anywhere}.ash-who b{color:var(--ink);font-weight:600}
.ash-main{min-width:0}
.ash-main>.app-w,.ash-main>main{margin:0 auto}
.ash a:focus-visible,.ash button:focus-visible,.ash summary:focus-visible,.ash input:focus-visible,.ash select:focus-visible{outline:3px solid #84ADFF;outline-offset:2px}
@media (max-width:899px){
  .ash{grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);align-content:start} /* the header row keeps its height; the page takes the rest */
  .ash-top{display:flex;align-items:center;gap:6px;height:56px;padding:0 12px;background:#fff;border-bottom:1px solid var(--line-2,#EAECF0);position:sticky;top:0;z-index:30}
  .ash-top .ash-brand{padding:0}
  .ash-menu{display:grid;place-items:center;width:44px;height:44px;border:0;background:none;border-radius:8px;color:#344054;cursor:pointer}
  .ash-menu:hover{background:#F2F4F7}
  .ash-side{position:fixed;left:0;top:0;bottom:0;width:min(86vw,300px);height:auto;z-index:50;transform:translateX(-102%);visibility:hidden;transition:transform .2s ease,visibility 0s linear .2s}
  .ash-open .ash-side{transform:none;visibility:visible;box-shadow:0 0 40px rgba(16,24,40,.18);transition:transform .2s ease} /* closed: off screen AND out of the Tab order */
  .ash-scrim{position:fixed;inset:0;background:rgba(16,24,40,.35);z-index:40}
  .ash-side .ash-sidein>.ash-brand{display:none}
  .ash-sidein{position:static;height:100%}
}
@media (prefers-reduced-motion:reduce){.ash-side{transition:none}}
/* page frame inside the shell */
.acw{max-width:1040px;margin:0 auto;padding:32px 32px 56px}
@media (max-width:899px){.acw{padding:20px 16px 40px}}
.ach{display:flex;justify-content:space-between;align-items:flex-start;gap:16px;flex-wrap:wrap;margin:0 0 20px}
.ach h1{margin:0;font-size:26px;line-height:1.2;letter-spacing:-.01em}
.ach p{margin:6px 0 0;color:#475467}
.acnote{margin:0 0 16px;padding:12px 14px;border-radius:10px;background:#EEF4FF;color:#1D3A8A;font-size:14px}
.acnote.ok{background:#ECFDF3;color:#05603A}.acnote.warn{background:#FFFAEB;color:#93370D}
.acnote button{font:inherit;font-weight:600;color:inherit;text-decoration:underline;background:none;border:0;padding:0;cursor:pointer}
/* My software: one row per product */
.ms-list{display:grid;gap:12px}
.ms-item{display:grid;grid-template-columns:48px minmax(0,1fr) auto;gap:16px;align-items:center;background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:12px;padding:16px 18px}
.ms-ic{width:48px;height:48px;border-radius:10px;background:#F2F4F7;display:grid;place-items:center;color:#344054;overflow:hidden}
.ms-ic img{width:100%;height:100%;object-fit:cover}
.ms-t{min-width:0}.ms-t h2{margin:0;font-size:16.5px;line-height:1.3}
.ms-t p{margin:3px 0 0;color:#475467;font-size:14px}
.ms-st{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:600;color:#344054;margin-top:6px}
.ms-st::before{content:"";width:8px;height:8px;border-radius:50%;background:#98A2B3}
.ms-st.ok::before{background:#12B76A}.ms-st.warn::before{background:#F79009}.ms-st.bad::before{background:#F04438}.ms-st.off::before{background:#98A2B3}
.ms-a{display:flex;align-items:center;gap:8px}
.ms-more{position:relative}
.ms-more summary{list-style:none;display:grid;place-items:center;width:40px;height:40px;border-radius:999px;border:1.5px solid var(--line,#D0D5DD);background:#fff;cursor:pointer;color:#344054}
.ms-more summary::-webkit-details-marker{display:none}.ms-more summary:hover{background:#F9FAFB}
.ms-pop{position:absolute;right:0;top:calc(100% + 6px);min-width:220px;background:#fff;border:1px solid var(--line,#D0D5DD);border-radius:10px;box-shadow:0 12px 32px rgba(16,24,40,.12);padding:6px;display:grid;z-index:10}
.ms-pop a{display:flex;align-items:center;min-height:38px;padding:0 10px;border-radius:6px;color:#344054;text-decoration:none;font-size:14px}
.ms-pop a:hover{background:#F2F4F7}
.ms-subs{grid-column:2/-1;display:grid;gap:6px;margin:4px 0 0;padding:10px 0 0;border-top:1px solid #F2F4F7}
.ms-sub{display:flex;justify-content:space-between;gap:12px;align-items:center;font-size:14px;min-width:0}
.ms-sub a{color:var(--ink);font-weight:600;text-decoration:none;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}.ms-sub a:hover{text-decoration:underline}
.ms-sub span{color:#475467;white-space:nowrap;font-size:13px}
@media (max-width:640px){.ms-item{grid-template-columns:40px minmax(0,1fr)}.ms-ic{width:40px;height:40px}.ms-a{grid-column:1/-1}.ms-a .btn-k{flex:1}.ms-subs{grid-column:1/-1}}
.ms-empty{background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:12px;padding:28px}
.ms-empty h2{margin:0 0 6px;font-size:19px}.ms-empty p{margin:0 0 16px;color:#475467}
/* Explore software */
.ex-cats{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 18px}
.ex-cats a{display:inline-flex;align-items:center;min-height:36px;padding:0 14px;border-radius:999px;border:1px solid var(--line,#D0D5DD);background:#fff;color:#344054;text-decoration:none;font-size:14px;font-weight:600}
.ex-cats a[aria-current="true"]{background:#101828;border-color:#101828;color:#fff}
.ex-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:14px}
.ex-card{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:12px;overflow:hidden}
.ex-shot{aspect-ratio:16/9;background:#F2F4F7;border-bottom:1px solid var(--line-2,#EAECF0);display:grid;place-items:center;color:#667085}
.ex-shot img{width:100%;height:100%;object-fit:cover;object-position:top}
.ex-b{padding:14px 16px 16px;display:flex;flex-direction:column;gap:6px;flex:1}
.ex-k{font-size:12px;font-weight:700;letter-spacing:.04em;text-transform:uppercase;color:#667085}
.ex-b h3{margin:0;font-size:16.5px}.ex-b p{margin:0;color:#475467;font-size:14px}
.ex-price{font-weight:700;color:var(--ink);font-size:14.5px}
.ex-act{margin-top:auto;padding-top:10px;display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.ex-act .muted{font-size:13px}
.ex-h2{margin:28px 0 10px;font-size:17px}
.ex-later{background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:12px;padding:6px 16px}
.ex-later summary{cursor:pointer;min-height:44px;display:flex;align-items:center;font-weight:600}
.ex-later ul{margin:0 0 12px;padding:0;list-style:none;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:6px 18px}
.ex-later li{font-size:14px;color:#344054}.ex-later li span{color:#667085;font-size:12.5px;display:block}
/* help, simple lists */
.hp{display:grid;gap:12px}.hp section{background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:12px;padding:18px 20px}
.hp h2{margin:0 0 8px;font-size:16.5px}.hp p,.hp li{color:#344054;font-size:14.5px}.hp ul{margin:0;padding-left:18px}
.wslist{display:grid;gap:10px}
.ex-more{font-size:13px;color:#475467;margin-top:6px}.ex-st{margin:6px 0 0;font-size:13px;color:#B42318;min-height:0}
.ms-d{margin:4px 0 0;color:#475467;font-size:13.5px}
/* folded sections show their state */
.ex-later summary,.lt-more summary{list-style:none}.ex-later summary::-webkit-details-marker,.lt-more summary::-webkit-details-marker{display:none}
.ex-later summary::after,.lt-more summary::after{content:"";margin-left:auto;width:8px;height:8px;border-right:2px solid #667085;border-bottom:2px solid #667085;transform:translateY(-2px) rotate(45deg);flex:none}
.ex-later[open] summary::after,.lt-more[open] summary::after{transform:translateY(2px) rotate(-135deg)}
.ash-anon .ash-top .ash-brand{padding:0}
@media (max-width:480px){.ms-sub{flex-wrap:wrap;gap:0 12px}.ms-sub a{flex:1 1 100%}.ms-sub span{white-space:normal}} /* very narrow phones: name above its status */
/* 2026-10-26 My software: square product tiles (real product image, name, one status); the whole tile opens the product */
.ms-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:16px}
.ms-grid .ms-item{display:block;position:relative;aspect-ratio:1/1;padding:0;background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:14px;overflow:hidden;transition:border-color .15s ease,box-shadow .15s ease}
.ms-grid .ms-item:hover{border-color:#98A2B3;box-shadow:0 6px 18px rgba(16,24,40,.08)}
.ms-link{display:flex;flex-direction:column;height:100%;color:inherit;text-decoration:none}
.ms-link:focus-visible{outline:3px solid #84ADFF;outline-offset:-3px;border-radius:14px}
.ms-shot{flex:1 1 auto;min-height:0;display:block;background:#F2F4F7;border-bottom:1px solid var(--line-2,#EAECF0);overflow:hidden}
.ms-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.ms-shot.ms-contain{background:#070C1A}.ms-shot.ms-contain img{object-fit:contain;object-position:center}
.ms-noimg{display:grid;place-items:center;height:100%;color:#475467;font-weight:700}
.ms-b{flex:none;display:grid;gap:3px;padding:12px 14px 14px}
.ms-name{margin:0;font-size:16px;line-height:1.25}
.ms-sum{color:#475467;font-size:13.5px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-b .ms-st{margin-top:2px}
.ms-off{cursor:default}.ms-off .ms-shot img{filter:grayscale(1);opacity:.6}
.ms-grid .ms-more{position:absolute;top:10px;right:10px}
.ms-grid .ms-more summary{width:34px;height:34px;background:rgba(255,255,255,.92);border:1px solid var(--line,#D0D5DD)}
.ms-grid .ms-pop{top:calc(100% + 4px)}
@media (max-width:640px){.ms-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}.ms-b{padding:10px 11px 12px}.ms-name{font-size:15px}.ms-grid .ms-more summary{width:32px;height:32px}}
@media (max-width:359px){.ms-grid{grid-template-columns:minmax(0,1fr)}}
/* tiles, refinement: every image takes the same share of the tile; the secondary menu sits quietly in the text area, never over the image */
.ms-shot{flex:0 0 56%}
.ms-b{flex:1 1 auto;min-height:0;align-content:start;padding-right:48px}
.ms-grid .ms-more{top:auto;bottom:10px;right:8px}
.ms-grid .ms-more summary{width:32px;height:32px;background:transparent;border:0;color:#667085}
.ms-grid .ms-more summary:hover{background:#F2F4F7;color:#101828}
.ms-grid .ms-pop{top:auto;bottom:calc(100% + 4px)}
@media (max-width:640px){.ms-shot{flex-basis:50%}.ms-b{padding-right:38px;gap:1px}.ms-grid .ms-more{bottom:6px;right:4px}}
/* tiles, refinement 2: the menu sits on the name row (status lines keep the full width, one line each); its pop-up is not clipped */
.ms-grid .ms-item{overflow:visible}.ms-grid .ms-item:focus-within,.ms-grid .ms-item:has(.ms-more[open]){z-index:3}
.ms-link{border-radius:13px;overflow:hidden}
.ms-b{padding-right:14px}.ms-name{padding-right:30px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ms-b .ms-st{display:block;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.ms-b .ms-st::before{display:inline-block;margin-right:6px;vertical-align:1px}
.ms-grid .ms-more{top:calc(56% + 6px);bottom:auto;right:6px;z-index:4}
.ms-grid .ms-pop{top:calc(100% + 4px);bottom:auto}
@media (max-width:640px){.ms-b{padding-right:11px}.ms-grid .ms-more{top:calc(50% + 2px);right:2px}.ms-name{padding-right:28px}}
@media (max-width:359px){.ms-shot{flex-basis:66%}.ms-grid .ms-more{top:calc(66% + 4px)}} /* one column: the image fills more of the square */
/* 2026-10-27 Explore: compact image-first tiles (same family as My software) */
.ex-grid{grid-template-columns:repeat(auto-fill,minmax(176px,1fr));gap:14px}
.ex-tile{display:flex;flex-direction:column;background:#fff;border:1px solid var(--line-2,#EAECF0);border-radius:12px;overflow:hidden;color:inherit;text-decoration:none;transition:border-color .15s ease,box-shadow .15s ease}
.ex-tile:hover{border-color:#98A2B3;box-shadow:0 6px 18px rgba(16,24,40,.08)}
.ex-tile:focus-visible{outline:3px solid #84ADFF;outline-offset:2px}
.ex-tile .ex-shot{aspect-ratio:16/10;display:block;background:#F2F4F7;border-bottom:1px solid var(--line-2,#EAECF0);overflow:hidden}
.ex-tile .ex-shot img{display:block;width:100%;height:100%;object-fit:cover;object-position:top center}
.ex-tile .ex-b{display:grid;gap:2px;padding:10px 12px 12px}
.ex-name{font-weight:600;font-size:14.5px;line-height:1.3;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-meta{color:#475467;font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.ex-tile .ms-st{margin-top:0;font-size:13px}
.ex-later li a{color:#344054;text-decoration:none;font-weight:600}.ex-later li a:hover{text-decoration:underline}
@media (max-width:640px){.ex-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:12px}}
.ex-grid+.ex-later{margin-top:20px}
@media (max-width:640px){.ex-cats{flex-wrap:nowrap;overflow-x:auto;margin-left:-16px;margin-right:-16px;padding:0 16px 4px;scrollbar-width:none}.ex-cats::-webkit-scrollbar{display:none}.ex-cats a{flex:none}}