:root{--pink:#ffd3ec;--pink-strong:#ff7fbe;--blue:#bfe9ff;--blue-strong:#4db8ff;--purple:#8f67ff;--text:#3d2854;--white:#fff;--card:rgba(255,255,255,.78);--shadow:0 20px 50px rgba(143,103,255,.22)}*{box-sizing:border-box}body{margin:0;font-family:Arial,Helvetica,sans-serif;color:var(--text);background:linear-gradient(135deg,var(--pink),var(--blue));min-height:100vh}.language-switcher{position:sticky;top:0;z-index:20;display:flex;justify-content:center;align-items:center;gap:10px;flex-wrap:nowrap;overflow-x:auto;padding:14px 10px;background:rgba(255,255,255,.45);backdrop-filter:blur(12px);-webkit-overflow-scrolling:touch}.language-switcher::-webkit-scrollbar{display:none}.lang-btn{flex:0 1 auto;white-space:nowrap;border:3px solid rgba(255,255,255,.95);border-radius:999px;background:rgba(255,255,255,.8);color:var(--text);font-size:18px;font-weight:900;padding:12px 16px;cursor:pointer;box-shadow:0 10px 25px rgba(77,184,255,.18);transition:.2s}.lang-btn:hover{transform:translateY(-2px)}.lang-btn.active{background:linear-gradient(135deg,#fff,#ffe6f4);border-color:var(--pink-strong)}.flag{font-size:26px;margin-right:8px}.hero{text-align:center;padding:56px 20px 46px}.avatar-wrap{width:180px;height:180px;margin:0 auto 20px;border-radius:50%;padding:8px;background:var(--white);box-shadow:var(--shadow)}.avatar{width:100%;height:100%;object-fit:cover;border-radius:50%;display:block}h1{font-size:clamp(42px,8vw,82px);margin:0;color:#fff;text-shadow:0 6px 20px rgba(143,103,255,.35)}.subtitle{max-width:760px;margin:16px auto 26px;font-size:22px;font-weight:800}.btn,.small-btn,.back-btn{display:inline-flex;align-items:center;justify-content:center;border:none;border-radius:999px;background:linear-gradient(135deg,var(--pink-strong),var(--blue-strong));color:#fff;font-size:18px;font-weight:900;padding:16px 26px;text-decoration:none;cursor:pointer;box-shadow:0 16px 35px rgba(77,184,255,.28)}main{max-width:1120px;margin:0 auto 60px;padding:0 18px}.section-head{text-align:center;margin-bottom:24px}.section-head h2{font-size:clamp(34px,6vw,56px);margin:0 0 10px}.section-text{font-size:20px;font-weight:800;margin:0 auto;max-width:760px}.games-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}.game-card{background:var(--card);border:4px solid rgba(255,255,255,.88);border-radius:34px;padding:26px;box-shadow:var(--shadow);text-decoration:none;color:var(--text);min-height:230px;display:flex;flex-direction:column;justify-content:space-between;transition:.2s}.game-card:hover{transform:translateY(-5px);background:rgba(255,255,255,.9)}.game-icon{font-size:56px}.game-card h3{font-size:30px;margin:12px 0 8px}.game-card p{font-size:18px;font-weight:700;line-height:1.4;margin:0}.badge{display:inline-block;align-self:flex-start;margin-top:18px;border-radius:999px;background:#fff;padding:10px 16px;font-weight:900;color:var(--purple)}.soon{opacity:.72}.game-panel{background:var(--card);border:4px solid rgba(255,255,255,.88);border-radius:34px;padding:26px;box-shadow:var(--shadow);text-align:center}.game-controls{display:grid;grid-template-columns:repeat(4,minmax(150px,1fr));gap:14px;align-items:end;margin-bottom:22px}.game-controls label{text-align:left;font-weight:900}.game-controls span{display:block;margin-bottom:7px}select{width:100%;border:3px solid var(--blue-strong);border-radius:18px;background:white;padding:13px 12px;font-size:17px;font-weight:800;color:var(--text)}.small-btn{width:100%;padding:15px 16px}.game-status{display:inline-block;min-width:min(100%,360px);margin:8px auto 18px;padding:14px 20px;border-radius:999px;background:linear-gradient(135deg,#fff3fa,#e9f7ff);font-size:22px;font-weight:900}.tic-board{display:grid;gap:10px;margin:0 auto}.tic-cell{aspect-ratio:1/1;min-width:0;border:4px solid #fff;border-radius:22px;background:linear-gradient(135deg,#fff,#f7fbff);color:var(--purple);font-size:clamp(26px,7vw,62px);font-weight:1000;cursor:pointer;box-shadow:0 10px 22px rgba(143,103,255,.13)}.tic-cell:hover{background:#fff3fa}.tic-cell.filled{cursor:default}.back-area{text-align:center;margin:30px 0 10px}footer{text-align:center;font-weight:800;padding:24px 12px}@media(max-width:850px){.games-grid{grid-template-columns:1fr}.game-controls{grid-template-columns:1fr}.hero{padding-top:38px}.avatar-wrap{width:150px;height:150px}.language-switcher{gap:7px;padding:10px 6px}.lang-btn{font-size:13px;padding:8px 8px;border-width:2px}.flag{font-size:18px;margin-right:4px}.game-card{min-height:190px}}

/* Mobile language buttons: always one row */
.language-switcher{flex-wrap:nowrap!important;overflow-x:auto!important}
.lang-btn{white-space:nowrap;flex:0 0 auto}
@media(max-width:480px){.language-switcher{justify-content:flex-start;gap:6px;padding:8px 8px}.lang-btn{font-size:12px;padding:8px 9px}.flag{font-size:17px;margin-right:3px}}

/* Melie Games v2 fullscreen game shell */
.setup-actions{display:flex;justify-content:center;gap:12px;flex-wrap:wrap;margin:22px auto 6px}.start-game-btn{font-size:22px;padding:18px 34px}.game-fullscreen{position:fixed;inset:0;z-index:1000;display:none;background:linear-gradient(135deg,var(--pink),var(--blue));overflow:hidden;touch-action:none}.game-fullscreen.active{display:flex;flex-direction:column}.game-hud{height:64px;flex:0 0 auto;display:flex;align-items:center;justify-content:space-between;gap:8px;padding:8px max(10px,env(safe-area-inset-left)) 8px max(10px,env(safe-area-inset-right));background:rgba(255,255,255,.72);backdrop-filter:blur(12px);border-bottom:3px solid rgba(255,255,255,.9)}.hud-left,.hud-right{display:flex;align-items:center;gap:8px;flex-wrap:nowrap}.hud-pill{background:rgba(255,255,255,.92);border:2px solid #fff;border-radius:999px;padding:9px 12px;font-weight:1000;box-shadow:0 8px 18px rgba(143,103,255,.14);white-space:nowrap}.hud-btn{border:none;border-radius:999px;background:linear-gradient(135deg,var(--pink-strong),var(--blue-strong));color:#fff;font-size:15px;font-weight:1000;padding:10px 13px;cursor:pointer;box-shadow:0 8px 18px rgba(77,184,255,.24);white-space:nowrap}.game-stage{flex:1 1 auto;min-height:0;display:flex;align-items:center;justify-content:center;padding:8px;overflow:hidden}.game-stage canvas{display:block;max-width:100%;max-height:100%;touch-action:none}.game-overlay-message{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%) scale(.9);z-index:1200;display:none;min-width:min(92vw,440px);padding:28px 22px;border-radius:34px;text-align:center;background:linear-gradient(135deg,#fff,#ffe5f4,#e7f7ff);border:5px solid #fff;box-shadow:0 30px 80px rgba(143,103,255,.35);font-size:28px;font-weight:1000;animation:meliePop .32s ease forwards;cursor:pointer}.game-overlay-message small{display:block;margin-top:12px;font-size:16px;color:#7a5b99;line-height:1.45}@keyframes meliePop{to{transform:translate(-50%,-50%) scale(1)}}body.game-lock{overflow:hidden!important;position:fixed;width:100%}@media(max-width:650px){.game-hud{height:auto;min-height:58px;padding:7px 6px}.hud-pill{font-size:12px;padding:8px 8px}.hud-btn{font-size:12px;padding:9px 10px}.game-stage{padding:4px}.game-overlay-message{font-size:23px}.start-game-btn{width:100%;font-size:20px}}

/* fullscreen v2 for all games */
.setup-note{max-width:760px;margin:10px auto 0;font-size:18px;font-weight:800;line-height:1.45}.fullscreen-board-wrap{width:100%;height:100%;display:flex;align-items:center;justify-content:center;overflow:hidden}.tic-full-board{width:min(92vmin,720px);height:min(92vmin,720px);display:grid;gap:8px}.tic-full-board .tic-cell{font-size:clamp(32px,9vmin,82px)}.full-stat-row{display:flex;gap:8px;flex-wrap:wrap;justify-content:center;margin:10px 0}.full-stat{background:rgba(255,255,255,.86);border:2px solid #fff;border-radius:999px;padding:9px 13px;font-weight:1000}.full-controls{display:grid;grid-template-columns:repeat(3,minmax(180px,1fr));gap:14px;margin-top:20px}.full-controls label{text-align:left;font-weight:900}.full-controls span{display:block;margin-bottom:7px}.full-message{position:fixed;left:50%;top:50%;transform:translate(-50%,-50%);z-index:1300;display:none;width:min(90vw,520px);padding:26px 22px;border-radius:34px;background:linear-gradient(135deg,#fff,#ffe5f4,#e7f7ff);border:5px solid #fff;text-align:center;box-shadow:0 30px 80px rgba(143,103,255,.35);font-size:28px;font-weight:1000;cursor:pointer}.full-message.show{display:block;animation:meliePop .3s ease}.memory-full-board{width:min(96vmin,760px);height:min(78vh,760px);display:grid;gap:8px}.memory-full-board .memory-card{min-width:0;min-height:0;border:0;background:transparent;perspective:900px;cursor:pointer}.memory-full-board .card-inner{position:relative;width:100%;height:100%;transition:transform .45s;transform-style:preserve-3d}.memory-full-board .memory-card.open .card-inner,.memory-full-board .memory-card.matched .card-inner{transform:rotateY(180deg)}.memory-full-board .card-face{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;backface-visibility:hidden;border:3px solid #fff;border-radius:16px;font-size:clamp(22px,6vmin,50px);box-shadow:0 8px 20px rgba(143,103,255,.14)}.memory-full-board .card-back{background:linear-gradient(135deg,var(--pink-strong),var(--blue-strong));color:#fff}.memory-full-board .card-front{background:#fff;transform:rotateY(180deg)}.snake-full-stage{width:100%;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:10px}.snake-canvas-wrap{width:min(78vmin,calc(100vw - 20px));height:min(78vmin,calc(100vw - 20px),calc(100vh - 170px));aspect-ratio:1/1;border-radius:28px;background:linear-gradient(135deg,#ffffff,#eefaff);border:5px solid #fff;padding:8px;box-shadow:0 20px 55px rgba(143,103,255,.18);position:relative}.snake-canvas-wrap canvas{width:100%;height:100%;display:block;border-radius:20px;background:linear-gradient(135deg,#ffe0f2,#dff4ff)}.mobile-pad.full-pad{display:grid;grid-template-columns:58px 58px 58px;grid-template-rows:58px 58px;gap:8px;justify-content:center}.pad-btn{border:3px solid #fff;border-radius:18px;background:rgba(255,255,255,.82);font-size:26px;font-weight:1000}.pad-up{grid-column:2}.pad-left{grid-column:1;grid-row:2}.pad-down{grid-column:2;grid-row:2}.pad-right{grid-column:3;grid-row:2}@media(max-width:760px){.full-controls{grid-template-columns:1fr}.tic-full-board{width:min(94vmin,640px);height:min(94vmin,640px)}.memory-full-board{width:96vmin;height:min(74vh,96vmin)}.game-hud{font-size:12px}.hud-left,.hud-right{gap:4px}.hud-pill{font-size:12px;padding:7px 7px}.hud-btn{font-size:12px;padding:8px 8px}}


/* Melie Games Framework 1.0 - Common Popup Component */
.melie-popup-overlay{
  position:fixed;
  inset:0;
  z-index:3000;
  display:none;
  align-items:center;
  justify-content:center;
  padding:18px;
  background:rgba(61,40,84,.22);
  backdrop-filter:blur(8px);
  -webkit-backdrop-filter:blur(8px);
}
.melie-popup-overlay.active{display:flex;animation:melieOverlayFade .18s ease both}
.melie-popup-card{
  width:min(92vw,520px);
  max-height:min(88vh,680px);
  overflow:auto;
  text-align:center;
  border-radius:34px;
  border:5px solid #fff;
  background:linear-gradient(135deg,#fff,#ffe9f6 52%,#e7f7ff);
  box-shadow:0 34px 90px rgba(61,40,84,.32);
  padding:28px 22px 24px;
  transform:scale(.92) translateY(10px);
  animation:meliePopupIn .24s ease forwards;
}
.melie-popup-icon{font-size:52px;line-height:1;margin:0 0 12px;filter:drop-shadow(0 8px 12px rgba(143,103,255,.18))}
.melie-popup-title{font-size:clamp(28px,6vw,48px);line-height:1.08;font-weight:1000;color:var(--text);margin:0 0 12px;text-wrap:balance}
.melie-popup-body{font-size:clamp(16px,3.8vw,22px);font-weight:850;color:#6d5684;line-height:1.38;margin:0 auto 22px;max-width:420px}
.melie-popup-actions{display:flex;flex-direction:column;gap:12px;align-items:stretch;margin-top:4px}
.melie-popup-btn{border:none;border-radius:999px;font-size:clamp(17px,4.2vw,22px);font-weight:1000;padding:15px 20px;cursor:pointer;box-shadow:0 16px 35px rgba(77,184,255,.24)}
.melie-popup-primary{background:linear-gradient(135deg,var(--pink-strong),var(--blue-strong));color:#fff}
.melie-popup-secondary{background:rgba(255,255,255,.84);color:var(--text);border:3px solid rgba(255,255,255,.95)}
.popup-win .melie-popup-card{background:linear-gradient(135deg,#fff,#fff0f8 45%,#e7f7ff)}
.popup-lose .melie-popup-card{background:linear-gradient(135deg,#fff,#ffe8f0 45%,#eef7ff)}
@keyframes melieOverlayFade{from{opacity:0}to{opacity:1}}
@keyframes meliePopupIn{to{transform:scale(1) translateY(0)}}
body.popup-lock{overscroll-behavior:none}
/* Legacy popup hosts now delegate to the common component */
.full-message,.game-overlay-message{display:none!important}
@media(max-width:560px){.melie-popup-overlay{padding:12px}.melie-popup-card{border-radius:28px;padding:24px 18px 20px}.melie-popup-icon{font-size:44px}.melie-popup-btn{padding:14px 16px}}

/* Melie Game Engine v1 helpers */
.melie-popup-subtitle{font-size:clamp(19px,4.4vw,28px);font-weight:1000;color:var(--text);margin:-4px 0 12px;line-height:1.2}.melie-confetti{position:fixed;inset:0;pointer-events:none;z-index:2500;overflow:hidden}.melie-confetti i{position:absolute;top:-18px;width:10px;height:16px;border-radius:4px;animation:melieConfettiFall 2s ease-in forwards}@keyframes melieConfettiFall{to{top:110vh;transform:translateX(40px) rotate(720deg);opacity:.2}}.melie-shake{animation:melieShake .35s ease both}@keyframes melieShake{0%,100%{transform:translateX(0)}20%{transform:translateX(-8px)}40%{transform:translateX(8px)}60%{transform:translateX(-5px)}80%{transform:translateX(5px)}}.melie-pop{animation:melieQuickPop .24s ease both}@keyframes melieQuickPop{50%{transform:scale(1.08)}}

/* Melie Games v1.0.1-alpha framework additions */
.version-badge{display:inline-flex;align-items:center;gap:8px;margin:16px auto 0;padding:9px 14px;border-radius:999px;background:rgba(255,255,255,.62);border:2px solid rgba(255,255,255,.9);font-weight:1000;color:var(--text);box-shadow:0 8px 18px rgba(143,103,255,.14)}
.theme-princess{--pink:#ffe0f3;--pink-strong:#ff73bd;--blue:#eadcff;--blue-strong:#a873ff;--purple:#d34aa0}
.theme-space{--pink:#24164d;--pink-strong:#8f67ff;--blue:#0a1d4f;--blue-strong:#4db8ff;--purple:#fff;--text:#fff;--card:rgba(255,255,255,.15)}
.theme-ocean{--pink:#c9fff4;--pink-strong:#34c7b7;--blue:#c8efff;--blue-strong:#2d9cff;--purple:#1371a7}
.theme-candy{--pink:#ffe2ef;--pink-strong:#ff6aa8;--blue:#fff0b8;--blue-strong:#ffb84d;--purple:#b35cff}
.melie-sparkles{position:fixed;inset:0;pointer-events:none;z-index:2600;overflow:hidden}.melie-sparkles i{position:absolute;font-style:normal;font-size:24px;animation:melieSparkleFloat 1.45s ease-out forwards;filter:drop-shadow(0 8px 10px rgba(143,103,255,.18))}@keyframes melieSparkleFloat{0%{transform:translateY(10px) scale(.7);opacity:0}20%{opacity:1}100%{transform:translateY(-55px) scale(1.25) rotate(18deg);opacity:0}}

/* Find the Differences game */
.compact-hero{padding-bottom:28px}.differences-setup{max-width:800px;margin-inline:auto}.differences-shell{background:linear-gradient(145deg,#fff0f8,#eaf8ff)}
.differences-hud{position:relative;z-index:10}.differences-stage{flex:1;min-height:0;display:grid;grid-template-columns:1fr 1fr;gap:14px;padding:14px;align-items:center;justify-content:center;overflow:hidden}
.difference-board{width:100%;max-height:calc(100vh - 150px);aspect-ratio:4/3;container-type:inline-size;border:5px solid #fff;border-radius:26px;overflow:hidden;box-shadow:0 18px 45px rgba(69,55,98,.22);background:#fff}
.difference-scene{position:relative;width:100%;height:100%;overflow:hidden}.scene-ground{position:absolute;left:-5%;right:-5%;bottom:-9%;height:36%;border-radius:50% 50% 0 0/25% 25% 0 0;opacity:.96}
.scene-dot{position:absolute;width:1.2cqi;height:1.2cqi;border-radius:50%;background:rgba(255,255,255,.65);box-shadow:0 0 12px rgba(255,255,255,.8)}
.difference-object{position:absolute;transform:translate(-50%,-50%);width:1.45em;height:1.45em;display:grid;place-items:center;border:0;background:transparent;cursor:pointer;line-height:1;border-radius:50%;filter:drop-shadow(0 8px 7px rgba(31,40,80,.22));transition:transform .15s ease,background .15s ease,outline .15s ease}
.difference-object:hover{transform:translate(-50%,-50%) scale(1.08)}.difference-object:focus-visible{outline:4px solid #fff;outline-offset:2px}
.difference-found{background:rgba(107,227,144,.36);outline:4px solid #48d679;outline-offset:2px;animation:melieQuickPop .35s ease both}.difference-found::after{content:'✓';position:absolute;right:-.15em;top:-.15em;width:.62em;height:.62em;border-radius:50%;display:grid;place-items:center;background:#38ca70;color:#fff;font-size:.42em;font-weight:1000;border:2px solid #fff}
.difference-hint{animation:differenceHint .55s ease-in-out 3!important;background:rgba(255,233,89,.48)!important;outline:5px solid #ffe052!important}@keyframes differenceHint{50%{transform:translate(-50%,-50%) scale(1.28)}}
.differences-tip{text-align:center;margin:0 12px 10px;font-weight:900;color:#6d5684}.differences-stage.melie-shake{animation:melieShake .35s ease both}
@media(max-width:760px){.differences-stage{grid-template-columns:1fr;gap:8px;padding:8px}.difference-board{width:min(100%,520px);max-height:calc((100vh - 158px)/2);margin:auto;border-width:3px;border-radius:18px}.differences-hud{padding:7px}.differences-hud .hud-pill{padding:7px 9px;font-size:13px}.differences-hud .hud-btn{min-width:40px;padding:7px 9px}.differences-tip{font-size:13px;margin-bottom:5px}}

/* Find the Differences v1.1.1 - subtle variants on the same scene */
.difference-object.variant-small{transform:translate(-50%,-50%) scale(.72)}
.difference-object.variant-mirror{transform:translate(-50%,-50%) scaleX(-1)}
.difference-object.variant-rotate{transform:translate(-50%,-50%) rotate(18deg)}
.difference-object.variant-hue{filter:hue-rotate(125deg) saturate(1.35) drop-shadow(0 8px 7px rgba(31,40,80,.22))}
.difference-object.variant-missing{opacity:0}
.difference-object.variant-missing::before{content:'';position:absolute;inset:-.15em;border-radius:50%}
.difference-object.variant-move{ }
.difference-object.variant-small:hover{transform:translate(-50%,-50%) scale(.79)}
.difference-object.variant-mirror:hover{transform:translate(-50%,-50%) scaleX(-1) scale(1.08)}
.difference-object.variant-rotate:hover{transform:translate(-50%,-50%) rotate(18deg) scale(1.08)}
.difference-object.variant-missing.difference-found{opacity:1;background:rgba(107,227,144,.36)}
.difference-object.variant-missing.difference-found{font-size:0!important}
.difference-object.variant-missing.difference-found::before{content:'○';font-size:42px;color:#38ca70;display:grid;place-items:center}