/* Collection pages: murder mysteries, party, kids, printable and escape-room collections. */
.cc{--cc-soft:#f4f1fb;--cc-ink2:#4a4560;--cc-mute:#6b6585;overflow-x:clip}
.cc .section{padding-top:52px;padding-bottom:52px}
.cc .cc-crumbs{padding-top:22px;padding-bottom:0}
.cc-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:flex-end;gap:14px 48px;margin-bottom:30px}
.cc-head h2{font-size:clamp(30px,3.2vw,46px);max-width:620px}
.cc-head p{max-width:470px;margin:0;font-size:16.5px;line-height:1.6;color:var(--cc-ink2)}
.cc-head p .text-link{display:flex;width:fit-content;margin-top:12px;font-size:14.5px}
/* Hero */
.cc .cc-hero{display:grid;grid-template-columns:minmax(0,.95fr) minmax(0,1.1fr);gap:40px 64px;align-items:center;padding-top:26px;padding-bottom:44px}
.cc-hero h1{font-size:clamp(42px,4.8vw,70px);line-height:1;letter-spacing:-.05em;margin:0 0 20px;max-width:11.5ch}
.cc-lede{font-size:19px;line-height:1.6;max-width:540px;margin:0 0 30px;color:#2d2843}
.cc-hero-acts{display:flex;flex-wrap:wrap;align-items:center;gap:16px 30px}
.cc-hero-acts .button{gap:12px}
.cc-hero-img{margin:0;border-radius:26px;overflow:hidden;aspect-ratio:4/3;background:var(--cc-soft);box-shadow:0 28px 56px -30px rgba(32,27,56,.5)}
.cc-hero-img img{width:100%;height:100%;object-fit:cover}
.cc-collage{display:grid;grid-template-columns:minmax(0,1.5fr) minmax(0,1fr);grid-template-rows:1fr 1fr;gap:12px;aspect-ratio:3/2}
.cc-tile{position:relative;margin:0;border-radius:20px;overflow:hidden;background:#e9e4f5;box-shadow:0 22px 44px -30px rgba(32,27,56,.6)}
.cc-tile img{display:block;width:100%;height:100%;object-fit:cover}
.cc-tile--main{grid-row:1/3}
.cc-tile--page{background:#f3eee4;padding:16px 20px 0}
.cc-tile--page img{object-position:top;border-radius:6px 6px 0 0;box-shadow:0 10px 24px -12px rgba(32,27,56,.55)}
.cc-tile figcaption{position:absolute;left:10px;bottom:10px;max-width:calc(100% - 20px);background:rgba(255,255,255,.94);color:var(--ink);border-radius:99px;padding:5px 12px;font-size:12.5px;font-weight:800;line-height:1.3;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.cc-tile--main figcaption{left:14px;bottom:14px;font-size:13.5px;padding:6px 14px}
/* In short: quiet, but first in reading order for answer engines. */
.cc .cc-short{display:grid;grid-template-columns:150px minmax(0,1fr);gap:8px 32px;align-items:baseline;padding-top:0;padding-bottom:12px}
.cc-short h2{font:800 12px/1.5 var(--body);letter-spacing:.14em;text-transform:uppercase;color:var(--cc-mute);padding-top:22px;border-top:2px solid var(--ink);margin:0}
.cc-short p{margin:0;padding-top:20px;border-top:1px solid var(--line);font-size:16.5px;line-height:1.7;color:#3b3650;max-width:none}
.cc-short p a{text-decoration:underline;text-underline-offset:3px}
/* Cards */
.cc-grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:28px}
.cc-card{grid-column:span 4;position:relative;display:flex;flex-direction:column;min-width:0;background:#fff;border:1px solid var(--line);border-radius:22px;overflow:hidden;transition:transform .2s,box-shadow .2s}
.cc-grid[data-cols="4"]>.cc-card,.cc-grid>.cc-quarter{grid-column:span 3}
.cc-grid[data-cols="2"]>.cc-card,.cc-grid>.cc-wide{grid-column:span 6}
.cc-card:hover{transform:translateY(-3px);box-shadow:0 20px 38px -26px rgba(32,27,56,.5)}
.cc-art{position:relative;aspect-ratio:3/2;overflow:hidden;background:var(--cc-soft)}
.cc-grid[data-cols="2"] .cc-art,.cc-wide .cc-art{aspect-ratio:16/9}
.cc-art>a{display:block;height:100%}
.cc-art>a>img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.cc-card:hover .cc-art>a>img{transform:scale(1.03)}
.cc-page{position:absolute;right:16px;bottom:-26px;width:25%;max-width:110px;transform:rotate(6deg);transition:transform .3s}
.cc-page img{display:block;width:100%;height:auto;background:#fff;border-radius:4px;box-shadow:0 12px 26px -8px rgba(20,16,40,.6),0 0 0 1px rgba(20,16,40,.06)}
.cc-card:hover .cc-page{transform:rotate(2deg) translateY(-6px)}
.cc-art .save-button{top:12px;right:12px;bottom:auto;width:40px;height:40px}
.cc-body{display:flex;flex-direction:column;flex:1;padding:20px 22px 22px}
.cc-top{display:flex;flex-wrap:wrap;align-items:center;gap:8px 12px;margin:0 0 12px}
.cc-fmt{display:inline-flex;align-items:center;gap:6px;font-size:13px;font-weight:800;line-height:1.2;padding:5px 11px 5px 9px;border-radius:99px;border:1px solid;white-space:nowrap}
.cc-fmt svg{flex:0 0 auto}.cc-fmt svg+svg{margin-left:-1px}
.cc-fmt.cc-fmt--online{background:#e5f3ff;border-color:#a9d3f5;color:#0f4470}
.cc-fmt.cc-fmt--both{background:#e6f5ec;border-color:#a6d8bb;color:#145a37}
.cc-fmt.cc-fmt--print{background:#fff6dc;border-color:#f0d58a;color:#5c4300}
.cc-fmt.cc-fmt--printscreen{background:#efe9ff;border-color:#c9bbf6;color:#3d2a8a}
.format-tags>.cc-fmt{font-size:13.5px;font-weight:800;padding:6px 13px 6px 10px;border-radius:99px}
.cc-kind{font-size:11.5px;font-weight:800;letter-spacing:.09em;text-transform:uppercase;color:var(--cc-mute)}
.cc-body h3{font-size:22px;line-height:1.15;letter-spacing:-.03em;margin:0 0 8px}
.cc-body h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.cc-hook{margin:0 0 14px;font-size:15px;line-height:1.55;color:#3b3650}
.cc-meta{list-style:none;margin:0 0 16px;padding:0;display:flex;flex-wrap:wrap;gap:6px 16px;font-size:13.5px;font-weight:600;color:var(--cc-ink2)}
.cc-meta li{display:inline-flex;align-items:center;gap:6px}
.cc-meta svg{color:#8a83a3;flex:0 0 auto}
.cc-more{align-self:flex-start;margin:-4px 0 16px;font-size:14px;font-weight:700;border-bottom:1px solid currentColor;line-height:1.5}
.cc-foot{margin-top:auto;display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:12px;padding-top:16px;border-top:1px solid var(--line)}
.cc-price{margin:0;display:flex;flex-direction:column;line-height:1.3}
.cc-price strong{font-size:17px;letter-spacing:-.01em}
.cc-price span{font-size:12px;font-weight:600;color:var(--cc-mute)}
.cc-button{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border-radius:99px;background:var(--ink);color:#fff;font-weight:700;font-size:14px;white-space:nowrap;transition:background .2s}
.cc-button:hover{background:#3d3463}
.cc-card .game-social{display:block;padding:0 22px 16px;margin-top:-6px;font-size:12.5px;color:var(--cc-mute)}
/* A lone item becomes one wide feature card. */
.cc-grid[data-cols="1"]>.cc-card{grid-column:1/-1;flex-direction:row}
.cc-grid[data-cols="1"] .cc-art{flex:0 0 50%;aspect-ratio:auto;min-height:340px}
.cc-grid[data-cols="1"] .cc-body{padding:34px 40px;justify-content:center}
.cc-grid[data-cols="1"] .cc-body h3{font-size:clamp(26px,2.4vw,34px)}
.cc-grid[data-cols="1"] .cc-hook{font-size:16.5px;max-width:460px}
.cc-grid[data-cols="1"] .cc-foot{margin-top:8px;max-width:460px}
/* Page-specific callouts, one row */
.cc-extras h2{font-size:clamp(30px,3.2vw,46px);margin-bottom:28px}
.cc-extra-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px}
.cc-extras .multiplayer-callout{margin:0;padding:28px 30px;border-radius:22px}
.cc-extras .multiplayer-callout h3{font-size:22px;letter-spacing:-.03em}
.cc-extras .multiplayer-callout a{text-decoration:underline;text-underline-offset:3px}
/* Chooser */
.cc-options{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;counter-reset:cc}
.cc-options li{counter-increment:cc;display:flex;flex-direction:column;background:var(--cc-soft);border-radius:22px;padding:26px 26px 28px}
.cc-options li::before{content:counter(cc);display:grid;place-items:center;width:32px;height:32px;border-radius:50%;background:var(--ink);color:#fff;font-weight:800;font-size:14px;margin-bottom:16px}
.cc-options h3{font-size:21px;letter-spacing:-.03em;margin:0 0 8px}
.cc-options p{margin:0 0 16px;font-size:15.5px;line-height:1.6;color:#3b3650}
.cc-options .text-link{margin-top:auto;align-self:flex-start;font-size:14px}
.cc-guide{display:inline-block;margin-top:24px;font-weight:700;font-size:15px;border-bottom:1px solid currentColor}
/* Access band */
.cc .cc-access{padding-top:20px;padding-bottom:20px}
.cc-access-band{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));background:#fbf3e4;border-radius:22px;overflow:hidden}
.cc-access-band>div{padding:24px 28px}
.cc-access-band>div+div{border-left:1px solid #ecdcbf}
.cc-access-band h3{font-size:17px;letter-spacing:-.02em;margin:0 0 6px}
.cc-access-band p{margin:0;font-size:14.5px;line-height:1.6;color:#3b3650}
.cc-access-band a{font-weight:700;border-bottom:1px solid currentColor;white-space:nowrap}
.cc-note{margin:12px 4px 0;font-size:13px;color:var(--cc-mute)}
/* Small comparison table, kept for answer engines */
.cc .answer-comparison{max-width:1440px}
.cc .answer-comparison table{min-width:560px}.cc .answer-comparison tbody th{min-width:140px}
.cc .answer-comparison h2{font-size:clamp(26px,2.6vw,36px);margin-bottom:10px}
.cc .answer-comparison>p{font-size:15.5px;color:var(--cc-ink2)}
.cc .answer-table-scroll{border-color:var(--line);border-radius:18px}
.cc .answer-comparison caption{background:#f7f6fa;font-size:13px;color:var(--cc-ink2)}
.cc .answer-comparison thead th{background:#f7f6fa;font-size:12px;letter-spacing:.06em;text-transform:uppercase}
.cc .answer-comparison th,.cc .answer-comparison td{border-color:var(--line);padding:14px 16px}
.cc .answer-comparison .answer-source{font-size:13px;color:var(--cc-mute)}
/* FAQ */
.cc-faq h2{font-size:clamp(30px,3.2vw,46px);margin-bottom:20px}
.cc-faq details{max-width:880px;border-top:1px solid var(--line)}
.cc-faq details:last-of-type{border-bottom:1px solid var(--line)}
.cc-faq summary{position:relative;cursor:pointer;list-style:none;padding:20px 48px 20px 0;font-weight:800;font-size:17.5px;line-height:1.4}
.cc-faq summary::-webkit-details-marker{display:none}
.cc-faq summary::after{content:'+';position:absolute;right:10px;top:50%;transform:translateY(-50%);font-size:26px;font-weight:500;line-height:1}
.cc-faq details[open] summary::after{content:'−'}
.cc-faq summary:focus-visible{outline:3px solid var(--ink);outline-offset:4px;border-radius:4px}
.cc-faq details>p{margin:0 0 22px;max-width:780px;font-size:16px;line-height:1.7;color:#3b3650}
.cc-faq details a{text-decoration:underline;text-underline-offset:3px}
/* Related */
.cc .cc-related{padding-top:12px}
.cc-related h2{font-size:20px;letter-spacing:-.02em;margin:0 0 14px}
.cc-related ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.cc-related a{display:inline-flex;align-items:center;min-height:44px;padding:10px 18px;border:1px solid var(--line);border-radius:99px;font-weight:700;font-size:14.5px;transition:border-color .2s}
.cc-related a:hover{border-color:var(--ink)}
@media(max-width:1000px){
 .cc .cc-hero{grid-template-columns:1fr;gap:30px}
 .cc-hero h1{max-width:none}
 .cc-grid>.cc-card,.cc-grid[data-cols]>.cc-card{grid-column:span 6}
 .cc-grid:not([data-cols="1"])>.cc-card:last-child:nth-child(odd){grid-column:1/-1;flex-direction:row}
 .cc-grid:not([data-cols="1"])>.cc-card:last-child:nth-child(odd) .cc-art{flex:0 0 50%;aspect-ratio:auto;min-height:280px}
 .cc-access-band{grid-template-columns:1fr}
 .cc-access-band>div+div{border-left:0;border-top:1px solid #ecdcbf}
}
@media(max-width:640px){
 .cc .section{padding-top:40px;padding-bottom:40px}
 .cc .cc-hero{padding-top:16px;padding-bottom:28px;gap:24px}
 .cc-hero h1{font-size:clamp(36px,10vw,44px)}
 .cc-lede{font-size:17px;margin-bottom:24px}
 .cc-collage{gap:8px}
 .cc-tile{border-radius:14px}
 .cc-tile:not(.cc-tile--main) figcaption{display:none}
 .cc-tile--main figcaption{left:8px;bottom:8px;font-size:12px;padding:5px 10px;white-space:normal}
 .cc-tile--page{padding:10px 10px 0}
 .cc .cc-short{grid-template-columns:1fr;gap:0;padding-bottom:0}
 .cc-short h2{padding-top:16px}
 .cc-short p{border-top:0;padding-top:8px;font-size:16px}
 .cc-head{margin-bottom:22px}
 .cc-grid{grid-template-columns:1fr;gap:20px}
 .cc-grid>.cc-card,.cc-grid[data-cols]>.cc-card,.cc-grid:not([data-cols="1"])>.cc-card:last-child:nth-child(odd),.cc-grid[data-cols="1"]>.cc-card{grid-column:auto;flex-direction:column}
 .cc-grid .cc-card .cc-art{flex:none;aspect-ratio:3/2;min-height:0}
 .cc-grid[data-cols="1"] .cc-body{padding:20px 22px 22px}
 .cc-options li{padding:22px}
 .cc-access-band>div{padding:20px 22px}
 .cc-faq summary{font-size:16.5px;padding:18px 40px 18px 0}
}
@media(prefers-reduced-motion:reduce){.cc-card,.cc-art>a>img,.cc-page{transition:none}.cc-card:hover,.cc-card:hover .cc-art>a>img,.cc-card:hover .cc-page{transform:none}.cc-card:hover .cc-page{transform:rotate(6deg)}}