/* extracted from takas380-arcade-css */
/* TAKAS ARCADE 380 · four original offline mini games · fully isolated selectors */
.ta-arcade-entry{margin:12px 0 17px;width:100%;min-height:82px;border:1px solid #e63d6388;border-radius:17px;background:linear-gradient(112deg,#2e1931,#121e32 65%,#17111f);color:#fff;display:flex;align-items:center;gap:14px;text-align:left;padding:14px 17px;box-shadow:0 8px 22px #0005;cursor:pointer}
.ta-arcade-entry>span:first-child{font-size:30px}
.ta-arcade-entry b{font-weight:900;font-size:16px;display:block;margin-bottom:4px}
.ta-arcade-entry small{font-size:11px;color:#bfcce2}
.ta-arcade-entry>span:last-child{margin-left:auto;font-size:21px;color:#fd4e77}
.ta-arcade-dialog{width:min(94vw,740px)!important;max-width:none!important;max-height:92dvh!important;border-radius:21px;padding:15px!important;background:linear-gradient(140deg,#101929,#090d16)!important;overscroll-behavior:contain;}
.ta-game-head{display:flex;align-items:center;gap:12px;justify-content:space-between;margin:3px 0 13px;position:relative;z-index:2}
.ta-game-head h2{font-size:clamp(17px,4vw,22px);color:#fff;font-weight:900;margin:0}
.ta-game-head button{border:1px solid #667389;background:#253043;color:#fff;border-radius:11px;min-width:38px;min-height:38px;cursor:pointer;font-size:22px}
.ta-game-picker{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px;margin-top:12px}
.ta-game-picker button{border:1px solid #43516d;border-radius:15px;min-height:130px;background:#1a2437;color:#fff;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:9px;font-weight:800;text-align:center;padding:14px 8px;cursor:pointer;font-size:14px}
.ta-game-picker button span{font-size:36px}.ta-game-picker button:active,.ta-arcade-entry:active{filter:brightness(1.18)}
.ta-game-description{color:#bfc9da;line-height:1.5;font-size:12px;margin:6px 0 13px}
.ta-scoreline{display:flex;justify-content:space-between;align-items:center;gap:6px;flex-wrap:wrap;margin:8px 0 14px}
.ta-scoreline span{display:inline-flex;background:#19273d;color:#fff;min-width:76px;justify-content:center;border:1px solid #43516b;border-radius:9px;padding:7px 10px;font-weight:800;font-size:12px}
.ta-btn{min-height:42px;padding:9px 13px;border:1px solid #ff506c;background:#f51f48;color:#fff;border-radius:12px;font-size:13px;font-weight:800;cursor:pointer}
.ta-btn.secondary{background:#1c293d;border-color:#445779}
.ta-game-footer{display:flex;justify-content:center;gap:9px;flex-wrap:wrap;margin-top:13px}
.ta-game-status{min-height:20px;text-align:center;font-weight:850;color:#ff8eab;font-size:13px;margin-top:10px}
.ta-match-board{width:min(100%,380px);display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:4px;margin:0 auto;padding:9px;border-radius:17px;border:2px solid #41546f;background:linear-gradient(140deg,#0b1425,#203559);touch-action:none;user-select:none}
.ta-m-tile{width:100%;aspect-ratio:1;border-radius:10px;border:1px solid #536e90;background:linear-gradient(145deg,#364760,#1c293e);display:grid;place-items:center;font-size:clamp(20px,5.5vw,32px);padding:0;box-shadow:inset 0 -3px 1px #0003;cursor:pointer;touch-action:none;-webkit-tap-highlight-color:transparent}
.ta-m-tile.active{outline:3px solid #ffe46b;outline-offset:-3px;background:#637ba0;transform:scale(.96)}
.ta-m-tile:disabled{opacity:.75}
.ta-maze-canvas{display:block;width:100%;max-width:420px;height:auto;aspect-ratio:420/364;margin:0 auto;background:#0b1c32;border:2px solid #4782b2;border-radius:10px;touch-action:none}
.ta-pad{display:grid;grid-template-columns:repeat(3,58px);gap:5px;justify-content:center;margin:14px 0 0}
.ta-pad button{min-height:46px;border:1px solid #475e81;border-radius:10px;background:#253855;color:#fff;font-size:21px;cursor:pointer}
.ta-pad .blank{visibility:hidden}
.ta-diff-pair{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px;justify-content:center}
.ta-diff-panel{position:relative;display:block;border:2px solid #61718f;border-radius:12px;overflow:hidden;cursor:crosshair;background:#d3e7f4;aspect-ratio:3/2;min-width:0;touch-action:manipulation}
.ta-diff-panel svg{width:100%;height:100%;display:block;pointer-events:none}
#diffDialog .ta-diff-hints{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin:8px 0 12px}
#diffDialog .ta-diff-hint-btn{min-height:42px;display:inline-flex;align-items:center;gap:8px;border:1px solid #d59e30;border-radius:12px;background:#3b2b15;color:#ffedb5;padding:9px 14px;font-size:13px;font-weight:850;cursor:pointer}
#diffDialog .ta-diff-hint-btn strong{display:inline-flex;align-items:center;justify-content:center;min-width:26px;min-height:26px;border-radius:20px;background:#ecbd62;color:#1d1a14;padding:2px 6px;font-size:13px;font-weight:900}
#diffDialog .ta-diff-hint-btn:disabled{opacity:.5;cursor:not-allowed}
#diffDialog .ta-diff-hint-help{font-size:11px;line-height:1.4;color:#b6c4da;flex:1 1 160px;text-align:right}
#diffDialog .ta-d-hint-marker{position:absolute;display:block;left:0;top:0;width:14%;aspect-ratio:1;transform:translate(-50%,-50%);border:3px solid #ffe28a;border-radius:50%;background:#ffe97738;box-shadow:0 0 0 4px #ffc94644,0 0 22px 7px #ffe66e94;pointer-events:none;animation:ta-hint-pulse 1.3s ease-in-out infinite}
#diffDialog .ta-d-hint-marker:after{content:'💡';position:absolute;top:-18px;left:50%;transform:translateX(-50%);font-size:14px;line-height:1}
@keyframes ta-hint-pulse{0%,100%{box-shadow:0 0 0 3px #ffc94644,0 0 15px 5px #ffe66e66}50%{box-shadow:0 0 0 8px #ffc94624,0 0 25px 11px #ffe66eb0}}
@media(prefers-reduced-motion:reduce){#diffDialog .ta-d-hint-marker{animation:none}}
.ta-d-ring{position:absolute;width:12%;aspect-ratio:1;border:3px solid #fa2253;border-radius:50%;transform:translate(-50%,-50%);background:#fff4;box-shadow:0 0 0 3px #fff9;pointer-events:none}
@media(max-width:540px){.ta-diff-pair{grid-template-columns:1fr;gap:9px;max-width:350px;margin:0 auto}.ta-diff-panel{width:100%}.ta-arcade-dialog{padding:12px!important}.ta-game-picker button{min-height:111px;font-size:12px}.ta-game-picker button span{font-size:30px}}
@media(max-width:350px){.ta-game-picker{gap:7px}.ta-m-tile{font-size:21px}.ta-scoreline span{font-size:11px;min-width:60px;padding:6px 7px}}

/* extracted from takas383-difference-level-styles */
#diffDialog .ta-diff-level-tools{display:grid;gap:7px;background:#111c2d;border:1px solid #3d4c65;border-radius:13px;padding:10px 12px;margin:3px 0 12px;}
#diffDialog .ta-diff-level-tools label{font-size:12px;font-weight:850;color:#e4eafb;}
#diffDialog .ta-diff-level-controls{display:flex;align-items:center;gap:9px;flex-wrap:wrap;}
#diffDialog .ta-diff-prev{flex:0 0 42px;height:42px;border-radius:10px;border:1px solid #60708a;color:#fff;background:#202e44;font-weight:900;font-size:24px;cursor:pointer;}
#diffDialog .ta-diff-prev:disabled{opacity:.4;cursor:default;}
#diffDialog .ta-diff-level-controls select{flex:1 1 135px;min-width:0;width:100%;max-width:100%;height:44px;border:1px solid #697894;border-radius:10px;padding:6px 11px;color:#fff;background:#17253b;font-size:14px;font-weight:800;}
#diffDialog .ta-diff-difficulty{flex:0 1 auto;font-size:11px;font-weight:850;letter-spacing:.03em;color:#ffd5df;background:#6020376e;border:1px solid #ff547666;border-radius:999px;padding:7px 9px;}
#diffDialog .ta-diff-panel{aspect-ratio:3/2;background:#d4e8fa;}
#diffDialog .ta-d-ring{width:8%;border-width:2.5px;box-shadow:0 0 0 2px #fff9;background:#ff1c4650;}
@media(max-width:380px){#diffDialog .ta-diff-level-controls{gap:7px}#diffDialog .ta-diff-prev{flex-basis:39px;height:39px}#diffDialog .ta-diff-level-controls select{height:41px;font-size:12px}#diffDialog .ta-diff-difficulty{font-size:10px}}

/* extracted from takas390-match-effects */
/* TAKAS 390: Fruit match visual feedback. GPU-friendly CSS transforms; reduced-motion accessible. */
#matchBoard{position:relative;isolation:isolate;overflow:hidden;background:radial-gradient(ellipse at 30% 12%,#283e67 0%,#122238 47%,#0b1729 100%)!important;box-shadow:inset 0 0 24px #03070f99,0 8px 24px #0005}
#matchBoard .ta-m-tile{position:relative;z-index:1;background:linear-gradient(155deg,#354f6f,#1c2c43 60%,#142137);border-color:#6c88a5b0;text-shadow:0 2px 5px #080e1880;box-shadow:inset 0 2px 2px #ffffff25,inset 0 -4px 5px #030b1899,0 2px 4px #030a1680;transition:transform .14s ease,filter .16s ease,box-shadow .16s ease;will-change:transform}
#matchBoard .ta-m-tile:before{content:"";position:absolute;inset:2px 3px 45%;border-radius:inherit;background:linear-gradient(175deg,#ffffff38,#ffffff00);pointer-events:none}
#matchBoard .ta-m-tile:active:not(:disabled){transform:scale(.9);filter:brightness(1.2)}
#matchBoard .ta-m-tile.active{transform:scale(1.045);background:linear-gradient(150deg,#59789e,#253e5d);box-shadow:0 0 0 2px #ffe28b,0 0 12px #ffdc65a8,inset 0 1px 3px #fff5}
#matchBoard .ta-m-tile:disabled{opacity:1}
#matchBoard .ta-m-tile.ta-m-swapped{animation:ta390swap .19s cubic-bezier(.15,1.5,.38,1) both}
#matchBoard .ta-m-tile.ta-m-clearing{z-index:2;animation:ta390explode .33s cubic-bezier(.2,.75,.3,1) forwards;filter:drop-shadow(0 0 8px #fff7b3)}
#matchBoard .ta-m-tile.ta-m-dropping{animation:ta390drop .32s cubic-bezier(.21,1.16,.28,1) var(--fall-delay,0ms) both}
#matchBoard.ta-m-combo-pulse{animation:ta390shake .24s ease-out}
#matchBoard .ta-m-fx-layer{pointer-events:none;position:absolute;inset:0;z-index:20;overflow:hidden;border-radius:inherit}
#matchBoard .ta-m-spark{position:absolute;display:block;width:7px;height:7px;border-radius:2px;background:var(--spark-color,#ffdd66);box-shadow:0 0 8px var(--spark-color,#ffdd66);transform:translate(-50%,-50%);animation:ta390spark .55s ease-out both}
#matchBoard .ta-m-spark:nth-child(3n){width:4px;height:10px;border-radius:4px}
#matchBoard .ta-m-spark:nth-child(4n){border-radius:50%}
#matchBoard .ta-m-burst{position:absolute;width:20px;height:20px;border:2px solid #ffe391;border-radius:50%;box-shadow:0 0 24px #fff2a8,0 0 9px #fff;background:#fff5;transform:translate(-50%,-50%);animation:ta390ring .48s ease-out both}
#matchBoard .ta-m-points{position:absolute;white-space:nowrap;font:900 clamp(18px,6vw,27px)/1 system-ui,sans-serif;color:#fff7b7;text-shadow:0 2px 1px #7a2657,0 4px 8px #f10064,0 0 13px #ffe179;transform:translate(-50%,-50%);animation:ta390points .8s cubic-bezier(.19,1,.4,1) both}
#matchBoard .ta-m-combo{position:absolute;left:50%;top:47%;padding:10px 17px;white-space:nowrap;border:1px solid #fff9d0d0;background:linear-gradient(120deg,#ff236a,#e54aa7);color:white;border-radius:999px;box-shadow:0 0 0 5px #ff408d33,0 5px 25px #ff236b99;transform:translate(-50%,-50%);font:950 clamp(16px,5vw,25px)/1.1 system-ui,sans-serif;letter-spacing:.04em;animation:ta390combo .63s ease-out both}
@keyframes ta390swap{0%{transform:scale(.78)}70%{transform:scale(1.12)}100%{transform:scale(1)}}
@keyframes ta390explode{0%{transform:scale(1);opacity:1}45%{transform:scale(1.28);opacity:1;filter:brightness(1.5)}100%{transform:scale(.12) rotate(25deg);opacity:0}}
@keyframes ta390drop{0%{transform:translateY(-55%) scale(.85);opacity:.55}72%{transform:translateY(4%) scale(1.03);opacity:1}100%{transform:translateY(0) scale(1);opacity:1}}
@keyframes ta390spark{0%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}100%{opacity:0;transform:translate(calc(-50% + var(--dx,20px)),calc(-50% + var(--dy,30px))) rotate(var(--spin,90deg)) scale(.15)}}
@keyframes ta390ring{0%{opacity:.95;transform:translate(-50%,-50%) scale(.4)}100%{opacity:0;transform:translate(-50%,-50%) scale(9)}}
@keyframes ta390points{0%{opacity:0;transform:translate(-50%,0) scale(.65)}22%{opacity:1;transform:translate(-50%,-50%) scale(1.2)}66%{opacity:1}100%{opacity:0;transform:translate(-50%,-140%) scale(1)}}
@keyframes ta390combo{0%{opacity:0;transform:translate(-50%,-50%) rotate(-7deg) scale(.3)}24%{opacity:1;transform:translate(-50%,-50%) rotate(2deg) scale(1.2)}66%{opacity:1;transform:translate(-50%,-50%) scale(1)}100%{opacity:0;transform:translate(-50%,-60%) scale(1.17)}}
@keyframes ta390shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-3px)}60%{transform:translateX(3px)}}
@media(prefers-reduced-motion:reduce){#matchBoard .ta-m-tile,#matchBoard .ta-m-tile.ta-m-clearing,#matchBoard .ta-m-tile.ta-m-dropping,#matchBoard .ta-m-tile.ta-m-swapped,#matchBoard.ta-m-combo-pulse,#matchBoard .ta-m-spark,#matchBoard .ta-m-burst,#matchBoard .ta-m-points,#matchBoard .ta-m-combo{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}}

/* extracted from takas391-snake-single-tap-right */
.snake-dialog .snake-controls{display:flex!important;justify-content:center!important;align-items:center!important;margin:10px 0 12px!important;gap:0!important;}
.snake-dialog .snake-tap-right{grid-area:auto!important;min-width:min(100%,260px);min-height:66px;border:1px solid #fa6384!important;border-radius:18px!important;background:linear-gradient(135deg,#b61442,#f0355a)!important;color:#fff!important;display:flex!important;align-items:center;justify-content:center;gap:12px;font-weight:850;font-size:16px;box-shadow:0 7px 24px #ad194766!important;touch-action:manipulation;cursor:pointer}
.snake-dialog .snake-tap-right:active{transform:scale(.97);filter:brightness(1.12)}
.snake-dialog .snake-rotate-icon{font-size:32px;line-height:1}
.snake-dialog .snake-turn-instruction{text-align:center;font-size:13px;line-height:1.5;color:#d2dce9;margin:10px auto 2px;max-width:420px;font-weight:650}
.snake-dialog #snakeCanvas{cursor:pointer;touch-action:none}

/* extracted from takas399-match-super-powers */
#matchDialog .ta-match-tools{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin:12px auto 4px;max-width:410px}
#matchDialog .ta-match-power{min-width:0;min-height:54px;padding:7px 4px;border-radius:13px;border:1px solid #5c7190;background:linear-gradient(160deg,#263c5b,#172238);color:#eef5ff;font-weight:800;font-size:13px;line-height:1.35;cursor:pointer;display:flex;align-items:center;justify-content:center;gap:4px;flex-wrap:wrap;box-shadow:0 3px 7px #0003}
#matchDialog .ta-match-power span{font-size:11px;white-space:normal;text-align:center}
#matchDialog .ta-match-power b{font-size:12px;color:#ffce73}
#matchDialog .ta-match-power.active{border-color:#ffd46d;background:linear-gradient(130deg,#57334f,#69335f);box-shadow:0 0 0 2px #fff2a833,0 0 16px #f4bd4270}
#matchDialog .ta-match-power:disabled{opacity:.4;cursor:default}
#matchDialog .ta-match-power-hint{font-size:12px;color:#ffdea8;min-height:18px;margin:4px 4px 10px;text-align:center}
#matchBoard[data-power-fx="bomb"]:after,#matchBoard[data-power-fx="rocket"]:after,#matchBoard[data-power-fx="rainbow"]:after,#matchBoard[data-power-fx="shuffle"]:after{content:"";position:absolute;inset:0;z-index:5;pointer-events:none;animation:ta399-power .62s ease-out both}
#matchBoard[data-power-fx="bomb"]:after{background:radial-gradient(circle,#fff3aacc,#ff6c3088 28%,transparent 67%)}
#matchBoard[data-power-fx="rocket"]:after{background:linear-gradient(90deg,transparent 0 42%,#ffed9988 47% 53%,transparent 58%),linear-gradient(0deg,transparent 0 42%,#dce9ff88 47% 53%,transparent 58%)}
#matchBoard[data-power-fx="rainbow"]:after{background:conic-gradient(from 30deg,#ff636899,#ffd36077,#70eab899,#7b92ff99,#e888eb99,#ff636899)}
#matchBoard[data-power-fx="shuffle"]:after{background:repeating-linear-gradient(45deg,#ffffff44 0 12px,transparent 12px 22px)}
@keyframes ta399-power{0%{opacity:0;transform:scale(.72)}27%{opacity:.94;transform:scale(1.04)}100%{opacity:0;transform:scale(1.18)}}
@media(max-width:370px){#matchDialog .ta-match-tools{gap:5px}#matchDialog .ta-match-power{font-size:12px;min-height:59px}#matchDialog .ta-match-power span{font-size:10px}}
@media(prefers-reduced-motion:reduce){#matchBoard[data-power-fx]:after{animation-duration:.01ms!important}}

/* extracted from takas402-fullscreen-arcade */
/* V402: Full-screen arcade games on mobile; only the outer dialog frame is removed.
   Game boards and interactive controls retain their own necessary boundaries. */
@media (max-width: 800px) {
  html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) {
    position:fixed!important;
    inset:0!important;
    top:0!important;
    right:0!important;
    bottom:0!important;
    left:0!important;
    margin:0!important;
    width:100vw!important;
    min-width:0!important;
    max-width:100vw!important;
    height:100vh!important;
    height:100dvh!important;
    min-height:100vh!important;
    min-height:100dvh!important;
    max-height:100vh!important;
    max-height:100dvh!important;
    padding:0 12px calc(22px + env(safe-area-inset-bottom,0px))!important;
    box-sizing:border-box!important;
    border:0!important;
    outline:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    background:linear-gradient(180deg,#080c14 0%,#0e192a 21%,#0b1423 100%)!important;
    color:#f6f8ff!important;
    overflow-x:hidden!important;
    overflow-y:auto!important;
    overscroll-behavior-y:contain;
    -webkit-overflow-scrolling:touch;
  }
  html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)::backdrop {
    background:#080c14!important;
  }
  /* One real TAKAS header is physically moved into the active dialog by the app. */
  body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header,
  body.takas368-global-header:has(#home.active) dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header {
    position:sticky!important;
    top:0!important;
    width:calc(100% + 24px)!important;
    max-width:none!important;
    height:90px!important;
    min-height:90px!important;
    margin:0 -12px 14px!important;
    padding:6px 12px 3px!important;
    border:0!important;
    border-radius:0!important;
    box-shadow:none!important;
    z-index:30!important;
    transform:none!important;
  }
  body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header .logo-button img {width:clamp(126px,42vw,205px)!important;}
  body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header .header-actions {gap:6px!important;}
  dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog) .ta-game-head,
  dialog#snakeDialog .dialog-top {
    position:relative!important;
    margin:2px 0 10px!important;
    padding:0!important;
    border:0!important;
    border-radius:0!important;
    background:transparent!important;
    box-shadow:none!important;
    align-items:center!important;
  }
  dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) .ta-game-close,
  dialog#snakeDialog .dialog-top button {
    flex-shrink:0;
  }
  dialog#snakeDialog .dialog-top h2 {font-size:clamp(20px,5.5vw,27px)!important;line-height:1.18!important;}
  dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog) .ta-game-head h2 {font-size:clamp(18px,5.1vw,24px)!important;line-height:1.2!important;}
  dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) .ta-game-description {margin:9px 0 12px!important;}
  dialog#matchDialog .ta-match-tools {max-width:100%!important;}
  dialog#matchDialog .ta-match-board {width:min(100%,470px)!important;max-width:100%!important;}
  dialog#mazeDialog .ta-maze-stage {width:100%!important;max-width:480px!important;margin:0 auto!important;}
  dialog#mazeDialog .ta-maze-canvas {width:100%!important;max-width:480px!important;}
  dialog#diffDialog .ta-diff-pair {max-width:480px!important;margin:0 auto!important;}
  dialog#snakeDialog canvas {width:min(100%,480px)!important;max-width:100%!important;}
  dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) .ta-game-footer {padding-bottom:14px!important;}
}
@media (max-width:360px) {
  body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header {
    height:84px!important;min-height:84px!important;padding:6px 8px 3px!important;
  }
  body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header .logo-button img {width:clamp(122px,41vw,156px)!important;}
}

/* extracted from takas405-arcade-real-fullscreen */
/* The five arcade screens are top-layer fullscreen pages, not centered, rounded pop-ups.
   This block is deliberately in <head> so it applies to the actual game dialogs. */
html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog){
    position:fixed!important;
    inset:0!important;
    top:0!important;right:0!important;bottom:0!important;left:0!important;
    margin:0!important;
    width:100vw!important;min-width:0!important;max-width:100vw!important;
    height:100vh!important;height:100dvh!important;
    min-height:100vh!important;min-height:100dvh!important;
    max-height:100vh!important;max-height:100dvh!important;
    padding:0 14px calc(22px + env(safe-area-inset-bottom,0px))!important;
    border:none!important;outline:none!important;border-radius:0!important;
    box-shadow:none!important;
    background:linear-gradient(180deg,#080c14 0%,#0e192a 21%,#0b1423 100%)!important;
    color:#f6f8ff!important;
    box-sizing:border-box!important;
    overflow-x:hidden!important;overflow-y:auto!important;
    overscroll-behavior:contain;
    -webkit-overflow-scrolling:touch;
    -webkit-tap-highlight-color:transparent;
}
html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)::backdrop{
    background:#080c14!important;
}
/* Keep the shared logo/phone/language header at top, without recreating an outer card. */
html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header{
    position:sticky!important;
    top:0!important;
    z-index:40!important;
    width:calc(100% + 28px)!important;
    max-width:none!important;
    margin:0 -14px 10px!important;
    padding:4px 14px 3px!important;
    border:none!important;
    border-radius:0!important;
    box-shadow:none!important;
    box-sizing:border-box!important;
    transform:none!important;
}
html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) .ta-game-head,
html body dialog#snakeDialog .dialog-top{
    border:none!important;border-radius:0!important;box-shadow:none!important;
    background:transparent!important;
}
/* Fluid game boards, no parent card constraining them. */
html body dialog#matchDialog .ta-match-board{
    width:100%!important;max-width:580px!important;margin-left:auto!important;margin-right:auto!important;
}
html body dialog#mazeDialog .ta-maze-stage,
html body dialog#mazeDialog .ta-maze-canvas{
    width:100%!important;max-width:580px!important;margin-left:auto!important;margin-right:auto!important;
}
html body dialog#snakeDialog #snakeCanvas{
    width:min(100%,580px)!important;max-width:100%!important;margin-left:auto!important;margin-right:auto!important;
}
html body dialog#diffDialog .ta-diff-pair{
    width:100%!important;max-width:720px!important;margin-left:auto!important;margin-right:auto!important;
}
/* Leave room for navigating with accessibility controls and safe-area insets. */
html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) .ta-game-footer{
    padding-bottom:max(20px,env(safe-area-inset-bottom,0px))!important;
}
@media(max-width:800px){
  html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog){
    padding-left:10px!important;padding-right:10px!important;
  }
  html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog) > .site-header{
    width:calc(100% + 20px)!important;
    margin:0 -10px 10px!important;
    padding:4px 10px 3px!important;
  }
}

/* extracted from takas411-larger-match-board */
/* 411: larger sweets and board, with the existing seven-column gameplay. */
html body dialog#matchDialog[open]{
  --match-gutter-left:max(6px,env(safe-area-inset-left,0px));
  --match-gutter-right:max(6px,env(safe-area-inset-right,0px));
  padding-left:var(--match-gutter-left)!important;
  padding-right:var(--match-gutter-right)!important;
}
html body dialog#matchDialog[open] > .site-header{
  width:calc(100% + var(--match-gutter-left) + var(--match-gutter-right))!important;
  margin-left:calc(0px - var(--match-gutter-left))!important;
  margin-right:calc(0px - var(--match-gutter-right))!important;
}
html body dialog#matchDialog #matchBoard{
  width:100%!important;
  max-width:640px!important;
  padding:5px!important;
  gap:4px!important;
}
html body dialog#matchDialog #matchBoard .ta-m-tile{
  min-width:0;
  font-size:clamp(22px,6.2vw,36px)!important;
}
html body dialog#matchDialog #mtStatus:empty,
html body dialog#matchDialog #mtBombHint:empty{display:none!important;}

/* extracted from takas412-compact-maze-controls */
/* TAKAS 412: compact direction pad and more room for the scooter maze. */
html body dialog#mazeDialog[open]{
  --maze-gutter-left:max(4px,env(safe-area-inset-left,0px));
  --maze-gutter-right:max(4px,env(safe-area-inset-right,0px));
  padding-left:var(--maze-gutter-left)!important;
  padding-right:var(--maze-gutter-right)!important;
}
html body dialog#mazeDialog[open] > .site-header{
  width:calc(100% + var(--maze-gutter-left) + var(--maze-gutter-right))!important;
  margin-left:calc(0px - var(--maze-gutter-left))!important;
  margin-right:calc(0px - var(--maze-gutter-right))!important;
}
html body dialog#mazeDialog .ta-maze-stage,
html body dialog#mazeDialog .ta-maze-canvas{
  width:100%!important;
  max-width:640px!important;
  margin-left:auto!important;
  margin-right:auto!important;
}
html body dialog#mazeDialog .ta-pad{
  grid-template-columns:repeat(3,44px)!important;
  grid-template-rows:repeat(2,40px)!important;
  gap:4px!important;
  margin:8px 0 0!important;
  padding:0!important;
}
html body dialog#mazeDialog .ta-pad button{
  width:44px!important;
  height:40px!important;
  min-width:0!important;
  min-height:40px!important;
  padding:0!important;
  border-radius:8px!important;
  font-size:16px!important;
  line-height:1!important;
  display:grid;
  place-items:center;
  touch-action:manipulation;
}

/* extracted from takas413-compact-match-tools */
/* TAKAS 413: four compact tools in one row leave more room for the board. */
html body dialog#matchDialog .ta-match-tools{
  display:grid!important;
  grid-template-columns:repeat(4,minmax(0,1fr))!important;
  width:100%!important;
  max-width:640px!important;
  gap:6px!important;
  margin:8px auto 6px!important;
  padding:0!important;
  align-items:stretch!important;
}
html body dialog#matchDialog .ta-match-tools .ta-match-power{
  position:relative;
  min-width:0!important;
  width:100%!important;
  height:60px!important;
  min-height:60px!important;
  max-height:60px!important;
  padding:30px 3px 5px!important;
  border-radius:11px!important;
  display:flex!important;
  flex-direction:column!important;
  flex-wrap:nowrap!important;
  align-items:center!important;
  justify-content:center!important;
  gap:0!important;
  text-align:center!important;
  touch-action:manipulation;
}
html body dialog#matchDialog .ta-match-tools .ta-match-power .ta-match-ico{
  position:absolute!important;
  left:7px!important;
  top:5px!important;
  transform:none!important;
  width:24px!important;
  height:24px!important;
  border-radius:7px!important;
  font-size:18px!important;
  line-height:1!important;
}
html body dialog#matchDialog .ta-match-tools .ta-match-power span{
  width:100%!important;
  max-width:100%!important;
  font-size:10.5px!important;
  line-height:1.12!important;
  font-weight:800;
  white-space:normal!important;
  overflow-wrap:anywhere;
  text-align:center!important;
}
html body dialog#matchDialog .ta-match-tools .ta-match-power b{
  top:6px!important;
  right:4px!important;
  min-width:22px!important;
  padding:2px 4px!important;
  font-size:10px!important;
  line-height:1.2!important;
}
@media(max-width:340px){
  html body dialog#matchDialog .ta-match-tools{gap:4px!important;}
  html body dialog#matchDialog .ta-match-tools .ta-match-power span{font-size:10px!important;}
}

/* extracted from takas416-arcade-icons-only */
/* 416 — compact top-right icons ONLY inside the five TAKAS Arcade screens.
   Same phone and 15-language picker size as the Terms screen from 415.
   Game sound/close controls are slightly smaller too; functions are untouched. */
@media (max-width:800px) {
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .header-actions {
   gap:5px!important;
 }
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .call-btn {
   box-sizing:border-box!important;
   width:34px!important;height:34px!important;
   min-width:34px!important;min-height:34px!important;
 }
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .call-btn svg {
   width:18px!important;height:18px!important;
 }
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .takas-language-header {
   box-sizing:border-box!important;
   width:82px!important;min-width:82px!important;max-width:82px!important;
   height:35px!important;min-height:35px!important;
   grid-template-columns:23px 18px!important;
   gap:5px!important;
   padding-left:7px!important;padding-right:17px!important;
 }
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .takas-language-header .takas-selected-flag-img {
   width:23px!important;min-width:23px!important;max-width:23px!important;height:16px!important;
 }
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .takas-language-header .takas-selected-lang {
   width:18px!important;min-width:18px!important;font-size:10px!important;
 }
 html body.takas368-global-header dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog,#snakeDialog)[open] > .site-header .takas-language-header::after {
   right:7px!important;
 }
 /* Reduce the visual height of the top-right sound/close buttons within Arcade. */
 html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog)[open] > .ta-game-head {
   gap:6px!important;
 }
 html body dialog:is(#arcadeDialog,#matchDialog,#mazeDialog,#diffDialog)[open] > .ta-game-head > button,
 html body dialog#snakeDialog[open] > .dialog-top > button {
   box-sizing:border-box!important;
   width:36px!important;height:36px!important;
   min-width:36px!important;min-height:36px!important;
   max-width:36px!important;
   border-radius:10px!important;
   padding:4px!important;
   font-size:19px!important;
   line-height:1!important;
   display:inline-flex!important;
   align-items:center!important;
   justify-content:center!important;
   flex-shrink:0!important;
 }
 html body dialog#snakeDialog[open] > .dialog-top {
   gap:6px!important;
 }
}