.phone[data-astro-cid-6zuj2xdd]{margin:0;width:100%;max-width:340px;perspective:1400px}.phone-body[data-astro-cid-6zuj2xdd]{position:relative;aspect-ratio:9 / 19.3;border-radius:13%/6%;background:#0f1113;padding:3.2%;box-shadow:0 0 0 1.5px #3a3d42,0 30px 70px -20px #00000073,inset 0 0 0 1px #ffffff0f;transform-style:preserve-3d;transition:transform var(--t-slow) var(--ease-out)}.phone[data-astro-cid-6zuj2xdd].tilt .phone-body[data-astro-cid-6zuj2xdd]{transform:rotateY(-10deg) rotateX(4deg) rotate(1deg)}.phone[data-astro-cid-6zuj2xdd].tilt:hover .phone-body[data-astro-cid-6zuj2xdd]{transform:rotateY(-3deg) rotateX(1deg)}.phone-screen[data-astro-cid-6zuj2xdd]{position:absolute;inset:3.2%;border-radius:11%/5%;overflow:hidden;background:#111}.phone-screen[data-astro-cid-6zuj2xdd] img,.phone-screen[data-astro-cid-6zuj2xdd] video{width:100%;height:100%;object-fit:cover;object-position:top}.phone-island[data-astro-cid-6zuj2xdd]{position:absolute;top:5.2%;left:50%;transform:translate(-50%);width:26%;height:2.6%;border-radius:999px;background:#0f1113}.mgs{--gap: 3px;--bg: #FFFBF2;--line: #B88A5C;position:relative;display:inline-grid;gap:12px;padding:14px;border-radius:18px;background:var(--bg);border:1.5px solid color-mix(in srgb,var(--line) 55%,transparent);box-shadow:inset 0 1px #fffc,0 10px 30px -14px #3c1e0059}.mgs-board{display:grid;grid-template-columns:repeat(8,var(--cell));grid-auto-rows:var(--cell);gap:var(--gap)}.mgs-cell{border-radius:4px;background:color-mix(in srgb,var(--line) 14%,var(--bg));transition:background .18s ease-out,transform .22s var(--ease-out),opacity .3s ease-out}.mgs-cell.on{background:var(--col);box-shadow:inset 0 -3px #00000024,inset 0 2px #ffffff40;animation:mgs-pop .26s var(--ease-out)}.mgs-cell.clear{animation:mgs-clear .42s ease-out forwards}.mgs-cell.ghost{background:color-mix(in srgb,var(--col) 35%,var(--bg))}@keyframes mgs-pop{0%{transform:scale(.55)}60%{transform:scale(1.08)}to{transform:scale(1)}}@keyframes mgs-clear{0%{filter:brightness(1.6);transform:scale(1.05)}to{filter:brightness(1);transform:scale(.2);opacity:0}}.mgs-tray{display:flex;justify-content:space-around;align-items:center;min-height:calc(var(--cell) * 2.2)}.mgs-next{display:grid;gap:2px;grid-template-columns:repeat(var(--w, 1),calc(var(--cell) * .62));grid-auto-rows:calc(var(--cell) * .62);transition:transform .24s var(--ease-out),opacity .24s}.mgs-next i{display:block;border-radius:3px;background:var(--col);box-shadow:inset 0 -2px #00000024}.mgs-next i.e{background:transparent;box-shadow:none}.mgs-next.used{opacity:0;transform:scale(.6) translateY(-10px)}.mgs-toast{position:absolute;left:50%;top:42%;transform:translate(-50%) scale(.9);opacity:0;font-family:"Audiowide",var(--font-studio);font-size:1rem;letter-spacing:.02em;color:#fff;background:linear-gradient(135deg,#ff2e63,#ff6b35);padding:8px 16px;border-radius:999px;box-shadow:0 10px 24px -8px #ff2e6399;pointer-events:none}.mgs-toast.show{animation:mgs-toast 1.1s var(--ease-out)}@keyframes mgs-toast{0%{opacity:0;transform:translate(-50%,8px) scale(.85)}20%{opacity:1;transform:translate(-50%,-6px) scale(1.04)}75%{opacity:1;transform:translate(-50%,-14px) scale(1)}to{opacity:0;transform:translate(-50%,-26px) scale(.98)}}@media(prefers-reduced-motion:reduce){.mgs-cell.on,.mgs-cell.clear,.mgs-toast{animation:none!important}}.msu{--bg: #FFFFFF;--ink: #0F172A;--given: #1E293B;--placed: #2F6BB0;--line: #CBD5E1;--thick: #64748B;--peer: #EEF2FF;--same: #FEF3C7;--sel: #BFDBFE;display:inline-grid;gap:12px;padding:14px;border-radius:18px;background:var(--bg);border:1px solid color-mix(in srgb,var(--thick) 30%,transparent);box-shadow:0 10px 30px -16px #0f172a59}.msu.dark{--bg: #0F172A;--ink: #F8FAFC;--given: #F1F5F9;--placed: #60A5FA;--line: #475569;--thick: #94A3B8;--peer: #1E3A5F;--same: #365314;--sel: #0E7490}.msu-grid{display:grid;grid-template-columns:repeat(9,var(--cell));grid-auto-rows:var(--cell);border:2px solid var(--thick);border-radius:6px;overflow:hidden}.msu-cell{display:grid;place-items:center;font-family:var(--font-studio);font-weight:600;font-size:calc(var(--cell) * .55);color:var(--given);border-right:1px solid var(--line);border-bottom:1px solid var(--line);background:var(--bg);transition:background .22s ease-out}.msu-cell[data-c="2"],.msu-cell[data-c="5"]{border-right:2px solid var(--thick)}.msu-cell[data-r="2"],.msu-cell[data-r="5"]{border-bottom:2px solid var(--thick)}.msu-cell[data-c="8"]{border-right:0}.msu-cell[data-r="8"]{border-bottom:0}.msu-cell.peer{background:var(--peer)}.msu-cell.same{background:var(--same)}.msu-cell.sel{background:var(--sel)}.msu-cell.placed{color:var(--placed);animation:msu-settle .42s var(--ease-out)}.msu-cell.done{animation:msu-done .9s ease-out}@keyframes msu-settle{0%{transform:scale(1.5);opacity:0}to{transform:scale(1);opacity:1}}@keyframes msu-done{0%{background:var(--same)}to{background:var(--bg)}}.msu-pad{display:flex;justify-content:space-between;gap:4px}.msu-pad span{flex:1;display:grid;place-items:center;height:calc(var(--cell) * 1.15);border-radius:8px;background:color-mix(in srgb,var(--thick) 12%,var(--bg));color:var(--ink);font-weight:600;font-size:calc(var(--cell) * .5);transition:background .16s,transform .16s}.msu-pad span.hit{background:var(--placed);color:#fff;transform:translateY(-2px)}@media(prefers-reduced-motion:reduce){.msu-cell.placed,.msu-cell.done{animation:none!important}}.mtr{--bg-a: #FFF6E8;--bg-b: #E3F1EA;--face: #FFFCF5;--edge: #CDB48E;--tray: #F1E4CF;--slot: #E4D3B7;position:relative;display:grid;gap:14px;padding:16px;width:calc(var(--tile) * 5.6 + 32px);border-radius:20px;background:linear-gradient(180deg,var(--bg-a),var(--bg-b));border:1px solid color-mix(in srgb,var(--edge) 50%,transparent);box-shadow:0 10px 30px -16px #26332e59;overflow:hidden}.mtr-board{position:relative;height:calc(var(--tile) * 4.1)}.mtr-tile{position:absolute;width:var(--tile);height:var(--tile);border-radius:22%;background:var(--face);box-shadow:0 3px 0 var(--edge),0 6px 12px -6px #00000040;display:grid;place-items:center;transition:transform .24s var(--ease-out),opacity .2s,filter .2s,left .24s var(--ease-out),top .24s var(--ease-out);will-change:transform}.mtr-tile img{width:72%;height:72%;object-fit:contain;pointer-events:none}.mtr-tile.covered{filter:brightness(.72) saturate(.7)}.mtr-tile.pick{transform:scale(1.12) translateY(-3px);box-shadow:0 0 0 3px #e9a21f,0 3px 0 var(--edge)}.mtr-tile.gone{opacity:0;transform:scale(.3)}.mtr-tray{position:relative;display:grid;grid-template-columns:repeat(7,1fr);gap:4px;padding:6px;border-radius:14px;background:var(--tray);border:1px solid var(--edge);height:calc(var(--tile) * .9 + 14px)}.mtr-slot{border-radius:8px;background:var(--slot)}.mtr-toast{position:absolute;left:50%;top:40%;transform:translate(-50%);opacity:0;font-family:"Fredoka",var(--font-studio);font-weight:700;font-size:1.05rem;color:#fff;background:#23705b;padding:8px 18px;border-radius:999px;box-shadow:0 10px 24px -8px #23705b99;pointer-events:none}.mtr-toast.show{animation:mtr-toast 1.3s var(--ease-out)}@keyframes mtr-toast{0%{opacity:0;transform:translate(-50%,10px) scale(.85)}20%{opacity:1;transform:translate(-50%,-4px) scale(1.05)}80%{opacity:1;transform:translate(-50%,-10px) scale(1)}to{opacity:0;transform:translate(-50%,-22px)}}.mtr-pop{position:absolute;width:6px;height:6px;border-radius:50%;background:#e9a21f;pointer-events:none;animation:mtr-pop .6s ease-out forwards}@keyframes mtr-pop{0%{transform:translate(0) scale(1);opacity:1}to{transform:translate(var(--dx),var(--dy)) scale(.2);opacity:0}}@media(prefers-reduced-motion:reduce){.mtr-tile{transition:none!important}.mtr-toast,.mtr-pop{animation:none!important}}
