@layer components{@media (min-width:48rem) and (min-height:30rem){.collage-series_wrap{grid-template-areas:"stack";display:grid}}@media not (min-width:48rem),not (min-height:30rem){.collage-series_intro{padding-top:var(--section-space-small);padding-bottom:var(--space-4)}}@media (min-width:48rem) and (min-height:30rem){.collage-series_intro{top:var(--nav-height);z-index:2;height:calc(100svh - var(--nav-height));pointer-events:none;grid-area:stack;align-self:start;min-height:34rem;position:sticky}}.collage-series_inner{width:var(--site-width);max-width:var(--max-width-main);margin-inline:auto}.collage-series_column{align-items:start;gap:var(--space-3);flex-direction:column;display:flex;container-type:inline-size}.collage-series_column>.text-style-h1{font-size:min(var(--h1), 21cqi)}@media (min-width:48rem) and (min-height:30rem){.collage-series_column{width:calc((100% - var(--space-8)) / 2);padding-top:var(--section-space-small);padding-bottom:var(--space-4);background-color:var(--background);pointer-events:auto;position:relative}.collage-series_column:after{content:"";top:100%;height:var(--space-8);background:linear-gradient(var(--background), transparent);pointer-events:none;position:absolute;inset-inline:0}}.collage-series_list{grid-area:stack;min-width:0}.collage-puzzle_wrap{height:calc(100svh - var(--nav-height));min-height:34rem;overflow-x:clip}@media not (min-width:48rem),not (min-height:30rem){.collage-puzzle_wrap{height:auto;min-height:0}}.collage-puzzle_layout{gap:var(--space-4);grid-template-rows:auto minmax(0,1fr) auto;grid-template-areas:"intro""stage""panel";height:100%;display:grid}@media (min-width:48rem) and (min-height:30rem){.collage-puzzle_layout{column-gap:var(--space-8);grid-template-rows:minmax(0,1fr) auto auto;grid-template-columns:repeat(2,minmax(0,1fr));grid-template-areas:".stage""intro stage""panel stage"}}.collage-puzzle_intro{gap:var(--space-3);flex-direction:column;grid-area:intro;display:flex}.collage-puzzle_stage{grid-area:stage;place-self:stretch stretch;place-items:center;min-height:0;display:grid;container-type:size}@media not (min-width:48rem),not (min-height:30rem){.collage-puzzle_stage{height:min((100vw - var(--site-margin) * 2) * var(--_rows) / var(--_columns), 100svh - var(--nav-height) - 10rem)}@media not (min-height:30rem){.collage-puzzle_stage{height:calc(100svh - var(--nav-height) - var(--space-4))}}}@media (min-width:48rem) and (min-height:30rem){.collage-puzzle_stage{justify-items:end}}.collage-puzzle_board{width:min(100cqw, 100cqh * var(--_columns) / var(--_rows));aspect-ratio:var(--_columns) / var(--_rows);position:relative}.collage-puzzle_tile,.collage-puzzle_gap{width:calc(100% / var(--_columns));height:calc(100% / var(--_rows));translate:calc(var(--_x) * 100% + var(--_dx,0rem)) calc(var(--_y) * 100% + var(--_dy,0rem));position:absolute;top:0;left:0}.collage-puzzle_tile{color:inherit;cursor:default;transform-origin:0 0;scale:var(--_scale,1);transition:translate .55s cubic-bezier(.2, .7, .2, 1) var(--_delay,0s), scale .55s cubic-bezier(.2, .7, .2, 1) var(--_delay,0s);background:0 0;border:0;padding:0}.collage-puzzle_tile.is-docked{transition-duration:.9s}.collage-puzzle_tile:focus-visible{z-index:1;outline:var(--border-width) solid var(--text-accent);outline-offset:calc(var(--border-width) * -1)}.collage-puzzle_tile.is-movable{cursor:grab;touch-action:none}.collage-puzzle_tile.is-openable{cursor:zoom-in}.collage-puzzle_tile.is-dragging{z-index:1;cursor:grabbing;transition:none}.collage-puzzle_card{width:100%;height:100%;display:block}.collage-puzzle_photo{object-fit:cover;-webkit-user-select:none;user-select:none;-webkit-user-drag:none;width:100%;height:100%;transition:scale .45s cubic-bezier(.2, .7, .2, 1), opacity .45s ease, filter var(--hover-duration) var(--hover-ease);display:block}.is-playing .collage-puzzle_photo{scale:.97}.is-missing .collage-puzzle_photo{opacity:0;scale:.6}@media (hover:hover){.is-movable:hover .collage-puzzle_photo{filter:brightness(1.12);scale:.94}.is-openable:hover .collage-puzzle_photo{filter:brightness(1.12)}}.collage-puzzle_gap{border:var(--border-width) dashed color-mix(in lab, currentcolor 35%, transparent);opacity:0;pointer-events:none;transition:opacity .3s;scale:.97}.is-playing .collage-puzzle_gap{opacity:1}.collage-puzzle_panel{gap:var(--space-3);flex-direction:column;grid-area:panel;display:flex}.collage-puzzle_status{color:var(--text-2);font-variant-numeric:tabular-nums}.collage-puzzle_controls{align-items:center;gap:var(--space-2);opacity:0;flex-wrap:wrap;transition:opacity .5s,translate .5s cubic-bezier(.2,.7,.2,1);display:flex;translate:0 .5rem}.is-ready .collage-puzzle_controls{opacity:1;translate:0}.collage-puzzle_modal .modal_content{width:80vw;max-width:none;height:80svh}.collage-puzzle_modal .modal_scroll{overflow:hidden}.collage-puzzle_modal .modal_body{height:100%;padding:var(--_close) var(--space-6) var(--space-6);flex-direction:column;display:flex}@media not (min-width:48rem){.collage-puzzle_modal .modal_body{padding-inline:var(--space-4)}}.collage-puzzle_modal .slider_wrap{gap:var(--space-4);flex:1;grid-template-rows:minmax(0,1fr) auto;min-height:0}.collage-puzzle_modal .slider_list{height:100%}.collage-puzzle_original{object-fit:contain;width:100%;height:100%;min-height:0;display:block}.modal_body>.collage-puzzle_original{flex:1}@media (scripting:enabled) and (prefers-reduced-motion:no-preference){.collage-puzzle_wrap:not(.is-static) .collage-puzzle_card{visibility:hidden}}@media (prefers-reduced-motion:reduce){.collage-puzzle_tile,.collage-puzzle_photo{transition-duration:10ms}}}
