/* Owner showcase v3.2.0 — category browser and bounded queued slider. */
.os-showcase { --os-sidebar-width:230px; --os-ink:#102945; --os-muted:#52667e; --os-line:#dce5ef; color:var(--os-ink); background:#f5f8fc; border-block:1px solid var(--os-line); width:100%; }
.os-showcase *, .os-showcase *::before, .os-showcase *::after { box-sizing:border-box; }
.os-showcase [hidden] { display:none!important; }
.os-showcase-head,.os-stage,.os-footer { padding:24px clamp(18px,3vw,56px); }
.os-stage { padding-inline:0; }
.os-stage-meta { padding-inline:clamp(18px,3vw,56px); }
.os-showcase-head { background:linear-gradient(110deg,#edf5ff,#f8faff); }
.os-brandline,.os-head-main,.os-showcase-actions,.os-stage-meta,.os-footer,.os-footer-actions,.os-network-facts { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.os-brandline,.os-head-main,.os-stage-meta,.os-footer { justify-content:space-between; }
.os-head-main { margin-top:20px; align-items:flex-end; }
.os-head-copy { flex:1 1 500px; }
.os-head-copy h3 { margin:8px 0 12px; font-size:clamp(26px,2.3vw,44px); line-height:1.2; letter-spacing:-.025em; }
.os-head-copy p { max-width:75ch; margin:0; color:var(--os-muted); font-size:16px; line-height:1.7; }
.os-eyebrow,.os-live-badge { font-size:12px; font-weight:750; letter-spacing:.07em; text-transform:uppercase; color:#1854be; }
.os-live-badge { display:inline-flex; align-items:center; gap:8px; background:#e5f6ef; color:#11694f; padding:7px 11px; border-radius:24px; }
.os-live-badge i,.os-stage-live i { display:inline-block; width:7px; height:7px; background:#149d79; border-radius:50%; }
.os-brand-note,.os-status,.os-count,.os-network-facts { font-size:13px; color:var(--os-muted); line-height:1.5; }
.os-count { font-weight:650; }
.os-pause,.os-retry,.os-browse { display:inline-flex; justify-content:center; align-items:center; min-height:44px; border:1px solid #b8cce8; border-radius:9px; background:white; color:#174ca1; padding:10px 15px; font-family:inherit; font-size:14px; font-weight:600; line-height:1.3; cursor:pointer; text-decoration:none; }
.os-browse { background:#1854c8; border-color:#1854c8; color:white; }
.os-stage-meta { margin-bottom:18px; }
.os-stage-live { font-size:13px; font-weight:650; display:flex; align-items:center; gap:8px; }
.os-rows { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); grid-template-rows:repeat(4,minmax(180px,auto)); gap:18px; }
/* Static depth and short interaction transitions: no ongoing paint effects. */
.os-card { position:relative; display:flex; flex-direction:column; gap:12px; min-width:0; min-height:180px; padding:20px; border:1px solid #d5e1ef; border-radius:18px; background:linear-gradient(145deg,#fff 35%,#f0f5fc); color:var(--os-ink); text-decoration:none; box-shadow:0 2px 3px rgb(20 45 80 / 3%),0 8px 18px -12px rgb(20 45 80 / 24%),inset 0 1px 0 #fff; transition:transform 160ms ease,border-color 160ms ease,box-shadow 160ms ease; }
.os-card::before { content:""; position:absolute; top:18px; bottom:18px; left:0; width:3px; border-radius:0 3px 3px 0; background:linear-gradient(#95b9ff,#446fc9); }
a.os-card { cursor:pointer; }
a.os-card:hover { transform:translateY(-2px); border-color:#8dabdb; box-shadow:0 12px 22px -12px rgb(25 60 110 / 32%),inset 0 1px 0 #fff; }
a.os-card:focus-visible,.os-showcase button:focus-visible,.os-browse:focus-visible { outline:3px solid #2866da; outline-offset:3px; }
.os-card--gateway { border-color:#e4cf9c; background:linear-gradient(145deg,#fff 35%,#fff5df); }
.os-card--gateway::before { background:linear-gradient(#eac573,#b87c16); }
.os-card-heading { display:flex; align-items:center; gap:12px; }
.os-monogram { flex:0 0 43px; height:43px; display:grid; place-items:center; border-radius:12px; background:linear-gradient(140deg,#f4f8ff,#dce8ff); border:1px solid #d0def6; box-shadow:inset 0 1px 0 white,0 4px 8px -5px #6683b9; color:#345abe; font-size:20px; font-weight:700; }
.os-card-heading strong { font-size:17px; font-weight:700; line-height:1.4; overflow-wrap:anywhere; }
.os-arrow { margin-left:auto; flex:0 0 27px; height:27px; display:grid; place-items:center; border:1px solid #dce6f5; border-radius:50%; background:#fff; color:#245abe; }
.os-card-meta { font-size:14px; line-height:1.5; color:var(--os-muted); overflow-wrap:anywhere; }
.os-badges { display:flex; flex-wrap:wrap; gap:6px; }
.os-badge { border:1px solid #dbe4ef; border-radius:20px; padding:4px 8px; font-size:11px; line-height:1.4; font-weight:650; background:#f5f7fa; color:#4a5c72; }
.os-badge--domain { background:#eaf8fb; border-color:#bce4ed; color:#12667b; }
.os-badge--registry { background:#edf8f1; border-color:#bfe3cd; color:#19683d; }
.os-badge--gateway { background:#fff6e3; border-color:#ecd39c; color:#775319; }
.os-card-link { margin-top:auto; padding-top:10px; border-top:1px solid #dce5f1; font-size:13px; font-weight:650; color:#245abe; }
.os-footer { border-top:1px solid var(--os-line); }
.os-footer-actions a { font-size:14px; font-weight:600; color:#245abe; text-decoration:none; }
.os-empty,.os-loading,.os-error { grid-column:1/-1; padding:30px; color:var(--os-muted); background:white; border:1px solid var(--os-line); border-radius:12px; }

@media(max-width:600px) { .os-head-copy { flex-basis:100%; } .os-card { min-height:170px; } .os-brand-note { width:100%; } }

.os-browser { display:grid; grid-template-columns:var(--os-sidebar-width) 12px minmax(0,1fr); align-items:stretch; border-block:1px solid var(--os-line); border-inline:0; border-radius:0; background:white; overflow:hidden; }
.os-sidebar { min-width:0; padding:22px 14px; background:linear-gradient(155deg,#163858,#0a2039); color:white; }
.os-sidebar-title { font-size:17px; font-weight:700; }
.os-sidebar p { color:#b3c7df; font-size:12px; line-height:1.5; margin:8px 0 18px; }
.os-category-list { max-height:790px; overflow-y:auto; scrollbar-width:thin; scrollbar-color:#7794b7 transparent; }
.os-category-list button { display:flex; justify-content:space-between; gap:12px; text-align:left; align-items:center; width:100%; padding:12px 10px; margin-bottom:5px; border:0; border-radius:8px; background:transparent; color:#dbe8f7; font-family:inherit; font-size:13px; line-height:1.4; cursor:pointer; }
.os-category-list button span { overflow-wrap:anywhere; }
.os-category-list button small { color:#a9c5e5; }
.os-category-list button:hover,.os-category-list button[aria-pressed="true"] { background:#244668; color:white; }
.os-resize { cursor:col-resize; touch-action:none; background:linear-gradient(to right,#edf2f8,#fff); position:relative; }
.os-resize::after { content:""; position:absolute; left:5px; top:40%; width:2px; height:36px; border-radius:2px; background:#9fb5d0; }
.os-resize:focus-visible { outline:2px solid #2362cb; outline-offset:-2px; }
.os-results { min-width:0; grid-column:3; padding:22px; background:linear-gradient(135deg,#f0f5fb,#f8fafd); }
.os-categories-collapsed .os-browser { grid-template-columns:minmax(0,1fr); }
.os-categories-collapsed .os-results { grid-column:1; }
.os-toolbar { display:flex; gap:10px; align-items:center; flex-wrap:wrap; margin-bottom:18px; }
.os-toolbar button,.os-queue-footer button { border:1px solid #cbd9ea; border-radius:8px; min-height:40px; padding:9px 12px; background:white; color:#224b80; font-family:inherit; font-weight:650; font-size:13px; cursor:pointer; }
.os-toolbar #osPlay { background:#215dcc; color:white; border-color:#215dcc; }
.os-search-label { flex:1 1 230px; min-width:0; }
.os-search-label input { width:100%; min-height:42px; padding:10px 14px; border:1px solid #cbd9ea; background:white; border-radius:9px; color:#173b64; font-family:inherit; font-size:14px; }
.os-search-label input:focus { outline:2px solid #8bb2f1; outline-offset:1px; }
.os-queue-viewport { overflow:hidden; padding:3px 2px 6px; min-height:780px; }
.os-queue-footer { display:flex; flex-wrap:wrap; gap:14px; justify-content:space-between; align-items:center; margin-top:18px; }
.os-queue-footer>span { color:#526a85; font-size:12px; line-height:1.5; }
.os-queue-footer>div { display:flex; gap:8px; }
.os-queue-footer button:disabled,.os-toolbar button:disabled { opacity:.45; cursor:default; }
.os-badges:empty { display:none; }
.os-sr-only { position:absolute; width:1px; height:1px; overflow:hidden; clip-path:inset(50%); }
@media(min-width:1600px) { .os-rows { grid-template-columns:repeat(5,minmax(0,1fr)); } }
@media(max-width:1200px) { .os-browser { grid-template-columns:min(var(--os-sidebar-width),28vw) 10px minmax(0,1fr); } .os-rows { grid-template-columns:repeat(3,minmax(0,1fr)); } }
@media(max-width:999px) { .os-browser { grid-template-columns:minmax(0,1fr); } .os-results { grid-column:1; } .os-sidebar { padding:16px; } .os-category-list { max-height:160px; display:flex; flex-wrap:wrap; gap:5px; } .os-category-list button { width:auto; } .os-resize { display:none; } }
@media(max-width:649px) { .os-rows { grid-template-columns:repeat(2,minmax(0,1fr)); } .os-results { padding:12px; } .os-card-heading { flex-wrap:wrap; } .os-card-heading strong { font-size:15px; } .os-monogram { flex-basis:34px; height:34px; font-size:17px; } .os-arrow { display:none; } }
@media(max-width:380px) { .os-rows { grid-template-columns:minmax(0,1fr); } }

@media(max-width:649px) { .os-rows { gap:12px; } .os-card { padding:15px; } }
@media(prefers-reduced-motion:reduce) { .os-card { transition:none; } a.os-card:hover { transform:none; } }