html body.jd-play, html.dark-mode body.jd-play {
    --play-ink: #171717;
    --play-paper: #f4f1e8;
    --text-color: #171717;
    --accent-pink: #a81e59;
    --border-color: #171717;
    background: #f4f1e8 !important;
    color: #171717;
}
.jd-play #play-hub-page { width: 100% !important; max-width: none; margin: 0; padding: 0; border: 0; border-radius: 0; box-shadow: none; overflow: visible; background: var(--jd-paper); }
.jd-play .play-hero { padding: 52px 6% 36px; min-height: 0; display: grid; grid-template-columns: 1fr 1fr; gap: 8%; align-items: center; background: var(--jd-pink); border: 0; overflow: visible; }
.jd-play .play-hero h1 { font-family: 'Anton', Impact, sans-serif; font-size: 180px; font-weight: 400; line-height: .98; }
.jd-play .play-kicker, .jd-play .play-card-label { color: inherit; font-size: 12px; font-weight: 700; }
.jd-play .play-intro { font-size: 19px; font-weight: 400; max-width: 420px; line-height: 1.5; opacity: 1; }
.jd-play .play-quick-actions { display: grid; grid-template-columns: 1fr; gap: 0; }
.jd-play .play-quick-actions a { padding: 14px 0; border: 0; border-bottom: 1px solid var(--jd-ink); background: transparent !important; box-shadow: none; border-radius: 0; color: var(--jd-ink); font-size: 20px; font-weight: 600; min-height: 48px; justify-content: space-between; }
.jd-play .play-quick-actions a::after { content: '\2197'; }
.jd-play .play-quick-actions a:hover { transform: none; box-shadow: none; color: #fff; }
html body.jd-play .play-bots-websource { height: 135px; aspect-ratio: auto; background: var(--jd-pink); border: 0; overflow: visible; z-index: 2; }
html body.jd-play .play-bots-websource::after { display: none; }
.jd-play .play-bots-websource iframe { height: 460px; bottom: -38px; }
.jd-play .play-dashboard { display: block; padding: 0; background: none; }
.jd-play .play-card { margin: 0; border: 0; border-radius: 0; box-shadow: none; overflow: visible; }
.jd-play .play-card-content { gap: 20px; padding: 0; min-width: 0; }
.jd-play .play-card-content p:not(.play-card-label) { font-size: 19px; font-weight: 400; line-height: 1.5; max-width: 470px; }
.jd-play .play-card h2 { font-family: 'Anton', Impact, sans-serif; font-size: 104px; font-weight: 400; line-height: 1.02; text-align: left; }
.jd-play .play-action { margin-top: 10px; padding: 15px 24px; border: 0; border-radius: 2px; box-shadow: none; font-size: 16px; font-weight: 700; background: var(--jd-ink); color: var(--jd-paper); }
.jd-play .play-action:hover { box-shadow: none; background: #a81e59; }
.jd-play .play-action.subtle { background: transparent; padding: 10px 0; margin-right: 15px; border-bottom: 1px solid currentColor; color: inherit; border-radius: 0; }
.jd-play .play-card-word { display: grid; grid-template-columns: 1fr 1fr; align-items: center; gap: 10%; background: var(--jd-paper); padding: 90px 8%; }
.jd-play .play-card-word .play-card-content { padding: 0; }
.jd-play .play-card-word .play-side-panel { padding: 0; border: 0; background: none; }
.jd-play .play-section-heading { align-items: baseline; flex-wrap: wrap; gap: 10px; }
.jd-play .play-section-heading span { font-size: 14px; font-weight: 700; }
.jd-play .play-section-heading a { color: inherit; text-decoration: underline; text-underline-offset: 5px; font-size: 13px; }
.jd-play .play-card-word .wm-advert-grid { gap: 6px; margin: 0; }
.jd-play .play-card-word .wm-advert-tile { width: 40px; height: 40px; border: 2px solid var(--jd-ink); background: transparent; border-radius: 0; box-shadow: none; transform: rotate(-3deg); }
.jd-play .play-card-word .wm-advert-tile:nth-child(even) { transform: rotate(3deg); background: var(--jd-purple); }
.jd-play .wm-advert-complete { background: none; border: 0; border-left: 3px solid var(--jd-ink); border-radius: 0; padding: 6px 14px; }
.jd-play #wordmaxxing-top-container .wm-top-item, .jd-play .catnip-top-item, .jd-play .race-top-item { background: transparent !important; border: 0 !important; border-bottom: 1px solid #938c8a !important; border-radius: 0 !important; padding: 16px 0 !important; box-shadow: none !important; }
.jd-play #wordmaxxing-top-container .wm-name { font-size: 17px !important; }
.jd-play #wordmaxxing-top-container .wm-score { font-size: 14px !important; color: #a81e59 !important; }
.jd-play .wm-mini-grid { background: none !important; }
.jd-play .play-card-escape { display:grid; grid-template-columns:minmax(0,.9fr) minmax(0,1fr); column-gap:5%; background:var(--jd-pink); padding:60px 8% 0; position:relative; z-index:1; }
.breakout-podium { grid-column:1/-1; padding:32px 0 48px; border-top:2px solid #171717; }
.breakout-podium h3 { font-family:'Anton',Impact,sans-serif; font-size:32px; font-weight:400; }
.breakout-podium > p { font-size:14px; margin:10px 0 24px; }
#breakout-winners { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:24px; }
.breakout-winner { display:flex; gap:12px; align-items:center; min-width:0; }
.breakout-winner > strong { font-size:36px; }
.breakout-winner img { width:52px; height:52px; object-fit:contain; }
.breakout-winner > div { min-width:0; overflow-wrap:anywhere; }
.breakout-winner span { display:block; font-size:13px; margin-top:4px; }
@media(max-width:700px) { #breakout-winners { grid-template-columns:1fr; } .breakout-podium h3 {font-size:26px;} }
.jd-play .play-escape-heading { display:contents; background:transparent; }
.jd-play .play-escape-heading > div:first-child { grid-column:1 / -1; grid-row:1; position:relative; margin-bottom:0; z-index:2; pointer-events:none; }
.jd-play .play-card-escape .play-escape-heading h2 { font-size:160px; line-height:1; margin:0; position:relative; -webkit-text-stroke:3px var(--jd-pink); paint-order:stroke fill; }
.jd-play .play-escape-copy { grid-column:1; grid-row:2; max-width:350px; font-size:19px; line-height:1.5; padding:20px 0 40px; }
.jd-play .play-escape-note { font-size:13px; margin-top:22px; }
.jd-play .play-escape-scene { grid-column:2; grid-row:1 / 3; display:block; width:min(640px,100%); margin:150px 0 40px; position:relative; align-self:end; justify-self:end; }
.jd-play #escape-room-preview { display:block; position:static; inset:auto; transform:none; width:100%; height:auto; aspect-ratio:5/4; }
@media(max-width:760px) {
    .jd-play .play-card-escape .play-escape-heading h2 { font-size:72px; }
    .jd-play .play-escape-copy { grid-column:1; grid-row:3; padding:24px 0 0; font-size:17px; }
    .jd-play .play-escape-scene { grid-column:1; grid-row:2; width:92%; max-width:420px; margin:-30px 0 0; }
    .jd-play .play-card-escape { grid-template-columns:minmax(0,1fr); padding:40px 7% 32px; }
}
@media(min-width:761px) and (max-width:1050px) {
    .jd-play .play-card-escape .play-escape-heading h2 { font-size:122px; }
    .jd-play .play-escape-scene { margin-top:150px; }
}
@media(max-width:380px) { .jd-play .play-card-escape .play-escape-heading h2 { font-size:64px; } }
.jd-play #catnip-score-section { display: block; background: var(--jd-paper); }
.jd-play .play-catnip-intro { min-height: 510px; padding: 50px 8% 0; gap: 20px; border: 0; overflow: visible; background: url('/images/catnip-mountain/level/mountain-background-handdrawn.png?v=1') center / cover no-repeat; color: var(--jd-ink); }
.jd-play .play-catnip-intro h2 { color: var(--jd-paper) !important; -webkit-text-stroke: 3px var(--jd-ink); paint-order: stroke fill; text-shadow: none; font-size: 112px; }
.jd-play .play-catnip-intro p:not(.play-card-label) { color: var(--jd-ink); text-shadow: none; font-size: 18px; font-weight: 600; max-width: 440px; }
.jd-play .play-catnip-intro .play-card-label { padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; }
.jd-play .play-catnip-intro::after { height: 30px; bottom: 0; background-size: auto 30px; }
.jd-play .play-catnip-intro .catnip-scene-floor { min-height: 160px; padding-bottom: 25px; }
.jd-play #catnip-buddy-preview { width: 260px; height: 260px; flex-basis: 260px; margin-top: -120px; transform: translateY(58px); }
.jd-play .catnip-leaderboards { grid-template-columns: 1fr 1fr; gap: 10%; padding: 48px 8% 66px; background: var(--jd-paper); }
.jd-play .catnip-score-board { padding: 0; border: 0; }
.jd-play .catnip-top-name { color: var(--jd-ink); }
.jd-play .catnip-top-meta { color: #a81e59; }
.jd-play .play-card-bot { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; gap: 8%; align-items: center; padding: 56px 8%; background: var(--jd-purple); container-type: normal; }
.jd-play .play-card-bot > .play-bot-stage { grid-column: 2; grid-row: 1; }
.jd-play .play-card-bot > .play-card-content { grid-column: 1; grid-row: 1; }
.jd-play .play-bot-stage { background: transparent; min-height: 480px; padding: 0; overflow: visible; grid-template-rows: auto minmax(360px,1fr) auto; }
.jd-play .play-bot-stage::before { display: none; }
.jd-play .preview-bot-name { font-family: 'DM Sans', Arial, sans-serif; font-size: 21px; font-weight: 700; color: var(--jd-ink); text-shadow: none; }
.jd-play .play-bot-status { color: var(--jd-ink); justify-content: center; gap: 28px; }
.jd-play .play-battery { --battery-color: #171717; }
.jd-play .play-bot-stage > .play-status-text { color: var(--jd-ink); display: grid; place-content: center; font-size: 18px; }
.jd-play .play-bot-guest { position: relative; width: 100%; height: 450px; grid-row: 1 / -1; }
.jd-play .play-bot-guest img { position: absolute; width: 100%; height: 100%; object-fit: contain; }
.jd-play .play-bot-guest img:last-child { top: -18.5%; }
.jd-play .play-card-shop { display: grid; grid-template-columns: 1fr 1fr; grid-template-rows: auto; align-items: center; gap: 8%; padding: 76px 8%; background: var(--jd-ink); color: var(--jd-paper); container-type: normal; }
.jd-play .play-card-shop > .play-shop-image { grid-column: 2; grid-row: 1; }
.jd-play .play-card-shop > .play-card-content { grid-column: 1; grid-row: 1; }
.jd-play .play-card-shop h2 { color: var(--jd-pink); }
.jd-play .play-shop-image { background: transparent; border: 0; height: 470px; overflow: visible; transform: rotate(4deg); }
.jd-play .play-shop-image img { inset: -100px 0 0; width: 100%; height: 570px; }
.jd-play .play-card-shop .play-action { background: var(--jd-paper); color: var(--jd-ink); }
.jd-play .play-lower-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 64px 8%; padding: 70px 8%; margin: 0; background: var(--jd-purple); }
.jd-play .play-community-title { grid-column: 1 / -1; font-size: 112px; line-height: 1.02; }
.jd-play .play-lower-grid .play-card { background: transparent; padding: 0; border: 0; box-shadow: none; }
.jd-play .play-card-race h2 { font-size: 54px; }
.play-race-actions { display:flex; gap:12px; flex-wrap:wrap; align-items:center; }
#play-race-state { min-height:24px; }
.jd-play .play-card-race .race-track-lines { display: none; }
.jd-play .play-card-race .play-card-content { padding: 0; }
.jd-play .play-card-race .race-top-name { color: var(--jd-ink); }
.jd-play .play-card-race .race-top-meta { color: var(--jd-ink); opacity: .8; }
.jd-play .play-card-poll .poll-post { background: none !important; border: 0 !important; border-radius: 0 !important; padding: 0 !important; box-shadow: none !important; }
.jd-play .play-card-poll .poll-question { font-family: 'DM Sans', Arial, sans-serif; color: var(--jd-ink); font-size: 27px; line-height: 1.2; }
.jd-play .play-card-poll .poll-option { background: var(--jd-paper); color: var(--jd-ink); border: 1px solid var(--jd-ink); border-radius: 2px; box-shadow: none; }
.jd-play .play-card-lounge { grid-column: 1 / -1; }
.jd-play .play-card-lounge .homepage-post-wrapper { border: 2px solid var(--jd-ink); border-radius: 2px !important; background: var(--jd-paper); box-shadow: 5px 5px 0 var(--jd-ink); grid-template-rows: auto auto; }
.jd-play .play-card-lounge .link-post-content { height: auto; aspect-ratio: 16/10; background: var(--jd-ink); }
.jd-play.play-hub-page .play-card-word #wordmaxxing-top-container .wm-top-item { background: transparent !important; border: 0 !important; border-bottom: 1px solid #938c8a !important; border-radius: 0 !important; padding: 16px 0 !important; }
.jd-play .play-empty-scores { padding: 22px 0; border-top: 1px solid var(--jd-ink); color: var(--jd-ink); font-size: 17px; }
.jd-play .play-card-lounge .post-info { background: var(--jd-paper); color: var(--jd-ink); }
.jd-play .play-card-lounge .homepage-post-blur-background { display: none; }
.jd-play [hidden] { display: none !important; }
@media(max-width:1050px) {
    .jd-play .play-hero h1 { font-size: 150px; }
    .jd-play .play-card h2 { font-size: 80px; }
    .jd-play .play-card-race h2 { font-size: 42px; }
    .jd-play .play-catnip-intro h2 { font-size: 94px; }
    .jd-play .play-community-title { font-size: 94px; }
    .jd-play #catnip-buddy-preview { width: 210px; height: 210px; flex-basis: 210px; }
}
@media(max-width:760px) {
    .jd-play .play-hero { grid-template-columns: 1fr; gap: 24px; padding: 34px 7% 12px; }
    .jd-play .play-hero h1 { font-size: 128px; }
    .jd-play .play-intro { font-size: 17px; }
    .jd-play .play-quick-actions a { font-size: 16px; padding: 10px 0; min-height: 44px; }
    html body.jd-play .play-bots-websource { height: 90px; }
    .jd-play .play-card-word, .jd-play .play-card-bot, .jd-play .play-card-shop { grid-template-columns: 1fr; gap: 38px; padding: 60px 7%; }
    .jd-play .play-card h2 { font-size: 74px; }
    .jd-play .play-card-content p:not(.play-card-label) { font-size: 17px; }
    .jd-play .play-card-word .wm-advert-tile { width: 30px; height: 30px; }
    .jd-play .play-catnip-intro { padding: 42px 7% 0; min-height: 470px; }
    .jd-play .play-catnip-intro h2 { font-size: 66px; }
    .jd-play .play-catnip-intro p:not(.play-card-label) { font-size: 16px; max-width: 280px; }
    .jd-play #catnip-buddy-preview { width: 140px; height: 140px; flex-basis: 140px; margin-top: 0; transform: translateY(44px); }
    .jd-play .play-catnip-intro .catnip-scene-floor { min-height: 170px; gap: 4px; }
    .jd-play .play-catnip-intro .play-action { padding: 12px; font-size: 14px; }
    .jd-play .catnip-leaderboards { grid-template-columns: 1fr; gap: 32px; padding: 36px 7% 48px; }
    .jd-play .play-card-bot > .play-card-content, .jd-play .play-card-shop > .play-card-content { grid-column: 1; grid-row: 1; }
    .jd-play .play-card-bot > .play-bot-stage, .jd-play .play-card-shop > .play-shop-image { grid-column: 1; grid-row: 2; }
    .jd-play .play-bot-stage { min-height: 390px; grid-template-rows: auto minmax(300px,1fr) auto; }
    .jd-play .play-bot-guest { height: 360px; }
    .jd-play .play-shop-image { height: 350px; transform: rotate(3deg); }
    .jd-play .play-shop-image img { inset: 0; height: 100%; }
    .jd-play .play-lower-grid { grid-template-columns: 1fr; gap: 48px; padding: 54px 7%; }
    .jd-play .play-community-title { font-size: 68px; }
    .jd-play .play-card-race h2 { font-size: 44px; }
    .jd-play .play-action-row { gap: 12px; }
}
@media(max-width:380px) {
    .jd-play .play-catnip-intro h2 { font-size: 56px; }
    .jd-play .play-community-title { font-size: 59px; }
    .jd-play #catnip-buddy-preview { width: 115px; height: 115px; flex-basis: 115px; }
}

/* The personal Buddy shares the opening area rather than occupying another band. */
.jd-play .play-hero { grid-template-columns:minmax(0,1fr) minmax(0,1fr); column-gap:10%; row-gap:22px; padding:38px 8% 18px; align-items:start; }
.jd-play .play-hero-copy { grid-column:1; grid-row:1; align-self:end; }
.jd-play .play-hero .play-quick-actions { grid-column:1; grid-row:2; }
.jd-play .play-hero #my-bot-status-section { grid-column:2; grid-row:1 / 3; display:flex; flex-direction:column; gap:20px; padding:0; background:transparent; min-width:0; position:relative; isolation:isolate; }
.jd-play .play-hero .play-bot-stage { width:100%; height:530px; min-height:0; display:grid; grid-template-rows:auto minmax(0,1fr) auto; gap:14px; position:relative; z-index:1; }
.jd-play .play-hero .play-bot-portrait { min-height:0; }
.jd-play .play-hero .play-bot-guest { height:500px; max-width:520px; margin:0 auto; }
.jd-play .play-hero #my-bot-status-section .play-card-content { width:100%; display:flex; flex-direction:column; gap:8px; }
.jd-play .play-hero #my-bot-status-section h2 { position:absolute; top:220px; left:-26px; font-size:112px; line-height:1; margin:0; z-index:2; pointer-events:none; -webkit-text-stroke:3px var(--jd-pink); paint-order:stroke fill; }
.jd-play .play-hero #play-bot-preview-container .bot-entity-wrapper { left:57%; }
.jd-play .play-hero .play-bot-status { gap:18px 30px; min-height:44px; font-size:21px; }
.jd-play .play-hero .play-bot-stat-icon { font-size:32px; }
.jd-play .play-hero .play-bot-stat-value { font-size:21px; min-width:4ch; }
.jd-play .play-hero .play-battery { width:48px; height:26px; gap:3px; padding:3px; }
.jd-play .play-hero .play-battery::after { top:7px; height:8px; }
.jd-play .play-hero #play-bot-status-msg { font-size:15px; line-height:1.4; margin:0; }
.jd-play .play-hero .play-action-row { flex-wrap:wrap; gap:10px 18px; align-items:center; }
.jd-play .play-hero .play-action { margin-top:0; padding:12px 16px; font-size:14px; }
.jd-play .play-hero .play-action.subtle { padding:10px 0; margin-right:0; }
.jd-play .play-hero .preview-bot-name { padding:0; text-align:center; font-size:25px; }
.jd-play .play-card-word { padding-bottom:90px; }
html body.jd-play #buddy-escape-section + #magic-shop-entry-section { padding-top:68px; }
@media(max-width:760px) {
    .jd-play .play-hero { grid-template-columns:minmax(0,1fr); gap:24px; padding:28px 7% 12px; }
    .jd-play .play-hero-copy { grid-column:1; grid-row:1; }
    .jd-play .play-hero #my-bot-status-section { grid-column:1; grid-row:2; gap:16px; }
    .jd-play .play-hero .play-quick-actions { grid-column:1; grid-row:3; }
    .jd-play .play-hero .play-bot-stage { height:430px; }
    .jd-play .play-hero .play-bot-guest { height:400px; max-width:360px; }
    .jd-play .play-hero #my-bot-status-section h2 { font-size:80px; top:190px; left:-4px; }
    .jd-play .play-hero #play-bot-preview-container .bot-entity-wrapper { left:54%; }
    .jd-play .play-hero .play-bot-status { gap:14px 22px; font-size:19px; }
    .jd-play .play-hero .play-bot-stat-value { font-size:19px; }
    .jd-play .play-hero .play-action-row { gap:10px 14px; }
    .jd-play .play-card-word { padding-bottom:60px; }
    html body.jd-play #buddy-escape-section + #magic-shop-entry-section { padding-top:38px; }
}
