.ps2-showcase { flex: 0 0 min(408px, 36%); width: min(408px, 100%); min-width: 0; align-self: flex-end; margin-left: auto; }
.ps2-showcase[hidden] { display: none; }
.ps2-setup { position: relative; width: 100%; min-width: 0; aspect-ratio: 4 / 3; }
.ps2-clip-definitions { position: absolute; }
.ps2-art { display: block; width: 100%; height: auto; pointer-events: none; }
/* Match the curved glass inside the supplied 1448 × 1086 cutout. */
.ps2-screen { position: absolute; left: 44.8%; top: 17.03%; width: 43.35%; height: 42.65%; overflow: hidden; clip-path: url(#ps2Glass); background: #000; isolation: isolate; }
.ps2-screen img { display: block; width: 100%; height: 100%; object-fit: cover; }
.ps2-screen .sr-only { position: absolute; width: 1px; height: 1px; overflow: hidden; clip-path: inset(50%); white-space: nowrap; }
.ps2-screen::after { content: ''; position: absolute; inset: 0; pointer-events: none; z-index: 1; background: repeating-linear-gradient(0deg, #0002 0, #0002 1px, transparent 1px, transparent 3px), radial-gradient(ellipse at center, transparent 50%, #0005 100%); }
.profile-showcase .ps2-open { position: absolute; inset: 0; width: 100%; padding: 0; border: 0; border-radius: 0; background: transparent; box-shadow: none; transform: none; cursor: pointer; }
.profile-showcase .ps2-open:focus-visible { outline: 3px solid #8d55ef; outline-offset: 3px; }
.ps2-controls { width: min(900px, calc(100vw - 32px)); max-height: calc(100dvh - 32px); overflow-y: auto; margin: auto; padding: 24px; border: 3px solid #25252d; background: #fff9ed; color: #25252d; box-sizing: border-box; }
.ps2-expanded { max-width: min(100%, 64vh); margin: auto; }
/* Beside the panel, the console takes its column whole. */
.has-object-panel .ps2-expanded { max-width: none; }
.ps2-stage > p { text-align: center; }
.ps2-magnifier .ps2-open { display: none; }
.ps2-controls:not([open]) { display: none; }
.ps2-controls::backdrop { background: #191323b3; }
.ps2-controls header { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.ps2-controls h3 { font-size: 36px; margin: 7px 0; }
.ps2-loading { height: 100%; display: flex; flex-direction: column; gap: 12px; align-items: center; justify-content: center; color: #c8d4ff; font: 12px monospace; background: radial-gradient(ellipse at center, #151b44, #000 75%); }
.ps2-loading strong { letter-spacing: 4px; }
.ps2-loading-symbol { font-size: 36px; animation: ps2-spin 3s linear infinite; }
@keyframes ps2-spin { to { transform: rotate(360deg); } }
.motion-reduced .ps2-loading-symbol { animation: none; }
/* Nothing in the console: static, for some, that can be followed. Over the button that opens the console. */
.ps2-screen.is-off-air { z-index: 1; }
.ps2-off-air {
    position: absolute; inset: 0; display: block; cursor: pointer; opacity: .7;
    background: #111 url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='96' height='72'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='1.1' numOctaves='2' stitchTiles='stitch'/%3E%3CfeColorMatrix type='saturate' values='0'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E") 0 0 / 96px 72px;
    filter: contrast(1.8) brightness(.9);
    animation: ps2-snow .4s steps(1, end) infinite;
}
.ps2-off-air:hover, .ps2-off-air:focus-visible { opacity: .85; outline: none; }
@keyframes ps2-snow {
    25% { background-position: 31px 17px; }
    50% { background-position: -23px 41px; }
    75% { background-position: 53px -29px; }
}
.motion-reduced .ps2-off-air { animation: none; }
@media (max-width: 760px) { .ps2-showcase { flex-basis: auto; width: min(336px, 84%); align-self: flex-end; } }

.tv-sticker-surface { position: absolute; left: 38.4%; top: 7.4%; width: 59.5%; height: 70.4%; z-index: 3; pointer-events: none; clip-path: polygon(3% 1%, 94% 1%, 99% 5%, 99% 82%, 95% 98%, 12% 94%, 15% 76%, 1% 75%, 1% 5%); }
.tv-sticker-surface { --sticker-width: 14%; --sticker-height: 16%; }
.tv-sticker-surface.is-editing { clip-path: none; }
