/* Large programme artwork, a restrained glass frame, and a useful orientation. */
body.v10-catalogue-page:not(.admin){padding:0}
body.v10-catalogue-page:not(.admin) #app .v10-catalogue{gap:9px;padding:10px 14px 4px}
#app .v10-game-grid{grid-template-columns:minmax(0,1fr);grid-template-rows:repeat(var(--catalog-rows,1),minmax(0,1fr));gap:12px;touch-action:pan-y;min-height:140px}
#app .v10-game-tile{border-radius:16px;box-shadow:0 12px 30px #08061480,inset 0 1px #ffecb34d;border-color:#ccb27e56;min-height:0}
#app .v10-tile-scene{inset:0 0 64px;background:radial-gradient(ellipse at 50% 40%,#544163,#171022)}
#app .v10-tile-scene>.v10-poster-img{object-fit:cover;object-position:center 44%;filter:none}
#app .v10-tile-light{background:linear-gradient(0deg,#18132270,transparent 30%);box-shadow:inset 0 1px #fff3}
body.bibak-refined #app .v10-tile-caption,#app .v10-tile-caption{height:66px;padding:8px 13px;gap:9px;background:linear-gradient(120deg,#342741f5,#21172ef5);border-top:1px solid #e4c78155}
#app .v10-tile-icon,#app .v10-tile-icon svg{width:46px;height:46px;flex-basis:46px}
#app .v10-tile-name strong{font-size:22px;line-height:1.5;letter-spacing:-.5px}
body.bibak-refined #app .v10-tile-name small,#app .v10-tile-name small{font-size:11px;color:#d4c6dc;line-height:1.6}
#app .v10-tile-arrow{display:flex;align-items:center;gap:6px;white-space:nowrap;color:#f7d98d;border:1px solid #edcf8759;background:#efd07d12;border-radius:7px;padding:7px 8px;font-size:10px}
#app .v10-tile-arrow svg{width:14px;height:14px}
#app .v10-tile-number{top:10px;right:11px;font-size:11px;padding:3px 6px;color:#ffe9b7;border-color:#e2ca8e77}
#app .v10-tile-record{top:10px;left:11px;font-size:10px;padding:4px 7px;max-width:65%;color:#f6e7ff;background:#21172fd9;border-color:#b9a1d36b}
#app .v10-pagination{min-height:44px;flex:0 0 44px;gap:7px}
#app .v10-page-center{min-width:0;gap:1px;flex-direction:column}
#app .v10-page-count{font-size:10px;line-height:1.3;color:#e3d6eb}
#app .v10-page-dots{max-width:100%;gap:0}
#app .v10-page-dots button{width:19px;min-width:0;height:24px;min-height:24px;flex:1;padding:0}
#app .v10-page-dots i{width:4px;height:4px;border-radius:1px}
#app .v10-page-dots [aria-pressed=true] i{width:12px}
#app .v10-page-arrow{border-radius:10px;border-color:#c3aad94d;background:linear-gradient(140deg,#66547733,#2a203c88)}
#app .v10-filters{flex-basis:42px;min-height:42px}
#app .v10-filters button{min-height:36px;height:36px}
#app .v10-catalogue-heading{flex-basis:34px;min-height:34px}
#app .v10-catalogue-heading h2{font-size:17px}
#app .v10-player-choice{min-height:34px;font-size:10px}
#app .v10-night-link{display:none}
#app .v10-game-tile:focus-visible,#app .v10-page-arrow:focus-visible,#app .v10-page-dots button:focus-visible{outline:2px solid #ffe58b;outline-offset:-3px}
/* Practice is still a library: two spacious rows on taller phones. */
#app .v10-game-grid[data-visible-count="2"] .v10-tile-caption{height:56px}
#app .v10-game-grid[data-visible-count="2"] .v10-tile-scene{bottom:54px}
#app .v10-game-grid[data-visible-count="2"] .v10-tile-name strong{font-size:18px}
#app .v10-game-grid[data-visible-count="2"] .v10-tile-icon,#app .v10-game-grid[data-visible-count="2"] .v10-tile-icon svg{width:39px;height:39px;flex-basis:39px}
@media(max-height:700px){
 body.v10-catalogue-page:not(.admin) #app .v10-catalogue{gap:5px;padding:6px 10px 2px}
 #app .v10-game-grid{min-height:120px}
 #app .v10-filters{flex-basis:36px;min-height:36px;padding:1px}
 #app .v10-filters button{min-height:32px;height:32px;font-size:10px}
 #app .v10-catalogue-heading{flex-basis:29px;min-height:29px}
 #app .v10-catalogue-heading h2{font-size:15px}
 #app .v10-player-choice{min-height:29px}
 body.bibak-refined #app .v10-tile-caption,#app .v10-tile-caption{height:55px;padding:5px 10px;gap:7px}
 #app .v10-tile-scene{bottom:53px}
 #app .v10-tile-icon,#app .v10-tile-icon svg{width:37px;height:37px;flex-basis:37px}
 #app .v10-tile-name strong{font-size:18px}
 body.bibak-refined #app .v10-tile-name small,#app .v10-tile-name small{font-size:9px}
 #app .v10-tile-arrow{padding:6px;font-size:9px}
 #app .v10-tile-number,#app .v10-tile-record{font-size:9px;top:7px}
}
@media(max-width:350px){#app .v10-tile-arrow{padding:6px}#app .v10-tile-arrow span{display:none}#app .v10-page-dots button{width:16px}}
/* The three slides demonstrate the action using original show characters and posters. */
.quick-start-dialog{width:min(460px,calc(100vw - 24px));border-radius:19px;background:linear-gradient(145deg,#40304feF,#1a1328fa);box-shadow:0 28px 90px #000b,inset 0 1px #fff4}
.quick-shell{gap:12px;padding:18px}
.quick-visual{position:relative;height:220px;flex:none;isolation:isolate;border-radius:14px;border-color:#cfb38752;background:radial-gradient(ellipse at 50% 0,#67527a,#191326 72%);box-shadow:inset 0 1px #fff2,0 8px 22px #07040b33}
.quick-visual>div{position:absolute;inset:0;overflow:hidden;isolation:isolate}
.quick-visual img{pointer-events:none;user-select:none;-webkit-user-select:none;width:100%;height:100%;object-fit:cover}
.quick-visual .quick-world-back{position:absolute;inset:0;object-fit:cover;opacity:.38;filter:saturate(.7)}
.quick-team-world:after{content:'';position:absolute;inset:0;background:linear-gradient(0deg,#110c22ce,transparent 60%);z-index:-1}
.quick-scene-label{position:absolute;z-index:3;top:9px;right:11px;border:1px solid #eccd8b4a;border-radius:5px;background:#21172ed9;color:#f7dfa4;padding:4px 8px;font-size:9px;line-height:1.6}
.quick-team-line{position:absolute;bottom:10px;left:20px;right:20px;display:flex;align-items:end;justify-content:center;gap:11px;height:calc(100% - 44px)}
.quick-team-card{position:relative;display:flex;align-items:center;justify-content:end;flex-direction:column;min-width:0;flex:1;height:100%;--team:#fb8a6f}
.quick-team-card.blue{--team:#65bdff}.quick-team-card.green{--team:#98d48b}
.quick-team-card:before{content:'';position:absolute;inset:28% 0 0;border-radius:8px;border:1px solid color-mix(in srgb,var(--team) 50%,transparent);background:linear-gradient(160deg,color-mix(in srgb,var(--team) 19%,transparent),#1a122680);box-shadow:inset 0 1px #fff2;z-index:-1}
.quick-team-card img{width:100%;height:calc(100% - 27px);object-fit:contain;object-position:center bottom;filter:drop-shadow(0 7px 5px #0007);animation:quick-arrive .4s ease both}
.quick-team-card:nth-child(2) img{animation-delay:.06s}.quick-team-card:nth-child(3) img{animation-delay:.12s}
.quick-team-card>span{font-size:11px;color:var(--team);height:27px;line-height:27px;white-space:nowrap}
.quick-play-scene{background:linear-gradient(120deg,#493154,#181027)}
.quick-visual .quick-programme-screen{position:absolute;width:71%;height:71%;left:13px;top:15px;border:4px solid #cbb48d;border-radius:6px;object-fit:cover;box-shadow:0 6px 20px #0006;transform:rotate(-3deg)}
.quick-television-label{position:absolute;bottom:22px;left:33px;color:#dfc99b;font-size:10px}
.quick-phone{position:absolute;right:21px;top:22px;width:160px;height:184px;border:3px solid #bba3d0;border-radius:17px;padding:11px 10px 7px;background:linear-gradient(135deg,#372745,#181126);box-shadow:-8px 9px 22px #0804149c,inset 0 1px #fff3;transform:rotate(4deg);display:flex;flex-direction:column;gap:6px;animation:quick-arrive .4s ease both}
.quick-phone-top{display:flex;align-items:center;justify-content:space-between;color:#bdb1ce;font-size:8px;gap:6px}
.quick-phone-top>b{display:flex;align-items:center;gap:3px;color:#ffe28b;font-size:19px;line-height:1.2}.quick-phone-top small{font-size:7px;font-weight:400}
.quick-phone-time{height:3px;border-radius:3px;background:#8f76a444;overflow:hidden}.quick-phone-time i{height:100%;width:75%;display:block;background:#efd480}
.quick-phone>strong{font-size:10px;font-weight:500;line-height:1.9;text-align:right;color:#fff2db}
.quick-phone-options{display:grid;grid-template-columns:1fr 1fr;gap:5px;flex:1}
.quick-phone-options>span{display:flex;align-items:center;justify-content:space-between;padding:2px 9px;font-size:10px;border-radius:5px;border:1px solid #a48bbc5e;background:#a585bd13;color:#dfd0eb}
.quick-phone-options .chosen{border-color:#9ad7b2;background:#3f715744;color:#d4f6df}.quick-phone-options i{font-style:normal}
.quick-phone-saved{font-size:8px;color:#a7d6b6;text-align:center}
.quick-mini-poster{position:absolute;top:28px;width:61%;height:72%;border-radius:8px;border:2px solid #ccb58b;overflow:hidden;box-shadow:0 12px 20px #080410a8;background:#20162d}
.quick-mini-poster img{object-fit:cover;object-position:center}.quick-mini-poster>span{position:absolute;bottom:0;left:0;right:0;padding:5px 10px;text-align:right;font-size:11px;color:#ffe8af;background:linear-gradient(0deg,#1a112cf7,#271b36d9)}
.quick-poster-back{left:13px;transform:rotate(-9deg) translateY(2px);filter:brightness(.82)}
.quick-poster-front{right:13px;transform:rotate(7deg);animation:quick-arrive .4s ease both}
.quick-record-label{position:absolute;bottom:9px;right:50%;transform:translateX(50%);font-size:12px;white-space:nowrap;background:linear-gradient(130deg,#f5d58c,#b69963);color:#291d37;padding:4px 14px;border-radius:6px;box-shadow:0 4px 12px #0007;border:1px solid #fff2cc90}
.quick-copy{min-height:137px}.quick-copy h2{font-size:22px;line-height:1.6;margin:5px 0 8px}.quick-copy p{font-size:13px;line-height:1.9;color:#e0d5e9}
.quick-count{font-size:10px;letter-spacing:.1px;color:#d9bf83}
.quick-dots button{min-height:30px}.quick-dots button:after{top:12px}
@keyframes quick-arrive{from{opacity:.3;translate:0 8px}to{opacity:1;translate:0 0}}
@media(max-height:700px){
 .quick-shell{padding:13px;gap:7px}
 .quick-visual{height:160px}
 .quick-copy{min-height:130px}.quick-copy h2{font-size:19px;margin:3px 0 5px}.quick-copy p{font-size:12px;line-height:1.85}
 .quick-team-line{bottom:7px;left:14px;right:14px;gap:8px;height:calc(100% - 34px)}
 .quick-team-card>span{font-size:10px;height:23px;line-height:23px}.quick-team-card img{height:calc(100% - 23px)}
 .quick-scene-label{font-size:8px;top:6px;right:8px;padding:2px 6px}
 .quick-phone{height:139px;top:12px;right:16px;width:135px;padding:7px 8px 5px;gap:3px;border-width:2px;border-radius:13px}
 .quick-phone-top>b{font-size:15px}.quick-phone>strong{font-size:8px;line-height:1.6}.quick-phone-options>span{font-size:9px;padding:1px 7px}.quick-phone-saved{font-size:7px}
 .quick-television-label{bottom:14px;font-size:9px}.quick-mini-poster{top:21px;height:71%}.quick-mini-poster>span{font-size:9px;padding:3px 8px}.quick-record-label{font-size:10px;padding:3px 10px;bottom:5px}
}
@media(max-height:580px){
 .quick-visual{height:135px}.quick-shell{gap:6px}.quick-copy{min-height:126px}.quick-copy p{font-size:11px;line-height:1.85}.quick-copy h2{font-size:18px}
 .quick-shell header img{width:80px}.quick-skip,.quick-back{font-size:10px;padding:4px 8px}.quick-next{min-height:44px;font-size:13px}
 .quick-phone{height:116px;top:10px;width:121px;padding:6px 7px;gap:2px;border-radius:11px}.quick-phone-top{font-size:6px}.quick-phone-top>b{font-size:12px}.quick-phone-options>span{font-size:8px}.quick-phone>strong{font-size:7px}.quick-phone-saved{font-size:6px}
 .quick-team-line{height:calc(100% - 29px)}.quick-team-card>span{height:20px;line-height:20px;font-size:9px}.quick-team-card img{height:calc(100% - 20px)}
}
@media(prefers-reduced-motion:reduce){.quick-visual *{animation:none!important;transition:none!important}#app .v10-game-tile:hover .v10-poster-img{transform:none}}