.fragments-page .light-layout{grid-template-columns:.75fr 1.25fr}.fragments-page .light-intro h1{font-size:clamp(52px,6vw,86px)}.fragment-board{display:grid;grid-template-columns:repeat(var(--size,3),minmax(0,1fr));gap:3px;background:#142a23;aspect-ratio:4/3;width:100%;position:relative}.fragment-piece{border:0;background:#40554b;padding:0;position:relative;min-width:0;overflow:hidden;cursor:pointer;aspect-ratio:4/3}.fragment-piece img{position:absolute;max-width:none;object-fit:cover;pointer-events:none;user-select:none}.fragment-piece[aria-pressed="true"]{outline:4px solid #f5eed6;outline-offset:-4px;z-index:1;filter:brightness(1.14)}.fragment-piece:focus-visible{outline:4px solid #d7e795!important;outline-offset:-5px!important;z-index:2}.fragment-piece:hover:not(:disabled){filter:brightness(1.12)}.fragment-piece:disabled{cursor:default}.fragment-number{position:absolute;left:4px;bottom:4px;background:#142a23;color:#f5eed6;padding:3px 6px;font:13px/1.2 'Segoe UI',sans-serif;border-radius:3px;display:none}.fragment-board.show-numbers .fragment-number{display:block}.fragment-stage{position:relative;margin:22px 0}.fragment-reference{position:relative;margin:0}.fragment-reference img{display:block;width:100%;aspect-ratio:4/3;object-fit:cover}.fragment-reference figcaption{font-size:13px;margin-top:12px;color:#ccd6c3}.fragment-settings{display:flex;gap:8px 20px;flex-wrap:wrap;align-items:center;padding:16px 0 0;font-size:13px}.fragment-settings label{display:flex;gap:9px;align-items:center;min-height:44px;cursor:pointer}.fragment-settings input{width:18px;height:18px;accent-color:#d7e795}.fragment-view{border:1px solid #a5b399;background:transparent;color:var(--cream);border-radius:30px;padding:10px 17px;min-height:44px;font-size:13px!important}.fragment-error{padding:35px 15px;line-height:1.6}.fragment-board.is-complete{gap:0;transition:gap .65s}.fragment-board.is-complete .fragment-piece{outline:none}.fragment-piece.was-swapped{animation:fragment-settle .3s ease-out}@keyframes fragment-settle{from{filter:brightness(1.25)}to{filter:brightness(1)}}
@media(max-width:900px){.fragments-page .light-layout{grid-template-columns:.8fr 1.2fr}.fragments-page .light-intro h1{font-size:60px}}
@media(max-width:700px){.fragments-page .light-layout{grid-template-columns:1fr}.fragment-stage{margin:18px 0}.fragments-page .light-intro h1{font-size:60px}.fragment-board{gap:2px}}
@media(max-width:380px){.fragments-page .light-intro h1{font-size:53px}.fragment-number{font-size:11px;left:2px;bottom:2px;padding:2px 4px}.fragment-settings{gap:5px 12px}}
@media(prefers-reduced-motion:reduce){.fragment-piece.was-swapped{animation:none}.fragment-board.is-complete{transition:none}}