.mosaic-home{--m-ink:#293c30;--m-paper:#faf8ef;--m-accent:#a64731;color:var(--m-ink)}.mosaic-settings{max-width:850px;margin:32px 0}.mosaic-settings fieldset{border:0;padding:0;margin:0 0 24px}.mosaic-settings legend{font:24px Georgia,serif;margin-bottom:18px}.mosaic-levels{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.mosaic-levels label{position:relative;cursor:pointer}.mosaic-levels input{position:absolute;left:14px;top:16px;accent-color:#536747}.mosaic-levels label span{display:flex;flex-direction:column;gap:10px;padding:18px 14px 18px 38px;border:1px solid #b7c3ad;border-radius:12px;background:#f2f3e9}.mosaic-levels input:checked+span{background:#dfe9d6;border-color:#526c47;box-shadow:0 0 0 1px #526c47}.mosaic-levels small{font-size:13px}.mosaic-levels input:focus-visible+span{outline:3px solid #a64731;outline-offset:3px}.cover-mosaic-playing{overflow:hidden}.mosaic-stage{position:fixed;inset:0;z-index:10000;box-sizing:border-box;height:100dvh;display:flex;flex-direction:column;gap:12px;padding:18px max(18px,env(safe-area-inset-right)) max(12px,env(safe-area-inset-bottom));background:radial-gradient(ellipse at top,#f4f3e8,#dde4d3);color:#293c30}.mosaic-toolbar{display:flex;align-items:center;gap:18px;flex-wrap:wrap;padding-bottom:10px;border-bottom:1px solid #bdc8b2}.mosaic-toolbar strong{font:24px Georgia,serif;margin-right:auto}.mosaic-stage button,.mosaic-stage select{font:inherit;color:inherit}.mosaic-toolbar button,.mosaic-tools select{padding:9px 12px;border:1px solid #a6b49a;border-radius:7px;background:#fffdf7;min-height:44px;cursor:pointer}.mosaic-tools{display:flex;gap:20px;flex-wrap:wrap;align-items:center;font-size:14px}.mosaic-tools label{display:flex;align-items:center;gap:8px}.mosaic-tools input{width:20px;height:20px;accent-color:#536747}.mosaic-tools a{margin-left:auto;color:inherit}.mosaic-progress{display:flex;gap:16px;align-items:center}.mosaic-progress label{font-size:14px;white-space:nowrap}.mosaic-progress progress{width:min(400px,50%);height:10px;accent-color:#5b7549}.mosaic-progress label span{margin-left:8px;font-variant-numeric:tabular-nums}#mosaic-instruction{font-size:13px;margin:0}.mosaic-play-area{display:flex;gap:18px;flex:1;min-height:0;align-items:stretch;justify-content:center}.mosaic-viewport{min-width:0;flex:1;overflow:auto;overscroll-behavior:contain;border:1px solid #bac5af;border-radius:12px;background:#6072541a;padding:18px;scrollbar-gutter:stable;touch-action:pan-x pan-y}.mosaic-board{display:grid;grid-template-columns:repeat(var(--size),1fr);gap:0;width:max(calc(var(--size)*44px*var(--zoom)),min(calc(100% * var(--zoom)),calc(var(--fit-width,540px) * var(--zoom))));aspect-ratio:var(--cover-ratio,2/3);margin:auto;box-shadow:0 8px 28px #23331b30;background:#bac5af}.mosaic-piece{position:relative;min-width:44px;min-height:44px;border:1px solid #f4f2df50;border-radius:0;padding:0;cursor:grab;background-repeat:no-repeat;background-color:#bcc6ad;transition:box-shadow .15s;touch-action:pan-x pan-y}.mosaic-piece.is-selected{z-index:2;box-shadow:inset 0 0 0 4px #ffd56b;outline:3px solid #a64731;outline-offset:-3px}.mosaic-piece.is-placed{cursor:default;border-color:transparent}.mosaic-piece.is-placed:after{content:'✓';position:absolute;right:2px;bottom:2px;color:white;background:#304d2fcc;border-radius:50%;font:10px/14px system-ui;width:14px;height:14px;text-align:center}.mosaic-piece:focus-visible{z-index:3;outline:3px solid #ffdd74;outline-offset:-3px}.mosaic-reference{flex:0 0 clamp(130px,21vw,250px);overflow:auto;text-align:center}.mosaic-reference[hidden]{display:none}.mosaic-reference p{font-size:13px;margin-top:0}.mosaic-reference img{display:block;width:100%;height:auto;border:1px solid #bdc8b2}.mosaic-bottom{display:flex;justify-content:space-between;gap:16px;font-size:12px;min-height:20px}.mosaic-bottom #mosaic-status{font-weight:600}.mosaic-actions{display:flex;align-items:center;flex-wrap:wrap;gap:12px;margin:25px 0}.mosaic-discovery{display:grid;grid-template-columns:minmax(140px,240px) 1fr;gap:32px;padding:28px;background:#edf0e4;border-radius:16px;align-items:center;max-width:850px}.mosaic-discovery img{display:block;width:100%;height:auto}.mosaic-discovery h3{font:32px Georgia,serif;margin:12px 0}.mosaic-author{font-weight:600}.mosaic-results textarea{display:block;width:100%;min-height:90px;margin:12px 0}.mosaic-results h2{font:38px Georgia,serif}.mosaic-results h2:focus{outline:none}.mosaic-stage a:focus-visible,.mosaic-stage select:focus-visible,.mosaic-stage button:not(.mosaic-piece):focus-visible{outline:3px solid #a64731;outline-offset:3px}.mosaic-game-art{display:grid;grid-template-columns:repeat(4,1fr);gap:6px;padding:16px;max-width:200px;aspect-ratio:2/3;margin:auto;transform:rotate(-5deg)}.mosaic-game-art span{background:#718362;border:1px solid #a6b699}.mosaic-game-art span:nth-child(3n){background:#b4a26b;transform:translate(4px,-3px)}.mosaic-game-art span:nth-child(5n){background:#b27155;transform:translate(-3px,4px)}@media(max-width:700px){.mosaic-levels{grid-template-columns:repeat(2,1fr)}.mosaic-stage{padding:10px;gap:8px}.mosaic-toolbar{gap:8px}.mosaic-toolbar strong{font-size:20px}.mosaic-toolbar span{font-size:12px}.mosaic-toolbar button{padding:7px 8px;font-size:12px}.mosaic-tools{font-size:12px;gap:10px}.mosaic-tools a{margin-left:0}.mosaic-tools select{padding:4px;min-height:36px}.mosaic-viewport{padding:8px}.mosaic-reference{flex-basis:90px}.mosaic-play-area{gap:8px}.mosaic-bottom{display:block;font-size:11px}.mosaic-bottom span{display:block}.mosaic-discovery{grid-template-columns:1fr;padding:20px;gap:20px}.mosaic-discovery img{max-width:230px;margin:auto}.mosaic-settings label span{padding-left:36px}.mosaic-progress{gap:8px}.mosaic-progress label{font-size:12px}.mosaic-board{width:max(calc(var(--size)*44px*var(--zoom)),min(calc(100% * var(--zoom)),calc(var(--fit-width,440px) * var(--zoom))))}}@media(prefers-reduced-motion:reduce){.mosaic-piece{transition:none}.mosaic-game-art{transform:none}}