.mock-figure{margin:0}.mock{--m-bg:#0d0e10;--m-surface:#1a1b1f;--m-high:#26272c;--m-fg:#f2f3f5;--m-muted:#989ba3;--m-line:#2f3036;--m-pill:#f2f3f5;--m-on-pill:#0d0e10;--tint:#ef7029;aspect-ratio:16/9;background:var(--m-bg);color:var(--m-fg);box-shadow:0 0 0 1px var(--line), 0 28px 70px -30px #00000080;isolation:isolate;border-radius:clamp(12px,2vw,24px);grid-template-rows:auto minmax(0,1fr) auto;line-height:1.3;display:grid;position:relative;overflow:hidden;container-type:inline-size}.mock *{--u:calc(100cqw / 1280)}.mock svg{width:100%;height:100%;display:block}.mock:before{content:"";z-index:-1;background:linear-gradient(180deg, color-mix(in srgb, var(--tint) 46%, transparent), transparent 66%);transition:background .4s var(--ease);position:absolute;inset:0}.mock[data-style=warm]{--m-bg:#fafaf8;--m-surface:#f1f1ee;--m-high:#ddddd8;--m-fg:#262625;--m-muted:#70706b;--m-line:#ddddd8;--m-pill:#343432;--m-on-pill:#fafaf8}.mock[data-style=black]{--m-bg:#000;--m-surface:#141416;--m-high:#2a2a2e;--m-fg:#f4f4f5;--m-muted:#97979d;--m-line:#303034;--m-pill:#fff;--m-on-pill:#000}.mock:is([data-style=warm],[data-style=black]):before{display:none}.m-top{justify-content:space-between;align-items:center;gap:calc(16 * var(--u));padding:calc(8 * var(--u)) calc(16 * var(--u)) 0;min-width:0;display:flex}.m-caret{width:calc(24 * var(--u));height:calc(24 * var(--u));flex:none;margin-inline-start:calc(12 * var(--u));display:none}.m-pills{align-items:center;gap:calc(2 * var(--u));padding:calc(4 * var(--u));height:calc(56 * var(--u));background:color-mix(in srgb, var(--m-surface) 72%, transparent);font-size:calc(16 * var(--u));border-radius:999px;margin-inline-end:auto;display:flex}.m-pills>span{height:calc(40 * var(--u));padding-inline:calc(18 * var(--u));color:var(--m-muted);white-space:nowrap;border-radius:999px;align-items:center;display:flex}.m-pills .on{background:var(--m-pill);color:var(--m-on-pill);font-weight:500}.m-sys{letter-spacing:-.02em;margin-inline-end:calc(9 * var(--u));font-style:italic;font-weight:800}.m-search{align-items:center;gap:calc(10 * var(--u));height:calc(40 * var(--u));padding-inline:calc(13 * var(--u));background:color-mix(in srgb, var(--m-surface) 72%, transparent);color:var(--m-fg);font-size:calc(14 * var(--u));border-radius:999px;flex:none;display:flex}.m-search i{width:calc(18 * var(--u));height:calc(18 * var(--u))}.m-search em{color:var(--m-muted);font-style:normal;display:none}.m-search kbd{padding:calc(3 * var(--u)) calc(7 * var(--u));background:var(--m-high);font:700 calc(10.5 * var(--u)) var(--font-ui);border-radius:99px}.m-view{min-height:0;position:relative}.m-view-list,.mock[data-style=library] .m-view-grid{display:none}.mock[data-style=library] .m-view-list{display:grid}.m-view-grid{grid-template-columns:calc(320 * var(--u)) minmax(0, 1fr);gap:calc(40 * var(--u));padding:calc(24 * var(--u)) calc(40 * var(--u)) 0 calc(28 * var(--u));display:grid}.m-detail{flex-direction:column;min-height:0;display:flex}.m-model{flex:auto;min-height:0;position:relative}.stage{place-items:center;display:grid;position:absolute;inset:0}.stage-canvas{cursor:grab;touch-action:pan-y;opacity:0;width:100%;height:100%;transition:opacity .24s var(--ease);display:block;position:absolute;inset:0}.stage-canvas:active{cursor:grabbing}.stage-fallback{width:52%;height:auto;box-shadow:0 calc(12 * var(--u)) calc(30 * var(--u)) #0006;transition:opacity .24s var(--ease)}.mock.has-3d .stage-canvas{opacity:1}.mock.has-3d .stage-fallback{opacity:0}.plinth{height:calc(56 * var(--u));z-index:-1;background:radial-gradient(closest-side, color-mix(in srgb, var(--m-fg) 26%, transparent), transparent);border-radius:50%;position:absolute;bottom:0;left:4%;right:4%}.m-info{gap:calc(9 * var(--u));padding-block:calc(14 * var(--u)) calc(10 * var(--u));font-size:calc(13 * var(--u));color:var(--m-muted);display:grid}.m-info strong{color:var(--m-fg);font-size:calc(22 * var(--u));text-align:center;font-weight:700}.m-chips{gap:calc(6 * var(--u));flex-wrap:wrap;display:flex}.m-chips span{padding:calc(4 * var(--u)) calc(11 * var(--u));background:var(--m-high);color:var(--m-muted);font-size:calc(12 * var(--u));border-radius:99px}.m-status{align-items:center;gap:calc(5 * var(--u));font-size:calc(12 * var(--u));display:flex}.m-status i,.m-panel-status i{width:calc(14 * var(--u));height:calc(14 * var(--u))}.m-grid{--tile:calc(300 * var(--u));align-content:flex-start;align-items:flex-start;gap:calc(14 * var(--u)) calc(18 * var(--u));min-height:0;padding:calc(6 * var(--u));margin:calc(-6 * var(--u));flex-wrap:wrap;display:flex;overflow:hidden}.cover{all:unset;box-sizing:border-box;gap:calc(8 * var(--u));cursor:pointer;width:calc(var(--tile) * var(--cover-aspect,.854));font-size:calc(14 * var(--u));color:var(--m-muted);flex-direction:column;flex:none;display:flex}.cover .art{width:100%;height:var(--tile);border-radius:calc(14 * var(--u));background:var(--m-surface);flex:none;display:block;position:relative}.cover .art img{object-fit:cover;border-radius:inherit;width:100%;height:100%;display:block}.cover .fav{right:calc(8 * var(--u));bottom:calc(8 * var(--u));width:calc(28 * var(--u));height:calc(28 * var(--u));padding:calc(6 * var(--u));color:#fff;background:#000000b8;border-radius:50%;position:absolute}.cover .fav path,.row .filled path{fill:currentColor}.cover .name{padding-inline:calc(2 * var(--u));white-space:nowrap;text-overflow:ellipsis;font-weight:500;overflow:hidden}.cover .name-in{display:none}.cover[aria-selected=true]{color:var(--m-fg);font-weight:700}.cover[aria-selected=true] .art{outline:calc(3 * var(--u)) solid var(--m-fg);outline-offset:calc(3 * var(--u))}.cover:focus-visible .art{outline-color:var(--accent)}.m-actions{right:calc(32 * var(--u));bottom:calc(4 * var(--u));gap:calc(10 * var(--u));display:flex;position:absolute}.round,.play{height:calc(52 * var(--u));background:var(--m-pill);color:var(--m-on-pill);box-shadow:0 calc(6 * var(--u)) calc(18 * var(--u)) #00000059;justify-content:center;align-items:center;display:flex}.round{width:calc(52 * var(--u));padding:calc(15 * var(--u));border-radius:calc(16 * var(--u))}.play{gap:calc(8 * var(--u));padding-inline:calc(26 * var(--u));font-size:calc(15 * var(--u));white-space:nowrap;border-radius:999px;font-weight:500}.play i{width:calc(18 * var(--u));height:calc(18 * var(--u))}.m-hints{align-items:center;gap:calc(14 * var(--u));padding:calc(10 * var(--u)) calc(16 * var(--u)) calc(8 * var(--u));font-size:calc(12 * var(--u));color:var(--m-muted);white-space:nowrap;display:flex;overflow:hidden}.m-hints span{align-items:center;gap:calc(5 * var(--u));display:inline-flex}.m-hints i{width:calc(16 * var(--u));height:calc(16 * var(--u))}.m-hints kbd{min-width:calc(20 * var(--u));padding:calc(3 * var(--u)) calc(6 * var(--u));text-align:center;background:var(--m-high);color:var(--m-fg);font:700 calc(10 * var(--u)) var(--font-ui);border-radius:99px}.only-library{display:none!important}.mock[data-style=library] .only-library{display:inline-flex!important}.mock[data-style=library] .m-search{width:calc(260 * var(--u))}.mock[data-style=library] .m-search em{flex:1;display:block}.m-view-list{grid-template-columns:calc(84 * var(--u)) minmax(0, 1fr) calc(300 * var(--u));gap:calc(32 * var(--u));padding:calc(20 * var(--u)) calc(28 * var(--u)) 0 calc(28 * var(--u))}.m-rail{align-items:center;gap:calc(6 * var(--u));flex-direction:column;min-height:0;display:flex}.m-rail-item{justify-items:center;gap:calc(4 * var(--u));width:calc(72 * var(--u));padding-block:calc(8 * var(--u));border-radius:calc(14 * var(--u));color:var(--m-muted);font-size:calc(11 * var(--u));display:grid}.m-rail-item b{width:calc(44 * var(--u));height:calc(30 * var(--u));border-radius:calc(8 * var(--u));background:var(--m-surface);color:var(--m-fg);font-size:calc(11 * var(--u));place-items:center;font-style:italic;font-weight:800;display:grid}.m-rail-item small{font-size:inherit}.m-rail-item.on{background:var(--m-surface);color:var(--m-fg);font-weight:700}.m-rail-item.on b{background:var(--m-fg);color:var(--m-bg)}.m-rail-item.all{margin-top:auto}.m-rail-item.all b{padding:calc(6 * var(--u)) calc(13 * var(--u))}.m-list{gap:calc(4 * var(--u));flex-direction:column;min-height:0;display:flex;position:relative;overflow:hidden}.row{all:unset;box-sizing:border-box;grid-template-columns:auto minmax(0, 1fr) auto calc(72 * var(--u));align-items:center;gap:calc(14 * var(--u));padding:calc(6 * var(--u)) calc(12 * var(--u)) calc(6 * var(--u)) calc(6 * var(--u));border-radius:calc(14 * var(--u));border:calc(2 * var(--u)) solid transparent;cursor:pointer;color:var(--m-fg);flex:none;display:grid}.row img{width:calc(48 * var(--u));height:calc(56 * var(--u));object-fit:contain;border-radius:calc(4 * var(--u))}.row-text{gap:calc(3 * var(--u));min-width:0;display:grid}.row-text strong{font-size:calc(15 * var(--u));white-space:nowrap;text-overflow:ellipsis;font-weight:600;overflow:hidden}.row-text small{color:var(--m-muted);font-size:calc(12 * var(--u));white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.row-icons{align-items:center;gap:calc(8 * var(--u));color:var(--m-muted);display:flex}.row-icons i{width:calc(17 * var(--u));height:calc(17 * var(--u))}.row-time{color:var(--m-muted);font-size:calc(12 * var(--u));text-align:end}.row[aria-selected=true]{background:var(--m-surface);border-color:var(--m-fg)}.row:focus-visible{border-color:var(--accent)}.m-list-actions{right:0;bottom:calc(4 * var(--u));align-items:center;gap:calc(6 * var(--u));padding:calc(6 * var(--u));background:color-mix(in srgb, var(--m-surface) 92%, transparent);box-shadow:0 calc(8 * var(--u)) calc(22 * var(--u)) #0006;border-radius:999px;display:flex;position:absolute}.m-list-actions .play{height:calc(44 * var(--u));box-shadow:none}.m-list-actions .round{width:calc(40 * var(--u));height:calc(40 * var(--u));padding:calc(10 * var(--u));background:var(--m-high);color:var(--m-fg);box-shadow:none;border-radius:50%}.m-panel{gap:calc(10 * var(--u));min-height:0;padding:calc(14 * var(--u));border-radius:calc(24 * var(--u));background:var(--m-surface);border:1px solid var(--m-line);flex-direction:column;display:flex}.m-panel-model{flex:0 1 calc(360 * var(--u));border-radius:calc(16 * var(--u));background:linear-gradient(180deg, var(--m-high), var(--m-surface));min-height:0;position:relative;overflow:hidden}.m-panel-status{top:calc(10 * var(--u));right:calc(10 * var(--u));z-index:1;align-items:center;gap:calc(5 * var(--u));padding:calc(4 * var(--u)) calc(10 * var(--u));background:var(--m-bg);color:var(--m-muted);font-size:calc(12 * var(--u));border-radius:99px;display:flex;position:absolute}.m-panel .plinth{display:none}.mock:is([data-style=warm],[data-style=black]) .m-caret{display:block}.mock:is([data-style=warm],[data-style=black]) .m-top{padding-inline-start:0}.mock:is([data-style=warm],[data-style=black]) .m-pills{height:calc(48 * var(--u));background:0 0;padding:0}.mock:is([data-style=warm],[data-style=black]) .m-pills>span{height:calc(48 * var(--u));padding-inline:calc(17 * var(--u))}.mock:is([data-style=warm],[data-style=black]) .m-pills .on{background:var(--m-surface);color:var(--m-fg);border-radius:calc(8 * var(--u));font-weight:700}.mock:is([data-style=warm],[data-style=black]) .m-search{background:var(--m-surface)}.mock:is([data-style=warm],[data-style=black]) .m-view-grid{gap:calc(36 * var(--u));padding:calc(10 * var(--u)) calc(36 * var(--u)) 0 calc(28 * var(--u))}.mock:is([data-style=warm],[data-style=black]) .m-grid{--tile:calc(340 * var(--u));gap:calc(8 * var(--u))}.mock:is([data-style=warm],[data-style=black]) .cover .art{border-radius:calc(6 * var(--u));overflow:hidden}.mock:is([data-style=warm],[data-style=black]) .cover .name{display:none}.mock:is([data-style=warm],[data-style=black]) .cover .name-in{padding:calc(40 * var(--u)) calc(8 * var(--u)) calc(11 * var(--u));text-align:center;white-space:nowrap;text-overflow:ellipsis;color:#fff;font-size:calc(12.5 * var(--u));background:linear-gradient(#0000,#000000db);font-weight:600;display:block;position:absolute;inset:auto 0 0;overflow:hidden}.mock:is([data-style=warm],[data-style=black]) .cover .fav{left:calc(8 * var(--u));top:calc(8 * var(--u));padding:calc(3 * var(--u));background:0 0;bottom:auto;right:auto}.mock:is([data-style=warm],[data-style=black]) .cover[aria-selected=true] .art{outline-width:calc(2 * var(--u));outline-offset:calc(-2 * var(--u))}.mock:is([data-style=warm],[data-style=black]) .m-actions{display:none}.mock:is([data-style=warm],[data-style=black]) .m-info strong{text-align:start}.mock:is([data-style=warm],[data-style=black]) .m-hints kbd{border:calc(1 * var(--u)) solid var(--m-muted);color:var(--m-muted);background:0 0}.mock-figure figcaption{color:var(--muted);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px 24px;margin-top:14px;font-size:13.5px;display:flex}.mock-figure figcaption>span:first-child{flex:320px}.mock-themes{background:var(--surface);border-radius:999px;flex-wrap:wrap;gap:4px;padding:4px;display:inline-flex}.mock-themes button{color:var(--muted);font:inherit;cursor:pointer;min-height:32px;transition:color .16s var(--ease), background-color .16s var(--ease);background:0 0;border:0;border-radius:999px;padding:6px 14px}.mock-themes button:hover{color:var(--fg)}.mock-themes button[aria-pressed=true]{background:var(--inverse);color:var(--on-inverse);font-weight:600}.mock-themes button:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.model-license{color:var(--muted);margin-top:8px;font-size:12.5px}@media (width<=640px){.mock{aspect-ratio:4/3}.mock *{--u:calc(100cqw / 760)}.m-pills>span:nth-child(n+5),.m-search{display:none}.m-view-grid,.mock:is([data-style=warm],[data-style=black]) .m-view-grid{grid-template-columns:calc(230 * var(--u)) minmax(0, 1fr);gap:calc(20 * var(--u));padding-inline:calc(16 * var(--u))}.m-grid,.mock:is([data-style=warm],[data-style=black]) .m-grid{--tile:calc(210 * var(--u))}.m-view-list{grid-template-columns:calc(64 * var(--u)) minmax(0, 1fr);gap:calc(10 * var(--u));padding-inline:calc(10 * var(--u))}.m-rail-item{width:calc(60 * var(--u))}.m-panel,.m-hints span:nth-child(n+4){display:none}}@media (prefers-reduced-motion:reduce){.mock:before{transition:none}}.platform-groups:where(.astro-sjudcz26){border-top:1px solid var(--line)}.platform-groups:where(.astro-sjudcz26)>div:where(.astro-sjudcz26){border-bottom:1px solid var(--line);grid-template-columns:minmax(96px,.2fr) minmax(0,1fr);gap:16px;padding:14px 4px;display:grid}dt:where(.astro-sjudcz26){font-weight:700}dd:where(.astro-sjudcz26){color:var(--muted)}
