#mirrorGameDialog{box-sizing:border-box;position:fixed;inset:0;margin:0;width:100vw;max-width:none;height:100dvh;max-height:none;padding:0;border:0;background:#17120e;color:#eee1c5;overflow:auto;overscroll-behavior:contain;font-family:Georgia,serif;}
#mirrorGameDialog::backdrop{background:#080706;}
#mirrorGameDialog [hidden]{display:none!important;}
.mirror-dust-photo{position:fixed;inset:0;width:100%;height:100%;object-fit:cover;object-position:50% 50%;pointer-events:none;}
.mirror-game-shade{position:fixed;inset:0;pointer-events:none;background:linear-gradient(#07050477,transparent 30%,transparent 67%,#070504a6);}
.mirror-game-layout{box-sizing:border-box;position:relative;min-height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;padding:calc(28px + env(safe-area-inset-top)) 20px calc(22px + env(safe-area-inset-bottom));text-align:center;}
.mirror-game-heading h2{font-weight:400;font-size:clamp(25px,4vw,38px);letter-spacing:.06em;margin:0 0 10px;text-shadow:0 2px 10px #000;}
.mirror-game-heading p{font:14px/1.5 Georgia,serif;letter-spacing:.04em;margin:0;color:#e1d5bc;text-shadow:0 2px 5px #000;}
.mirror-play-area{--board-size:min(82vw,max(180px,calc(100dvh - 250px)),440px);position:relative;width:var(--board-size);height:var(--board-size);flex-shrink:0;}
.mirror-grid{position:absolute;inset:0;display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);transition:opacity .7s;}
.mirror-grid-lines{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;}
.mirror-wiped{fill:none;stroke:white;stroke-width:5;stroke-linecap:round;stroke-linejoin:round;}
/* White exists only in the alpha mask: visible marks contain reflected image pixels. */
.mirror-play-area svg>path,.mirror-play-area svg>g{visibility:hidden;}
.mirror-play-area mask{fill:none;stroke:white;stroke-linecap:round;stroke-linejoin:round;}
.mirror-clear-reflection{pointer-events:none;}
.mirror-grid-lines path{stroke-width:6.1;opacity:.86;}
.mirror-drawing path,.mirror-drawing circle{stroke-dasharray:1;stroke-dashoffset:0;}
.mirror-drawing.is-new path,.mirror-drawing.is-new circle{animation:mirror-wipe .6s ease both;}
.mirror-drawing.is-new path+path{animation-delay:.2s;}
#mirrorGameDialog .mirror-cell{position:relative;box-sizing:border-box;display:grid;place-items:center;margin:0;padding:13%;min-width:0;width:100%;height:100%;border:0;border-radius:0;background:transparent;color:inherit;box-shadow:none;cursor:pointer;touch-action:manipulation;-webkit-tap-highlight-color:transparent;opacity:1;}
#mirrorGameDialog .mirror-cell:disabled{cursor:default;opacity:1;}
#mirrorGameDialog .mirror-cell:enabled:hover{background:#c9bc9817;}
#mirrorGameDialog .mirror-cell:focus-visible{outline:2px solid #f0dfb0;outline-offset:-9px;border-radius:12px;background:#c9bc9817;}
.mirror-cell svg{display:block;width:100%;height:100%;overflow:visible;}
.mirror-win-line{position:absolute;inset:0;width:100%;height:100%;pointer-events:none;stroke-width:2.5;}
.mirror-taunt{position:absolute;inset:0;display:grid;place-items:center;}
.mirror-taunt svg{width:68%;height:94%;overflow:visible;}
.mirror-taunt .mirror-wiped{stroke-width:4;}
.mirror-taunt.is-new path{stroke-dasharray:1;animation:mirror-wipe var(--wipe-duration,1050ms) linear both;animation-delay:var(--wipe-delay,0ms);}
.mirror-game-footer{min-height:83px;max-width:420px;}
#mirrorGameStatus{font:16px/1.5 Georgia,serif;min-height:48px;margin:0 0 10px;text-wrap:balance;text-shadow:0 2px 5px #000,0 0 12px #000;}
#mirrorGameDialog .mirror-rematch{min-height:44px;font:15px Georgia,serif;padding:10px 20px;border:1px solid #95805b;border-radius:3px;background:#1b1511d9;color:#eee1c5;cursor:pointer;touch-action:manipulation;}
#mirrorGameDialog .mirror-exit{position:fixed;z-index:3;right:max(12px,env(safe-area-inset-right));top:max(12px,env(safe-area-inset-top));min-width:44px;min-height:44px;border:1px solid #8a775a;border-radius:3px;background:#17110dd9;color:#eee1c5;font:28px/1 Georgia,serif;cursor:pointer;}
#mirrorGameDialog button:focus-visible{outline:2px solid #fff0c8;outline-offset:3px;}
@keyframes mirror-wipe{from{stroke-dashoffset:1}to{stroke-dashoffset:0}}
@media(orientation:portrait){.mirror-dust-photo{object-position:50% 50%;}.mirror-game-layout{gap:22px;}.mirror-game-heading{margin-top:22px;}}
@media(max-height:520px) and (min-width:600px){.mirror-game-layout{display:grid;grid-template-columns:170px auto 170px;gap:16px;justify-content:center;padding:22px 28px;}.mirror-play-area{--board-size:min(40vw,calc(100dvh - 48px),440px);}.mirror-game-heading h2{font-size:25px;}.mirror-game-footer{max-width:170px;}}
@media(prefers-reduced-motion:reduce){.mirror-drawing.is-new path,.mirror-drawing.is-new circle,.mirror-taunt.is-new path{animation:none!important;stroke-dashoffset:0;}.mirror-grid{transition:none;}}
