:root{--lounge-cream:#f8f3e9;--lounge-ink:#203d35;--lounge-gold:#bfa06a;--lounge-line:#dcd0bd}
body.ludicera-lounge{background:radial-gradient(ellipse at 50% 0,#fffdf7,#f1e9dc 75%);color:var(--lounge-ink);display:flex;flex-direction:column;align-items:center;justify-content:flex-start;padding:18px 26px;gap:0}
.ludicera-header{width:min(1280px,100%);display:flex;align-items:center;gap:12px;margin:0 0 18px;padding:0 0 14px;border-bottom:1px solid var(--lounge-line)}
.ludicera-header .logo{padding:0;background:none;line-height:0}.ludicera-header .logo img{width:62px;height:62px;object-fit:contain;mix-blend-mode:multiply}.ludicera-header h1{font:600 30px Georgia,serif}.ludicera-header p{font-size:13px;margin:4px 0 0}
.ludicera-lounge #visit-counter{font-size:11px;padding:3px 8px;background:transparent;border:0;box-shadow:none;margin:0 0 12px;min-height:0;color:#68736a;align-self:center}
.lounge-game{width:min(1280px,100%)!important;min-width:0;max-width:100%}.lounge-game .game-header{gap:14px;flex-wrap:wrap;margin-bottom:14px}.lounge-game .game-header h2{font:600 32px Georgia,serif}.lounge-game .game-header h2:before{content:'♠';font-size:26px;margin-right:9px;color:#264c3d}.lounge-game .game-header p{font-size:13px;color:#687065}
.lounge-game .game-toolbar{min-width:0;flex-wrap:wrap;gap:8px}.lounge-game .game-toolbar button{min-height:42px;padding:10px 14px;border:1px solid var(--lounge-line);border-radius:10px;background:linear-gradient(#fffdf8,#f2eadf);color:var(--lounge-ink);box-shadow:0 2px 3px #4a351012;transition:background-color 150ms,box-shadow 150ms}
.lounge-game .game-toolbar button:hover:not(:disabled){background:#eadcc5;box-shadow:0 3px 7px #4a35101f}.lounge-game .game-toolbar button:focus-visible,.game-help-card summary:focus-visible{outline:3px solid #a7803e;outline-offset:3px}
.lounge-game .table-scroll{border:2px solid #bfa06a;border-radius:24px;box-shadow:0 12px 26px #3e2d1929,0 2px 3px #3e2d1926;max-width:100%}
.lounge-game .felt{border-radius:21px;background:radial-gradient(ellipse at 45% 5%,#167146,#075638 65%,#05452e);box-shadow:inset 0 0 0 2px #f1dd9630,inset 0 2px 15px #00291bcc}
.lounge-game .playing-card{box-shadow:0 2px 4px #00180d4d}.lounge-game .column{background:#073e201a;box-shadow:inset 0 0 0 1px #d7e7bc16}.lounge-game .table-status{font-size:13px;color:#edf1dc}
.game-help-card{background:#fffbf4b8;border:1px solid var(--lounge-line);border-radius:14px;margin:12px 0 16px;padding:13px 16px;box-shadow:0 3px 10px #47381708}.game-help-card summary{cursor:pointer;font-size:15px;font-weight:600}.game-help-card .table-note{margin:12px 0 0;line-height:1.65;color:#536357}
@media(max-width:1000px){.lounge-game .game-header{align-items:flex-start}.lounge-game .game-toolbar{max-width:100%}.lounge-game .table-scroll{min-width:0}.lounge-game .felt{min-width:0}}
@media(max-width:700px){body.ludicera-lounge{padding:10px 8px}.ludicera-header{margin-bottom:10px;padding-bottom:10px;gap:8px}.ludicera-header .logo img{width:44px;height:44px}.ludicera-header h1{font-size:25px}.ludicera-header p{font-size:11px}.lounge-game .game-header h2{font-size:26px}.lounge-game .game-header{gap:10px}.lounge-game .game-toolbar{width:100%;display:grid;grid-template-columns:repeat(2,minmax(0,1fr))}.lounge-game .game-toolbar button{padding:8px 6px;font-size:12px;white-space:normal}.lounge-game .table-scroll{border-radius:15px}.lounge-game .felt{border-radius:12px}.game-help-card{padding:11px 12px}.game-help-card summary{font-size:14px}}
@media(prefers-reduced-motion:reduce){.lounge-game .game-toolbar button{transition:none}}

.ludicera-lounge .visitor-badge{font-size:11px;padding:2px 8px;background:transparent;border:0;box-shadow:none;margin:0 0 10px;color:#68736a}
.language-bar{margin-left:auto;display:flex;gap:4px;align-items:center;flex-wrap:wrap;max-width:100%}.language-bar button{display:grid;place-items:center;font-family:'Segoe UI Emoji','Apple Color Emoji',sans-serif;font-size:21px;line-height:1;min-width:36px;min-height:36px;padding:5px;border:1px solid transparent;border-radius:8px;background:transparent;color:#203d35;cursor:pointer}.language-bar button:hover{background:#efe4d2}.language-bar button[aria-pressed=true]{background:#ead8b1;border-color:#a88142;box-shadow:inset 0 -2px #886b35}.language-bar button:focus-visible{outline:3px solid #9a753b;outline-offset:2px}
@media(max-width:700px){.ludicera-header{flex-wrap:wrap}.language-bar{gap:2px}.language-bar button{font-size:19px;min-width:32px;min-height:36px;padding:4px}}
@media(max-width:520px){.language-bar{width:100%;justify-content:flex-end;margin-top:3px}.language-bar button{min-width:34px}}

.language-bar img{display:block;width:24px;height:16px;object-fit:cover;border-radius:2px;box-shadow:0 0 0 1px #0002}
@media(max-width:700px){:is(#table,#dk-table,#kl-table,#ft-table,#fc-table,#ss-table,#ds-table) .game-toolbar{grid-template-columns:repeat(2,minmax(0,1fr))}}


/* Ludicera v38 premium game polish */
:root{
  --lounge-cream:#f5efe4;
  --lounge-cream-2:#fffaf1;
  --lounge-ink:#173e35;
  --lounge-muted:#68756d;
  --lounge-gold:#b99555;
  --lounge-gold-soft:#d9c49b;
  --lounge-line:#ddd0bc;
  --lounge-felt:#075c3d;
  --lounge-felt-deep:#03452f;
}
body.ludicera-lounge{
  background:
    radial-gradient(circle at 12% 16%,#ffffff80 0 4%,transparent 5%),
    radial-gradient(circle at 88% 10%,#ffffff66 0 3%,transparent 4%),
    linear-gradient(180deg,#fbf7ef 0%,#f2eadf 58%,#eee4d7 100%);
  color:var(--lounge-ink);
  padding:20px 28px 34px;
}
.ludicera-header{
  width:min(1320px,100%);
  min-height:82px;
  gap:14px;
  padding:12px 18px 14px;
  margin:0 auto 18px;
  border:1px solid #e2d6c5;
  border-radius:18px;
  background:linear-gradient(180deg,#fffdf8e8,#f8f1e7dc);
  box-shadow:0 12px 34px #5c463014,0 2px 5px #5c463012;
  backdrop-filter:blur(8px);
}
.ludicera-header .logo{
  width:68px;height:68px;display:grid;place-items:center;flex:0 0 auto;
}
.ludicera-header .logo img{
  width:64px;height:64px;filter:drop-shadow(0 3px 4px #4937192b);mix-blend-mode:multiply;
}
.ludicera-header h1{font:600 31px/1.05 Georgia,serif;letter-spacing:.2px;color:#173e35}
.ludicera-header p{font-size:13px;color:#6f756e;margin:6px 0 0}
.ludicera-header .header-visitor{
  margin-left:auto!important;margin-bottom:0!important;padding:5px 10px!important;
  border:1px solid #e1d4bf!important;border-radius:999px!important;
  background:#fffaf0cc!important;color:#647069!important;font-size:11px!important;
  line-height:1.2;white-space:nowrap;
}
.ludicera-header .language-bar{margin-left:4px;gap:3px;padding:3px;border:1px solid #e5d8c5;border-radius:10px;background:#fffaf0b8}
.ludicera-header .language-bar button{min-width:34px;min-height:31px;border-radius:7px}
.ludicera-header .language-bar button:hover{background:#efe2cc}
.ludicera-header .language-bar button[aria-pressed=true]{background:#ead5a9;border-color:#a78242;box-shadow:0 1px 2px #5f461a24,inset 0 -2px #8a6a33}

.lounge-game{width:min(1320px,100%)!important;margin:0 auto;position:relative}
.lounge-game .game-header{
  position:relative;display:flex;align-items:center;justify-content:space-between;
  gap:18px;flex-wrap:wrap;margin:0 0 13px;padding:0 4px;
}
.lounge-game .game-header>div:first-child{min-width:210px}
.lounge-game .game-header h2{
  font:600 32px/1.05 Georgia,serif;color:#173e35;letter-spacing:.15px;margin:0;
  display:flex;align-items:center;gap:7px;
}
.lounge-game .game-header h2:before{
  content:'♠';font-size:23px;line-height:1;color:#173e35;
  width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  background:#efe5d3;border:1px solid #d5c19a;box-shadow:inset 0 0 0 3px #fff8ec;
  margin-right:2px;
}
.lounge-game .game-header p{font-size:13px;color:#778077;margin:5px 0 0 43px}
.lounge-game .game-toolbar{display:flex;align-items:center;justify-content:flex-end;gap:7px;flex-wrap:wrap;margin-left:auto}
.lounge-game .game-toolbar button{
  min-height:40px;padding:9px 13px;border:1px solid #d8cbb8;border-radius:10px;
  background:linear-gradient(180deg,#fffdf8,#f0e5d6);color:#23483e;
  box-shadow:0 2px 4px #513d2415,inset 0 1px #fff;
  font-size:13px;font-weight:600;transition:transform 130ms ease,box-shadow 130ms ease,background 130ms ease;
}
.lounge-game .game-toolbar button:hover:not(:disabled){
  transform:translateY(-1px);background:linear-gradient(180deg,#fffaf0,#e8d7bb);box-shadow:0 4px 10px #513d2423,inset 0 1px #fff;
}
.lounge-game .game-toolbar button:active:not(:disabled){transform:translateY(0)}
.lounge-game .game-toolbar button[id$='new'],
.lounge-game .game-toolbar #new-deal{
  border-color:#b9975d;background:linear-gradient(180deg,#f2d99b,#dfbd72);color:#24453c;box-shadow:0 3px 8px #75571e25,inset 0 1px #fff8d9;
}
.lounge-game .game-toolbar button[data-feedback-button]{background:linear-gradient(180deg,#fffdf8,#f4ecdf);border-color:#d8c7aa}

.lounge-game .table-scroll{
  overflow-x:auto;
  border:2px solid #9b7740;
  border-radius:24px;
  padding:6px;
  background:linear-gradient(145deg,#d9c09a,#9b7740 38%,#76552c 58%,#cfb184);
  box-shadow:0 18px 44px #3f2f1c2c,0 4px 10px #3f2f1c24,inset 0 1px #f6e6c5;
}
.lounge-game .felt{
  position:relative;
  border-radius:18px;
  background:
    radial-gradient(circle at 35% 18%,#16805840 0 2px,transparent 3px),
    radial-gradient(circle at 72% 76%,#b3d6b214 0 1px,transparent 2px),
    radial-gradient(ellipse at 48% 2%,#0b6845 0%,#064b34 52%,#033824 100%);
  background-size:auto,7px 7px,auto;
  box-shadow:inset 0 0 0 1px #d7c58c28,inset 0 4px 22px #00291dcc,inset 0 -16px 34px #00291d66;
  border:1px solid #d7c58c2b;
}
.lounge-game .felt:before{
  content:'';position:absolute;inset:8px;border:1px solid #e8d9aa14;border-radius:13px;pointer-events:none;
}
.lounge-game .table-top,.lounge-game .kl-top,.lounge-game .ft-top,.lounge-game .fc-top,.lounge-game .ss-top,.lounge-game .dk-top,.lounge-game .ds-top{position:relative;z-index:1}
.lounge-game .columns{position:relative;z-index:1;align-items:stretch}
.lounge-game .column{
  background:linear-gradient(180deg,#ffffff08,#001f1215);
  border:1px solid #dfeac813;
  border-radius:9px;
  box-shadow:inset 0 1px #ffffff0a;
}
/* Center each card precisely inside its tableau column. */
.lounge-game .columns .column>.playing-card{
  left:50%!important;
  transform:translateX(-50%)!important;
}
.lounge-game .playing-card{
  box-shadow:0 3px 7px #00180d50,0 1px 2px #00180d40!important;
  transition:box-shadow 120ms ease,filter 120ms ease;
}
.lounge-game .column .playing-card:hover{box-shadow:0 5px 12px #00180d63,0 2px 4px #00180d50!important;filter:brightness(1.015)}
.lounge-game .playing-card.chosen{outline:3px solid #f0ce74!important;box-shadow:0 0 0 2px #fff3c255,0 7px 16px #00180d70!important}
.lounge-game .column.drop-target{background:#e8dba013!important;outline:2px solid #d7b967!important;outline-offset:-2px}

.lounge-game .foundation,.lounge-game .kl-slot,.lounge-game .ft-slot,.lounge-game .fc-slot,.lounge-game .ss-slot,.lounge-game .dk-slot,.lounge-game .ds-slot{
  border-color:#e9ddbb63!important;
  background:linear-gradient(180deg,#ffffff08,#001d1214)!important;
  box-shadow:inset 0 0 0 1px #ffffff08,inset 0 3px 8px #001b1029;
}
.lounge-game .foundation:not(.complete):empty:after{content:'♠';color:#dbe7d62c;font:28px Georgia,serif}
.lounge-game .stock-caption{color:#d6e1d3;font-size:11px;letter-spacing:.1px}
.lounge-game .table-status{
  position:relative;z-index:1;display:flex;align-items:center;min-height:34px;
  color:#e6eee2;font-size:12px;line-height:1.35;padding:7px 10px;border-top:1px solid #dae5c91c;
  background:linear-gradient(180deg,#ffffff05,#001a101f);border-radius:8px;
}

.game-help-card{
  background:linear-gradient(180deg,#fffdf8,#f8f0e4);
  border:1px solid #ddcfbb;border-radius:15px;margin:14px 0 18px;padding:0;
  box-shadow:0 7px 22px #503b2011;overflow:hidden;
}
.game-help-card summary{
  list-style:none;cursor:pointer;padding:14px 16px;font:600 15px Georgia,serif;color:#244b40;
  display:flex;align-items:center;gap:9px;
}
.game-help-card summary::-webkit-details-marker{display:none}
.game-help-card summary:before{content:'♠';width:26px;height:26px;display:grid;place-items:center;border-radius:50%;background:#efe1c8;color:#234b40;font-size:13px;border:1px solid #d2bb8f}
.game-help-card summary:after{content:'▾';margin-left:auto;color:#9a7c4d;font:14px Segoe UI,sans-serif;transition:transform 150ms ease}
.game-help-card[open] summary:after{transform:rotate(180deg)}
.game-help-card .table-note{margin:0;padding:0 16px 16px 51px;line-height:1.65;color:#58685e;font-size:12.5px}

@media(min-width:1180px){
  body.ludicera-lounge:before,body.ludicera-lounge:after{position:fixed;z-index:-1;opacity:.5;pointer-events:none;filter:blur(.1px)}
  body.ludicera-lounge:before{content:'♣';left:34px;top:42%;font:112px Georgia,serif;color:#1c5a4720;transform:rotate(-12deg)}
  body.ludicera-lounge:after{content:'♦';right:38px;top:45%;font:102px Georgia,serif;color:#a4772d1c;transform:rotate(12deg)}
}

@media(max-width:860px){
  .ludicera-header{padding:9px 10px;border-radius:14px;gap:9px}
  .ludicera-header .header-visitor{order:3;margin-left:0!important}
  .ludicera-header .language-bar{order:4;margin-left:auto}
  .lounge-game .game-header{align-items:flex-start;gap:10px}
  .lounge-game .game-toolbar{width:100%;justify-content:flex-start;margin-left:0}
}
@media(max-width:700px){
  body.ludicera-lounge{padding:8px 6px 18px}
  .ludicera-header{margin-bottom:9px;min-height:0}
  .ludicera-header .logo{width:48px;height:48px}.ludicera-header .logo img{width:46px;height:46px}
  .ludicera-header h1{font-size:25px}.ludicera-header p{font-size:11px;margin-top:3px}
  .ludicera-header .header-visitor{font-size:10px!important;padding:4px 7px!important}
  .ludicera-header .language-bar{width:auto;margin-top:0;padding:2px;gap:1px}
  .ludicera-header .language-bar button{min-width:31px;min-height:29px;padding:3px}
  .ludicera-header .language-bar img{width:22px;height:15px}
  .lounge-game .game-header{padding:0 2px;margin-bottom:9px}
  .lounge-game .game-header h2{font-size:25px}.lounge-game .game-header h2:before{width:30px;height:30px;font-size:19px}
  .lounge-game .game-header p{margin-left:39px;font-size:11px}
  .lounge-game .game-toolbar{display:grid!important;grid-template-columns:repeat(2,minmax(0,1fr))!important;gap:5px!important}
  .lounge-game .game-toolbar button{min-height:42px;padding:7px 5px;font-size:11.5px}
  .lounge-game .table-scroll{padding:3px;border-radius:15px;border-width:1px}
  .lounge-game .felt{border-radius:11px!important}
  .game-help-card summary{padding:12px;font-size:14px}.game-help-card .table-note{padding:0 12px 13px 12px;font-size:11.5px}
  .game-help-card summary:before{width:23px;height:23px}
}
@media(prefers-reduced-motion:reduce){
  .lounge-game .playing-card,.lounge-game .game-toolbar button,.game-help-card summary:after{transition:none!important}
}


/* v38.2: Klondike uses the same visual card scale as Spider on desktop. */
@media(min-width:701px) and (min-height:501px){
  #kl-table #kl-columns{
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    gap:18px!important;
  }
  #kl-table #kl-columns .column{
    min-width:0!important;
  }
  #kl-table #kl-columns .column>.playing-card{
    width:76px!important;
    max-width:76px!important;
    height:108px!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }
  #kl-table .kl-top{
    grid-template-columns:repeat(7,minmax(0,1fr))!important;
    gap:18px!important;
  }
  #kl-table .kl-slot{
    width:76px!important;
    max-width:76px!important;
    height:108px!important;
    justify-self:center!important;
  }
  #kl-table #kl-stock{
    width:76px!important;
    max-width:76px!important;
    height:108px!important;
    margin-inline:auto!important;
  }
  #kl-table .kl-slot .playing-card{
    width:76px!important;
    max-width:76px!important;
    height:108px!important;
  }
  #kl-table .kl-top>div:first-child,
  #kl-table .stock-caption{text-align:center!important}
  #kl-table #kl-foundations .kl-slot{justify-self:center!important}
}

/* v38.3: one shared desktop card scale + adjustable, centered tableau spacing. */
:root{
  --ludicera-card-width:76px;
  --ludicera-card-height:108px;
  --ludicera-card-gap:44px;
}

.card-spacing-control{
  margin:18px 0 4px;padding:14px 14px 12px;border:1px solid #d8cbb8;border-radius:12px;
  background:linear-gradient(180deg,#fffdf8,#f6eee2);box-shadow:0 2px 7px #513d2410;
}
.card-spacing-control .spacing-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}
.card-spacing-control .spacing-label{font-weight:600;color:#24483d}
.card-spacing-control .spacing-value{font-size:12px;color:#6b756d;white-space:nowrap}
.card-spacing-control input[type=range]{width:100%;accent-color:#a67f3d;margin:5px 0 4px}
.card-spacing-control .spacing-ends{display:flex;justify-content:space-between;font-size:11px;color:#7b817b}
.card-spacing-control .spacing-note{margin:7px 0 0!important;font-size:12px;color:#677269;line-height:1.45}

@media(min-width:701px) and (min-height:501px){
  /* Every game uses the same full-width lounge table; games with fewer piles simply keep empty side space. */
  #table,#kl-table,#ft-table,#fc-table,#ss-table,#dk-table,#ds-table{
    width:min(1320px,100%)!important;
  }

  /* Fixed Spider-sized cards in every tableau. */
  #columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}
  #kl-columns{grid-template-columns:repeat(7,var(--ludicera-card-width))!important}
  #ft-columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}
  #fc-columns{grid-template-columns:repeat(8,var(--ludicera-card-width))!important}
  #ss-columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}
  #dk-columns{grid-template-columns:repeat(9,var(--ludicera-card-width))!important}
  #ds-columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}

  :is(#columns,#kl-columns,#ft-columns,#fc-columns,#ss-columns,#dk-columns,#ds-columns){
    width:100%!important;
    column-gap:var(--ludicera-card-gap)!important;
    row-gap:0!important;
    justify-content:center!important;
    justify-items:center!important;
    margin-inline:auto!important;
  }
  :is(#columns,#kl-columns,#ft-columns,#fc-columns,#ss-columns,#dk-columns,#ds-columns)>.column{
    width:var(--ludicera-card-width)!important;
    min-width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
  }
  :is(#columns,#kl-columns,#ft-columns,#fc-columns,#ss-columns,#dk-columns,#ds-columns)>.column>.playing-card{
    width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
    left:50%!important;
    transform:translateX(-50%)!important;
  }

  /* Stock / waste / free cells use the same physical card dimensions. */
  :is(.kl-slot,.ft-slot,.fc-slot,.dk-slot){
    width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
    aspect-ratio:auto!important;
  }
  :is(.kl-slot,.ft-slot,.fc-slot,.dk-slot) .playing-card{
    width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
  }
  #kl-stock,#ft-stock,#dk-stock{
    width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
  }

  /* Keep top rows balanced even though tableau pile counts differ. */
  #kl-table .kl-top,#ft-table .ft-top,#dk-table .dk-top,
  #ss-table .ss-top,#ds-table .ds-top{
    width:100%!important;
  }
  #kl-table .kl-slot,#ft-table .ft-slot,#dk-table .dk-slot{justify-self:center!important}
  #fc-cells,#fc-foundations{
    grid-template-columns:repeat(4,var(--ludicera-card-width))!important;
    justify-content:center!important;
    gap:18px!important;
  }
  .fc-top>div{display:flex;flex-direction:column;align-items:center}
  #ss-foundations,#ds-foundations{justify-items:center}
}

/* On phones keep the existing responsive, compact grid. */
@media(max-width:700px), (max-width:1000px) and (max-height:500px){
  .card-spacing-control{display:none}
}

/* v38.4: force the shared spacing value on every game's tableau grid.
   The per-game legacy rules use very specific !important gap declarations,
   so this equally-specific late rule plus the JS inline fallback makes the
   slider effective for Spider, Klondike, Forty Thieves, FreeCell,
   Simple Simon, Double Klondike and Double Scorpion. */
@media(min-width:701px) and (min-height:501px){
  #table #columns,
  #kl-table #kl-columns,
  #ft-table #ft-columns,
  #fc-table #fc-columns,
  #ss-table #ss-columns,
  #dk-table #dk-columns,
  #ds-table #ds-columns{
    column-gap:var(--ludicera-card-gap)!important;
    row-gap:0!important;
  }
}


/* v38.5: discreet card-spacing control beside the green playing surface. */
.game-table-shell{
  display:grid;
  grid-template-columns:minmax(0,1fr) 34px;
  gap:7px;
  align-items:center;
  width:100%;
}
.game-table-shell>.table-scroll{min-width:0;width:100%}
.card-spacing-side-control{
  width:34px;
  min-height:148px;
  align-self:center;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
  gap:6px;
  box-sizing:border-box;
  padding:7px 5px;
  border:1px solid #d8c6a8;
  border-radius:16px;
  background:linear-gradient(180deg,#fffdf8e8,#f1e6d6e0);
  box-shadow:0 3px 10px #513d2414,inset 0 1px #fff;
  color:#315347;
  opacity:.78;
  transition:opacity 140ms ease,box-shadow 140ms ease;
}
.card-spacing-side-control:hover,
.card-spacing-side-control:focus-within{
  opacity:1;
  box-shadow:0 4px 14px #513d2422,inset 0 1px #fff;
}
.card-spacing-side-control .spacing-icon{
  font:600 15px/1.1 'Segoe UI Symbol','Segoe UI',sans-serif;
  color:#876a38;
}
.card-spacing-side-control input[type=range]{
  width:18px;
  height:96px;
  margin:0;
  padding:0;
  writing-mode:vertical-lr;
  direction:rtl;
  accent-color:#a67f3d;
  cursor:ns-resize;
}
.card-spacing-side-control .spacing-value{
  min-width:20px;
  text-align:center;
  font-size:9px;
  line-height:1;
  color:#7a756c;
  font-variant-numeric:tabular-nums;
}
/* The old settings-panel version is no longer used. */
.card-spacing-control{display:none!important}

@media(max-width:900px), (max-height:500px){
  .game-table-shell{display:block}
  .card-spacing-side-control{display:none!important}
}

/* v38.6 – tighter, truly centred tableau spacing for every game. */
:root{--ludicera-card-gap:14px}
@media(min-width:701px) and (min-height:501px){
  #columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}
  #kl-columns{grid-template-columns:repeat(7,var(--ludicera-card-width))!important}
  #ft-columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}
  #fc-columns{grid-template-columns:repeat(8,var(--ludicera-card-width))!important}
  #ss-columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}
  #dk-columns{grid-template-columns:repeat(9,var(--ludicera-card-width))!important}
  #ds-columns{grid-template-columns:repeat(10,var(--ludicera-card-width))!important}

  :is(#columns,#kl-columns,#ft-columns,#fc-columns,#ss-columns,#dk-columns,#ds-columns){
    width:max-content!important;
    max-width:100%!important;
    column-gap:var(--ludicera-card-gap)!important;
    row-gap:0!important;
    justify-content:start!important;
    justify-items:center!important;
    margin-inline:auto!important;
  }
  :is(#columns,#kl-columns,#ft-columns,#fc-columns,#ss-columns,#dk-columns,#ds-columns)>.column{
    width:var(--ludicera-card-width)!important;
    min-width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
  }
}

/* v38.6 slider: compact, subtle and intuitive. Bottom = closer, top = wider. */
.card-spacing-side-control{min-height:140px;width:32px;padding:6px 4px;gap:5px;opacity:.7}
.card-spacing-side-control input[type=range]{height:88px;width:18px;writing-mode:vertical-lr;direction:rtl}
.card-spacing-side-control .spacing-value{font-size:8px;color:#83786a}
.card-spacing-side-control .spacing-icon{font-size:14px}

/* v38.6 premium start page details */
#menu.premium-menu-v386{width:min(1280px,100%);position:relative}
#menu.premium-menu-v386 .window{
  border-radius:20px;border-color:#d9c9b2;background:#fffaf2db;
  box-shadow:0 18px 42px #604a2c1b,0 2px 6px #604a2c12;
  overflow:hidden;
}
#menu.premium-menu-v386 .window>.bar{display:none}
#menu.premium-menu-v386 .layout{
  grid-template-columns:280px minmax(420px,1fr) 240px;
  gap:20px;padding:18px 20px 20px;
}
#menu.premium-menu-v386 nav:before{
  content:'🎮  Spiele auswählen';display:block;margin:5px 0 14px;
  font:600 20px Georgia,serif;color:#164538;
}
#menu.premium-menu-v386 nav>.label{display:none}
#menu.premium-menu-v386 .games{height:390px;gap:10px;padding:2px 7px 2px 2px}
#menu.premium-menu-v386 .game{
  position:relative;min-height:66px;padding:12px 34px 11px 62px;border-radius:12px;
  background:linear-gradient(180deg,#fffdf7,#f8f0e4);border-color:#ded0bd;
  box-shadow:0 1px 0 #fff inset;color:#263f37;font:500 16px Georgia,serif;
}
#menu.premium-menu-v386 .game:before{
  content:attr(data-suit);position:absolute;left:20px;top:50%;transform:translateY(-50%);
  font:30px Georgia,serif;color:#1e5a46;
}
#menu.premium-menu-v386 .game.game-available:after{
  content:'›';position:absolute;right:14px;top:50%;transform:translateY(-53%);
  font:34px/1 Georgia,serif;color:#b69456;
}
#menu.premium-menu-v386 .game.selected{
  color:#fff;background:linear-gradient(180deg,#0c6547,#064f38);border-color:#326f5b;
  box-shadow:0 8px 18px #1849391e,inset 0 1px #ffffff24;
}
#menu.premium-menu-v386 .game.selected:before{color:#fff}
#menu.premium-menu-v386 .game.selected:after{color:#fff}
#menu.premium-menu-v386 .game small{font:11px Segoe UI,Arial,sans-serif;margin-top:6px}
#menu.premium-menu-v386 .game:disabled{opacity:.58}
#menu.premium-menu-v386 .game:disabled:before{content:'♣';color:#6c746f}

#menu.premium-menu-v386 .preview{
  position:relative;overflow:hidden;min-height:390px;border-radius:16px;padding:36px 30px 28px;
  background:
    radial-gradient(circle at 30% 15%,#ffffff12 0 2px,transparent 3px),
    linear-gradient(145deg,#147c4e,#06583d 62%,#034a34);
  box-shadow:inset 0 0 0 1px #e4d6a82a,0 10px 24px #25482c1d;
}
#menu.premium-menu-v386 .preview:before{
  content:'';position:absolute;inset:0;pointer-events:none;opacity:.17;
  background:repeating-linear-gradient(12deg,transparent 0 5px,#fff 5px 6px,transparent 6px 11px);
  mix-blend-mode:soft-light;
}
#menu.premium-menu-v386 .preview>*{position:relative;z-index:1}
#menu.premium-menu-v386 .preview-ribbon{
  position:absolute;z-index:2;right:14px;top:14px;width:auto;min-width:0;padding:7px 12px;
  transform:none;border:1px solid #e0bd63;border-radius:999px;
  background:linear-gradient(180deg,#fff0bd,#e9c969);color:#5b431b;
  box-shadow:0 2px 7px #2b1e0b24;font:600 13px Georgia,serif;letter-spacing:.1px;
  line-height:1;white-space:nowrap;
}
#menu.premium-menu-v386 .preview-ribbon::before{content:'★';margin-right:5px;color:#9f7622;font-size:12px}
#menu.premium-menu-v386 .preview .cards{margin-top:4px;margin-bottom:22px;transform:scale(1.08)}
#menu.premium-menu-v386 .preview h2{font-size:45px;text-shadow:0 2px 5px #001e1430}
#menu.premium-menu-v386 .preview p{font:20px Georgia,serif;color:#eef4eb;margin-top:2px}
#menu.premium-menu-v386 .preview .start{
  min-width:290px;font:600 22px Georgia,serif;margin-top:26px;padding:15px 24px;border-radius:11px;
  background:linear-gradient(180deg,#f8d76d,#e2b84f);box-shadow:0 5px 0 #b4872f,0 9px 18px #123a292b;
}
#menu.premium-menu-v386 .preview-benefits{
  display:flex;justify-content:space-between;gap:12px;width:100%;margin-top:28px;padding-top:16px;
  border-top:1px solid #ffffff25;color:#f2e8c8;font-size:12px;
}
#menu.premium-menu-v386 .preview-benefits span{display:flex;align-items:center;gap:6px}
#menu.premium-menu-v386 .preview-benefits b{font-weight:500;color:#f7f1e0}

#menu.premium-menu-v386 .actions{padding:20px 0 0;gap:11px}
#menu.premium-menu-v386 .actions button{
  min-height:58px;display:flex;align-items:center;justify-content:flex-start;gap:14px;
  padding:12px 20px;border-radius:12px;background:linear-gradient(180deg,#fffdf7,#f5ecdf);
  border-color:#dfd0bd;font:18px Georgia,serif;box-shadow:0 2px 5px #503b1d10;
}
#menu.premium-menu-v386 .actions .action-icon{
  width:34px;height:34px;display:grid;place-items:center;border-radius:50%;
  background:#0a6447;color:#fff;font:700 18px Segoe UI,Arial,sans-serif;
}
#menu.premium-menu-v386 .menu-joker{margin-top:auto;padding-top:8px;text-align:center}
#menu.premium-menu-v386 .menu-joker img{width:108px;height:108px}
#menu.premium-menu-v386 .bottom{display:none}

.menu-discover{
  margin-top:16px;padding:15px 18px 18px;border:1px solid #ddcfbc;border-radius:18px;
  background:linear-gradient(180deg,#fffaf1e8,#f7eee1e5);box-shadow:0 12px 28px #5a43261a;
}
.discover-head h2{font:600 19px Georgia,serif;color:#174738;margin:0 0 12px}
.discover-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.discover-tile{
  position:relative;min-height:145px;overflow:hidden;border:1px solid #ddcfbc;border-radius:13px;
  background:linear-gradient(145deg,#f8f4e9,#e8e0cf);color:#183e35;padding:17px 14px 13px;text-align:center;
  box-shadow:inset 0 1px #fff,0 3px 8px #49351b10;
}
.discover-tile:hover{transform:translateY(-1px);box-shadow:inset 0 1px #fff,0 6px 14px #49351b1c}
.discover-cards{display:flex;justify-content:center;height:62px;margin-bottom:7px}
.discover-cards i{
  width:48px;height:62px;margin-left:-9px;display:grid;place-items:center;border-radius:7px;background:#fffdf6;
  border:1px solid #cfc5b5;box-shadow:0 4px 7px #3d2d1a2b;font:24px Georgia,serif;font-style:normal;
}
.discover-cards i:first-child{margin-left:0;transform:rotate(-10deg)}
.discover-cards i:last-child{transform:rotate(10deg)}
.discover-tile strong{display:block;font:600 21px Georgia,serif}
.discover-tile small{display:block;margin-top:4px;color:#687269;font-size:11px}

@media(max-width:1050px){
  #menu.premium-menu-v386 .layout{grid-template-columns:230px minmax(360px,1fr) 205px;gap:14px}
  #menu.premium-menu-v386 .preview .start{min-width:0;width:90%;font-size:19px}
  .discover-grid{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media(max-width:760px){
  #menu.premium-menu-v386 .layout{grid-template-columns:1fr;padding:14px}
  #menu.premium-menu-v386 .games{height:250px}
  #menu.premium-menu-v386 .preview{min-height:330px}
  #menu.premium-menu-v386 .actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));padding-top:0}
  #menu.premium-menu-v386 .actions button{min-height:48px;font-size:15px;padding:9px 12px}
  #menu.premium-menu-v386 .menu-joker{display:none}
  #menu.premium-menu-v386 .preview-benefits{font-size:10px;gap:5px;flex-wrap:wrap}
  .discover-grid{grid-template-columns:1fr 1fr}
}
@media(max-width:520px){
  #menu.premium-menu-v386 .preview h2{font-size:34px}
  #menu.premium-menu-v386 .preview p{font-size:16px}
  #menu.premium-menu-v386 .preview .start{font-size:17px}
  .discover-grid{grid-template-columns:1fr}
}

/* v38.7 – compact upper card areas.
   The top target/free-cell groups now use the SAME adjustable gap as the tableau,
   instead of stretching across the full green table. Desktop only; mobile keeps its
   existing compact responsive layout. */
@media(min-width:701px) and (min-height:501px){
  /* Spider: stock left, completed-sequence targets compact at the right. */
  #table .table-top{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:var(--ludicera-card-gap)!important;
  }
  #table #foundations{
    display:grid!important;
    grid-template-columns:repeat(8,61px)!important;
    gap:var(--ludicera-card-gap)!important;
    width:max-content!important;
    max-width:100%!important;
    justify-content:start!important;
  }
  #table #foundations>.foundation{
    width:61px!important;
    min-width:61px!important;
    max-width:61px!important;
  }

  /* Klondike / Forty Thieves / Double Klondike:
     stock + waste remain compact on the left; foundations become one compact group on the right. */
  #kl-table .kl-top,
  #ft-table .ft-top,
  #dk-table .dk-top{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:flex-start!important;
    gap:var(--ludicera-card-gap)!important;
    width:100%!important;
  }
  #kl-table .kl-spacer{display:none!important}
  #kl-table #kl-foundations,
  #ft-table #ft-foundations,
  #dk-table #dk-foundations{
    display:grid!important;
    grid-column:auto!important;
    gap:var(--ludicera-card-gap)!important;
    width:max-content!important;
    max-width:100%!important;
    margin-left:auto!important;
    justify-content:start!important;
    justify-items:center!important;
  }
  #kl-table #kl-foundations{grid-template-columns:repeat(4,var(--ludicera-card-width))!important}
  #ft-table #ft-foundations,
  #dk-table #dk-foundations{grid-template-columns:repeat(8,var(--ludicera-card-width))!important}

  /* FreeCell: free cells compact left, foundations compact right. */
  #fc-table .fc-top{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:space-between!important;
    gap:var(--ludicera-card-gap)!important;
    width:100%!important;
  }
  #fc-table .fc-top>div{
    width:max-content!important;
    min-width:0!important;
    align-items:flex-start!important;
  }
  #fc-table #fc-cells,
  #fc-table #fc-foundations{
    display:grid!important;
    grid-template-columns:repeat(4,var(--ludicera-card-width))!important;
    gap:var(--ludicera-card-gap)!important;
    width:max-content!important;
    max-width:100%!important;
    justify-content:start!important;
    justify-items:center!important;
  }

  /* Simple Simon / Double Scorpion: target rows form one compact group at the right. */
  #ss-table .ss-top,
  #ds-table .ds-top{
    display:flex!important;
    align-items:flex-start!important;
    justify-content:flex-end!important;
    gap:0!important;
    width:100%!important;
  }
  #ss-table #ss-foundations,
  #ds-table #ds-foundations{
    display:grid!important;
    grid-column:auto!important;
    gap:var(--ludicera-card-gap)!important;
    width:max-content!important;
    max-width:100%!important;
    margin-left:auto!important;
    justify-content:start!important;
    justify-items:center!important;
  }
  #ss-table #ss-foundations{grid-template-columns:repeat(4,var(--ludicera-card-width))!important}
  #ds-table #ds-foundations{grid-template-columns:repeat(8,var(--ludicera-card-width))!important}

  /* Completion slots that previously inherited flexible grid widths now use the same
     physical width as cards, so changing the slider only changes the gaps. */
  #ss-table .ss-slot,
  #ds-table .ds-slot{
    width:var(--ludicera-card-width)!important;
    min-width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
    aspect-ratio:auto!important;
  }
}

/* v38.13: stable toolbar + floating deal-skip control */
.table-scroll{position:relative}
.deal-skip{
  position:absolute!important;
  top:10px!important;
  left:50%!important;
  right:auto!important;
  transform:translateX(-50%)!important;
  z-index:140!important;
  display:inline-flex!important;
  align-items:center!important;
  gap:7px!important;
  width:auto!important;
  min-height:34px!important;
  padding:7px 12px!important;
  border:1px solid rgba(191,160,80,.75)!important;
  border-radius:999px!important;
  background:rgba(255,250,238,.94)!important;
  color:#25463a!important;
  box-shadow:0 4px 14px rgba(35,27,14,.16)!important;
  backdrop-filter:blur(4px);
  white-space:nowrap;
}
.deal-skip:hover,.deal-skip:focus-visible{background:#fffaf0!important;box-shadow:0 6px 18px rgba(35,27,14,.22)!important}
.context-menu .menu-trailing{min-width:20px;text-align:right;font-weight:800;color:#2c6c4f}
@media(max-width:700px), (max-width:1000px) and (max-height:500px){
 .deal-skip{top:6px!important;min-height:30px!important;padding:5px 9px!important;font-size:11px!important}
}


/* v38.17 – safety inset for exposed top cards.
   Prevents stock/waste/free-cell/foundation cards from touching or being clipped by slot edges.
   Applies consistently across all current games without changing tableau geometry. */
@media(min-width:701px) and (min-height:501px){
  :is(
    #kl-stock,#kl-waste,
    #ft-stock,#ft-waste,
    #dk-stock,#dk-waste,
    #kl-foundations .kl-slot,
    #ft-foundations .ft-slot,
    #dk-foundations .dk-slot,
    #fc-cells .fc-slot,
    #fc-foundations .fc-slot,
    #ss-foundations .ss-slot,
    #ds-foundations .ds-slot
  ){
    overflow:visible!important;
  }

  :is(
    #kl-stock,#kl-waste,
    #ft-stock,#ft-waste,
    #dk-stock,#dk-waste,
    #kl-foundations .kl-slot,
    #ft-foundations .ft-slot,
    #dk-foundations .dk-slot,
    #fc-cells .fc-slot,
    #fc-foundations .fc-slot,
    #ss-foundations .ss-slot,
    #ds-foundations .ds-slot
  ) > .playing-card{
    width:calc(100% - 6px)!important;
    max-width:calc(100% - 6px)!important;
    justify-self:center!important;
    align-self:center!important;
    margin:0!important;
    clip-path:none!important;
  }
}

@media(max-width:700px), (max-width:1000px) and (max-height:500px){
  :is(
    #kl-stock,#kl-waste,
    #ft-stock,#ft-waste,
    #dk-stock,#dk-waste,
    #kl-foundations .kl-slot,
    #ft-foundations .ft-slot,
    #dk-foundations .dk-slot,
    #fc-cells .fc-slot,
    #fc-foundations .fc-slot,
    #ss-foundations .ss-slot,
    #ds-foundations .ds-slot
  ){overflow:visible!important}
  :is(
    #kl-stock,#kl-waste,
    #ft-stock,#ft-waste,
    #dk-stock,#dk-waste,
    #kl-foundations .kl-slot,
    #ft-foundations .ft-slot,
    #dk-foundations .dk-slot,
    #fc-cells .fc-slot,
    #fc-foundations .fc-slot,
    #ss-foundations .ss-slot,
    #ds-foundations .ds-slot
  ) > .playing-card{
    width:calc(100% - 4px)!important;
    max-width:calc(100% - 4px)!important;
    justify-self:center!important;
    align-self:center!important;
    margin:0!important;
    clip-path:none!important;
  }
}

/* v38.18 – one exact desktop card size everywhere.
   All visible cards on the green tables use the same 76 × 108 px footprint,
   including stock/waste/free-cell/foundation cards. Top slots stay overflow-visible
   so shadows/edges are never clipped; unlike v38.17, top cards are no longer shrunk. */
@media(min-width:701px) and (min-height:501px){
  .lounge-game .playing-card{
    box-sizing:border-box!important;
    width:var(--ludicera-card-width)!important;
    min-width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
    min-height:var(--ludicera-card-height)!important;
    max-height:var(--ludicera-card-height)!important;
  }

  :is(
    #kl-stock,#kl-waste,#ft-stock,#ft-waste,#dk-stock,#dk-waste,
    #kl-foundations .kl-slot,#ft-foundations .ft-slot,#dk-foundations .dk-slot,
    #fc-cells .fc-slot,#fc-foundations .fc-slot,
    #ss-foundations .ss-slot,#ds-foundations .ds-slot
  ){
    box-sizing:border-box!important;
    width:var(--ludicera-card-width)!important;
    min-width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
    min-height:var(--ludicera-card-height)!important;
    max-height:var(--ludicera-card-height)!important;
    overflow:visible!important;
  }

  :is(
    #kl-stock,#kl-waste,#ft-stock,#ft-waste,#dk-stock,#dk-waste,
    #kl-foundations .kl-slot,#ft-foundations .ft-slot,#dk-foundations .dk-slot,
    #fc-cells .fc-slot,#fc-foundations .fc-slot,
    #ss-foundations .ss-slot,#ds-foundations .ds-slot
  ) > .playing-card{
    width:var(--ludicera-card-width)!important;
    min-width:var(--ludicera-card-width)!important;
    max-width:var(--ludicera-card-width)!important;
    height:var(--ludicera-card-height)!important;
    min-height:var(--ludicera-card-height)!important;
    max-height:var(--ludicera-card-height)!important;
    margin:0!important;
    justify-self:center!important;
    align-self:center!important;
    clip-path:none!important;
  }
}

/* v38.18 – autoplay speed control inside Settings. */
.autoplay-speed-settings{
  margin:18px 0 8px;padding:14px 14px 12px;border:1px solid #d8cbb8;border-radius:12px;
  background:linear-gradient(180deg,#fffdf7,#f7efe3);box-shadow:0 2px 6px #503b1d10;
}
.autoplay-speed-settings .autoplay-speed-head{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px;font-weight:650}
.autoplay-speed-settings input[type="range"]{width:100%;accent-color:#b88b37}
.autoplay-speed-settings .autoplay-speed-scale{display:flex;justify-content:space-between;gap:12px;margin-top:4px;color:#777064;font-size:11px}
.autoplay-speed-settings .autoplay-speed-value{color:#7b632f;font-size:12px;white-space:nowrap}


/* v38.21 – decorative home-page surround. Pure CSS + existing project assets:
   no decorative raster assets are required, and the game pages stay untouched. */
body.ludicera-lounge{overflow-x:hidden}
#menu.premium-menu-v386{isolation:isolate;overflow:visible}
#menu.premium-menu-v386>.window,
#menu.premium-menu-v386>.menu-discover,
#menu.premium-menu-v386>.foot{position:relative;z-index:2}
.home-decor-layer{
  position:absolute;inset:0;z-index:0;pointer-events:none;overflow:visible;
  font-family:"Segoe Print","Bradley Hand","Brush Script MT","Comic Sans MS",cursive;
  color:#a77a3d;
}
.home-decor-layer .decor-script{
  position:absolute;white-space:normal;text-align:center;
  font-size:25px;line-height:1.15;font-weight:500;font-style:italic;
  color:#a97737;text-shadow:0 1px 0 #fff8;transform:rotate(-5deg);
  filter:drop-shadow(0 1px 0 #fff8);
}
.home-decor-layer .decor-script::after{
  content:"";display:block;width:35px;height:2px;margin:10px auto 0;
  background:#ba8843;border-radius:99px;opacity:.8
}
.home-decor-layer .decor-script-top{right:-150px;top:-128px;width:140px;transform:rotate(-7deg)}
.home-decor-layer .decor-script-left{left:-150px;top:85px;width:125px;transform:rotate(-8deg);font-size:22px}

.decor-plant{position:absolute;left:-172px;top:-120px;width:175px;height:245px;filter:drop-shadow(0 12px 14px #49371b25)}
.decor-plant .stem{position:absolute;left:82px;top:45px;width:5px;height:135px;border-radius:5px;background:linear-gradient(#476b2d,#385425)}
.decor-plant .leaf{position:absolute;width:75px;height:34px;background:linear-gradient(135deg,#355e27,#6d9038 65%,#2e5221);border-radius:95% 8% 95% 8%;box-shadow:inset 0 1px 5px #ffffff25,0 5px 8px #26361922;transform-origin:90% 50%}
.decor-plant .leaf:nth-child(2){left:20px;top:26px;transform:rotate(22deg)}
.decor-plant .leaf:nth-child(3){left:78px;top:33px;transform:scaleX(-1) rotate(18deg)}
.decor-plant .leaf:nth-child(4){left:7px;top:73px;transform:rotate(4deg)}
.decor-plant .leaf:nth-child(5){left:86px;top:79px;transform:scaleX(-1) rotate(1deg)}
.decor-plant .leaf:nth-child(6){left:22px;top:119px;transform:rotate(-14deg)}
.decor-plant .leaf:nth-child(7){left:79px;top:126px;transform:scaleX(-1) rotate(-12deg)}
.decor-plant .leaf:nth-child(8){left:46px;top:2px;width:65px;transform:rotate(50deg)}
.decor-plant .pot{position:absolute;left:43px;bottom:0;width:88px;height:72px;background:linear-gradient(100deg,#eee4d3,#cbbda8);border-radius:14px 14px 34px 34px;box-shadow:inset 10px 0 15px #fff8,inset -8px 0 14px #88735922,0 7px 10px #49371b25}
.decor-plant .pot::before{content:"";position:absolute;left:-6px;right:-6px;top:-4px;height:14px;border-radius:50%;background:#dacdb9;border:1px solid #b6a58c}

.decor-coffee{position:absolute;right:-178px;top:115px;width:165px;height:165px;filter:drop-shadow(0 13px 15px #4a2f162f)}
.decor-coffee .saucer{position:absolute;inset:10px;border-radius:50%;background:radial-gradient(circle,#a76d3d 0 57%,#8f572e 58% 60%,#bb875a 61% 72%,#7a4928 73%);box-shadow:0 4px 12px #0002}
.decor-coffee .cup{position:absolute;left:36px;top:33px;width:95px;height:95px;border-radius:50%;background:radial-gradient(circle at 43% 42%,#5d2c12 0 37%,#8a4c21 38% 43%,#fff8ea 44% 72%,#e8d5b9 73% 100%);box-shadow:inset -5px -5px 9px #9b826355,0 5px 9px #0002}
.decor-coffee .cup::before{content:"";position:absolute;right:-27px;top:32px;width:38px;height:31px;border:10px solid #eee0ca;border-left:0;border-radius:0 28px 28px 0}
.decor-coffee .foam{position:absolute;left:57px;top:51px;width:50px;height:37px;border-radius:50%;background:radial-gradient(circle at 30% 35%,#d5a36b 0 4%,transparent 5%),radial-gradient(circle at 65% 56%,#c28a51 0 3%,transparent 4%);opacity:.75}

.decor-book{position:absolute;left:-184px;top:315px;width:145px;height:230px;padding:28px 18px 18px;box-sizing:border-box;border-radius:13px;background:linear-gradient(110deg,#4a291a,#6d3d27 48%,#3d2218);border:2px solid #8b603e;box-shadow:inset 0 0 0 4px #3b2015,inset 0 0 0 6px #8a5d38,0 14px 24px #39271638;transform:rotate(-9deg);color:#d5a857;text-align:center}
.decor-book::before{content:"";position:absolute;inset:8px;border:1px solid #a57548;border-radius:8px;opacity:.7}
.decor-book .book-script{position:relative;z-index:1;font-family:"Segoe Print","Bradley Hand","Brush Script MT",cursive;font-size:18px;line-height:1.2;font-style:italic}
.decor-book img{position:absolute;z-index:1;width:58px;height:58px;object-fit:contain;left:43px;bottom:25px;filter:sepia(1) saturate(.8) brightness(1.2);opacity:.88}

.decor-deck{position:absolute;right:-178px;top:390px;width:150px;height:225px;filter:drop-shadow(0 12px 16px #2530412f)}
.decor-deck .decor-card-back{position:absolute;width:104px;height:158px;border-radius:8px;border:5px solid #fff9ed;background-color:#183c70;background-image:repeating-linear-gradient(45deg,transparent 0 4px,#ffffff35 4px 5px),repeating-linear-gradient(-45deg,transparent 0 4px,#ffffff35 4px 5px);box-shadow:inset 0 0 0 2px #10274b,0 7px 12px #0003}
.decor-deck .decor-card-back::after{content:"♠";position:absolute;inset:14px;border:1px solid #dfc985aa;border-radius:5px;display:grid;place-items:center;color:#e7d493;font:48px Georgia,serif}
.decor-deck .decor-card-back:nth-child(1){left:28px;top:4px;transform:rotate(16deg)}
.decor-deck .decor-card-back:nth-child(2){left:17px;top:17px;transform:rotate(11deg)}
.decor-deck .decor-card-back:nth-child(3){left:7px;top:31px;transform:rotate(7deg)}

.decor-bottom-leaves{position:absolute;right:-160px;top:650px;width:150px;height:110px;opacity:.48}
.decor-bottom-leaves span{position:absolute;width:80px;height:34px;border-radius:95% 8% 95% 8%;background:linear-gradient(135deg,#54753a,#879b60);transform-origin:right center}
.decor-bottom-leaves span:nth-child(1){right:0;top:12px;transform:rotate(-25deg)}
.decor-bottom-leaves span:nth-child(2){right:26px;top:53px;transform:rotate(12deg)}
.decor-bottom-leaves span:nth-child(3){right:68px;top:20px;transform:rotate(42deg)}

body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header{
  position:relative;z-index:3;border-bottom-color:#d4bd91;
}
body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header::after{
  content:"";position:absolute;left:8%;right:8%;bottom:-8px;height:14px;border-bottom:2px solid #d8b975;border-radius:0 0 50% 50%;opacity:.5;pointer-events:none
}

@media(max-width:1390px){
  .home-decor-layer .decor-plant,
  .home-decor-layer .decor-coffee,
  .home-decor-layer .decor-book,
  .home-decor-layer .decor-deck,
  .home-decor-layer .decor-script,
  .home-decor-layer .decor-bottom-leaves{display:none}
}
@media(max-width:760px){
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header::after{display:none}
}

/* v38.22 – start page visually aligned much more closely with the approved premium mockup. */
@media(min-width:1400px) and (min-height:760px){
  body.ludicera-lounge:has(#menu:not([hidden])){
    padding-top:0;
    background:
      radial-gradient(circle at 7% 8%,rgba(255,255,255,.92) 0 3.5%,transparent 9%),
      radial-gradient(circle at 94% 92%,rgba(116,143,84,.10) 0 3%,transparent 11%),
      linear-gradient(180deg,#fbf6ec 0%,#f3e9da 62%,#eee0cf 100%);
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header{
    width:min(1440px,calc(100vw - 300px));
    min-height:126px;
    padding:22px 30px 28px;
    margin:0 auto 28px;
    border:0;
    border-radius:0;
    background:transparent;
    box-shadow:none;
    overflow:visible;
    isolation:isolate;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header::before{
    content:"";
    position:absolute;
    z-index:-1;
    left:50%;top:-26px;
    transform:translateX(-50%);
    width:min(1800px,100vw);
    height:166px;
    background:linear-gradient(180deg,rgba(255,253,247,.98),rgba(248,239,226,.97));
    border-bottom:2px solid rgba(190,145,67,.54);
    border-radius:0 0 50% 50% / 0 0 28px 28px;
    box-shadow:0 14px 30px rgba(80,59,31,.12);
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header::after{
    content:"";
    position:absolute;
    left:-8%;right:-8%;bottom:-2px;height:18px;
    border-bottom:1px solid rgba(255,255,255,.8);
    border-radius:0 0 50% 50%;
    opacity:.95;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header .logo{
    width:92px;height:92px;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header .logo img{
    width:88px;height:88px;
    filter:drop-shadow(0 5px 6px rgba(73,55,25,.22));
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header h1{
    font-size:56px;line-height:.98;letter-spacing:.2px;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header p{
    font:22px/1.15 Georgia,serif;color:#534d43;margin-top:8px;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header .header-visitor{
    margin-left:auto!important;
    padding:9px 15px!important;
    font-size:13px!important;
    background:#fffaf1e8!important;
    border-color:#dfcfb2!important;
    box-shadow:inset 0 1px #fff,0 2px 7px rgba(83,62,31,.08)!important;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header .language-bar{
    margin-left:16px;
    padding:6px 8px;
    gap:5px;
    border-radius:12px;
    background:#fffaf1e5;
    border:1px solid #ddc9a8;
    box-shadow:inset 0 1px #fff,0 2px 7px rgba(83,62,31,.08);
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header .language-bar button{
    min-width:38px;min-height:34px;padding:4px 5px;
  }
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header .language-bar img{
    width:27px;height:18px;
  }

  #menu.premium-menu-v386{
    width:min(1260px,calc(100vw - 380px));
    margin:0 auto;
  }
  #menu.premium-menu-v386 .window{
    border-radius:18px;
    background:linear-gradient(180deg,rgba(255,251,242,.97),rgba(250,242,230,.96));
    border-color:#d8c5a8;
    box-shadow:0 20px 45px rgba(85,58,25,.17),0 3px 9px rgba(85,58,25,.09);
  }
  #menu.premium-menu-v386 .layout{
    grid-template-columns:275px minmax(520px,1fr) 250px;
    gap:18px;
    padding:18px 20px 20px;
  }
  #menu.premium-menu-v386 nav:before{
    margin:5px 0 16px;
    font-size:24px;
  }
  #menu.premium-menu-v386 .games{
    height:420px;
  }
  #menu.premium-menu-v386 .game{
    min-height:72px;
    padding:13px 38px 12px 66px;
    font-size:18px;
  }
  #menu.premium-menu-v386 .game:before{font-size:32px}
  #menu.premium-menu-v386 .game small{font-size:12px}

  #menu.premium-menu-v386 .preview{
    min-height:470px;
    padding:44px 40px 28px;
    border-radius:17px;
    background:
      radial-gradient(circle at 35% 15%,rgba(255,255,255,.12) 0 2px,transparent 3px),
      linear-gradient(145deg,#118052,#065c3f 60%,#034a35);
    box-shadow:inset 0 0 0 1px rgba(241,220,157,.26),0 12px 28px rgba(37,72,44,.19);
  }
  #menu.premium-menu-v386 .preview:before{
    opacity:.12;
    background:repeating-linear-gradient(12deg,transparent 0 8px,rgba(255,255,255,.75) 8px 9px,transparent 9px 17px);
  }
  #menu.premium-menu-v386 .preview-ribbon{
    right:-31px;top:18px;
    width:150px;padding:9px 16px;
    border:0;border-radius:0;
    transform:rotate(27deg);
    background:linear-gradient(180deg,#f6dc87,#dbae44);
    color:#523b17;
    box-shadow:0 4px 10px rgba(43,30,11,.22);
    font-size:16px;text-align:center;
  }
  #menu.premium-menu-v386 .preview-ribbon::before{font-size:13px}
  #menu.premium-menu-v386 .preview .cards{margin-top:8px;margin-bottom:22px;transform:scale(1.35)}
  #menu.premium-menu-v386 .preview h2{font-size:54px;margin-top:8px}
  #menu.premium-menu-v386 .preview p{font-size:23px}
  #menu.premium-menu-v386 .preview .start{
    min-width:350px;
    font-size:25px;
    padding:17px 28px;
    margin-top:28px;
    border-radius:12px;
  }
  #menu.premium-menu-v386 .preview-benefits{
    margin-top:34px;padding-top:18px;font-size:13px;
  }
  #menu.premium-menu-v386 .actions{
    padding-top:20px;gap:12px;
  }
  #menu.premium-menu-v386 .actions button{
    min-height:70px;
    padding:14px 20px;
    font-size:20px;
  }
  #menu.premium-menu-v386 .actions .action-icon{
    width:38px;height:38px;font-size:19px;
  }
  #menu.premium-menu-v386 .menu-joker img{width:138px;height:138px}

  .menu-discover{
    margin-top:18px;
    padding:15px 18px 18px;
  }
  .discover-head h2{font-size:21px}
  .discover-tile{min-height:150px}

  /* Surrounding decoration positions/sizes closely match the approved mockup. */
  .home-decor-layer .decor-script-top{right:-168px;top:-148px;width:155px;font-size:28px;transform:rotate(-7deg)}
  .home-decor-layer .decor-script-left{left:-175px;top:130px;width:145px;font-size:25px;transform:rotate(-8deg)}
  .decor-plant{left:-220px;top:-155px;width:215px;height:310px}
  .decor-plant .stem{left:103px;top:60px;height:180px}
  .decor-plant .leaf{width:92px;height:39px;filter:saturate(.95)}
  .decor-plant .leaf:nth-child(2){left:22px;top:34px}
  .decor-plant .leaf:nth-child(3){left:104px;top:42px}
  .decor-plant .leaf:nth-child(4){left:7px;top:92px}
  .decor-plant .leaf:nth-child(5){left:112px;top:98px}
  .decor-plant .leaf:nth-child(6){left:23px;top:150px}
  .decor-plant .leaf:nth-child(7){left:104px;top:157px}
  .decor-plant .leaf:nth-child(8){left:54px;top:0;width:85px}
  .decor-plant .pot{left:55px;width:106px;height:83px}

  .decor-book{left:-215px;top:350px;width:172px;height:265px;padding-top:34px}
  .decor-book .book-script{font-size:20px}
  .decor-book img{width:68px;height:68px;left:51px;bottom:29px}

  .decor-coffee{right:-220px;top:92px;width:195px;height:195px}
  .decor-coffee .saucer{inset:8px;background:radial-gradient(circle,#b07b4a 0 57%,#8c572f 58% 61%,#c59669 62% 74%,#7b4928 75%)}
  .decor-coffee .cup{left:42px;top:41px;width:112px;height:112px;background:radial-gradient(circle at 45% 45%,#55250f 0 33%,#7d3e1a 34% 41%,#fdf4e4 42% 72%,#dec7a8 73% 100%)}
  .decor-coffee .cup::before{right:-32px;top:38px;width:44px;height:36px;border-width:11px}
  .decor-coffee .foam{left:67px;top:60px;width:55px;height:40px}

  .decor-deck{right:-220px;top:390px;width:182px;height:250px}
  .decor-deck .decor-card-back{width:118px;height:177px;border-width:5px}
  .decor-deck .decor-card-back::after{font-size:54px}
  .decor-deck .decor-card-back:nth-child(1){left:42px;top:4px}
  .decor-deck .decor-card-back:nth-child(2){left:27px;top:18px}
  .decor-deck .decor-card-back:nth-child(3){left:12px;top:34px}
  .decor-bottom-leaves{right:-190px;top:690px}
}

@media(min-width:1400px) and (max-height:850px){
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header{min-height:110px;padding-top:15px;padding-bottom:20px;margin-bottom:20px}
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header::before{height:145px}
  #menu.premium-menu-v386 .preview{min-height:410px}
  #menu.premium-menu-v386 .games{height:360px}
  #menu.premium-menu-v386 .game{min-height:62px}
  #menu.premium-menu-v386 .actions button{min-height:60px}
  .decor-book{top:315px}.decor-deck{top:350px}.decor-bottom-leaves{display:none}
}

/* v38.22b – use the available wide desktop canvas like the approved reference. */
@media(min-width:1700px) and (min-height:760px){
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header{
    width:min(1680px,calc(100vw - 300px));
  }
  #menu.premium-menu-v386{
    width:min(1660px,calc(100vw - 420px));
  }
  #menu.premium-menu-v386 .layout{
    grid-template-columns:320px minmax(620px,1fr) 285px;
    gap:22px;
    padding:20px 22px 22px;
  }
  #menu.premium-menu-v386 .games{height:430px}
  #menu.premium-menu-v386 .preview{min-height:485px}
  #menu.premium-menu-v386 .actions button{min-height:72px}
  .decor-plant{left:-225px}
  .decor-book{left:-220px}
  .decor-coffee{right:-225px}
  .decor-deck{right:-222px}
  .home-decor-layer .decor-script-top{right:-175px}
  .home-decor-layer .decor-script-left{left:-178px}
}

/* v38.23 – use exact decorative crops from the approved premium reference. */
@media(min-width:1400px) and (min-height:720px){
  body.ludicera-lounge:has(#menu:not([hidden])){
    background:linear-gradient(180deg,#fbf6ec 0%,#f3e9da 62%,#eee0cf 100%);
  }
  /* Real reference crops, so the outer lounge looks like the approved mockup. */
  .decor-plant{
    left:-220px!important;top:-154px!important;width:205px!important;height:300px!important;
    background:url('/assets/decor/plant_ref.png') center/100% 100% no-repeat!important;
    filter:none!important;
  }
  .decor-plant>*{display:none!important}

  .decor-coffee{
    right:-222px!important;top:68px!important;width:222px!important;height:335px!important;
    background:url('/assets/decor/coffee_ref.png') center/100% 100% no-repeat!important;
    filter:none!important;
  }
  .decor-coffee>*{display:none!important}

  .decor-deck{
    right:-242px!important;top:385px!important;width:242px!important;height:335px!important;
    background:url('/assets/decor/deck_ref.png') center/100% 100% no-repeat!important;
    filter:none!important;
  }
  .decor-deck>*{display:none!important}

  .decor-book{
    left:-214px!important;top:320px!important;width:205px!important;height:420px!important;padding:0!important;
    border:0!important;border-radius:0!important;box-shadow:none!important;transform:none!important;
    background:url('/assets/decor/book_ref.png') center/100% 100% no-repeat!important;
    color:#e0b25f!important;text-align:center!important;
  }
  .decor-book::before{
    content:""!important;display:block!important;position:absolute!important;
    left:38px!important;top:153px!important;width:132px!important;height:84px!important;
    border:0!important;border-radius:14px!important;
    background:linear-gradient(100deg,rgba(76,41,25,.98),rgba(101,56,34,.98))!important;
    box-shadow:inset 0 0 0 1px rgba(177,120,72,.22)!important;opacity:1!important;
  }
  .decor-book .book-script{
    position:absolute!important;z-index:3!important;left:40px!important;top:166px!important;width:128px!important;
    color:#e1b354!important;font-family:"Segoe Print","Bradley Hand","Brush Script MT",cursive!important;
    font-size:20px!important;line-height:1.16!important;font-style:italic!important;text-shadow:0 1px 0 #2a160b!important;
  }
  .decor-book img{display:none!important}

  .decor-bottom-leaves-right{
    display:block!important;right:-222px!important;top:700px!important;width:222px!important;height:121px!important;
    background:url('/assets/decor/right_leaves_ref.png') center/100% 100% no-repeat!important;opacity:1!important;
  }
  .decor-bottom-leaves-left{
    display:block!important;left:-220px!important;right:auto!important;top:700px!important;width:220px!important;height:121px!important;
    background:url('/assets/decor/left_leaves_ref.png') center/100% 100% no-repeat!important;opacity:1!important;
  }
  .decor-bottom-leaves>*{display:none!important}

  /* Geometry closer to the reference – central card remains generous but not stretched. */
  #menu.premium-menu-v386{width:min(1380px,calc(100vw - 500px))!important}
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header{width:min(1480px,calc(100vw - 360px))!important}
  #menu.premium-menu-v386 .layout{
    grid-template-columns:285px minmax(560px,1fr) 260px!important;
    gap:18px!important;padding:18px 20px 20px!important;
  }
  #menu.premium-menu-v386 .preview{min-height:465px!important}
  #menu.premium-menu-v386 .games{height:420px!important}
  #menu.premium-menu-v386 .game{min-height:70px!important}
  #menu.premium-menu-v386 .actions button{min-height:68px!important}
}
@media(min-width:1700px) and (min-height:760px){
  #menu.premium-menu-v386{width:min(1380px,calc(100vw - 520px))!important}
  body.ludicera-lounge:has(#menu:not([hidden])) .ludicera-header{width:min(1500px,calc(100vw - 360px))!important}
}

/* Ludicera v38.24: use the approved decor image as the real desktop backdrop. */
@media (min-width:1101px){
  body.ludicera-lounge{
    background-color:#f4eadf!important;
    background-image:url('/assets/decor/lounge-background.png?v=3824')!important;
    background-position:center top!important;
    background-size:cover!important;
    background-repeat:no-repeat!important;
    background-attachment:fixed!important;
  }
  /* The photographic/decorative backdrop replaces the earlier CSS-made decorations. */
  .home-decor-layer{display:none!important}
  /* Keep the real interactive UI readable and make sure the image never acts as UI. */
  .ludicera-header,
  #menu.window,
  .lounge-game .game-header,
  .game-help-card,
  .lounge-game .table-scroll{
    position:relative;
    z-index:2;
  }
  .ludicera-header{
    background:linear-gradient(180deg,rgba(255,253,248,.97),rgba(248,241,231,.95))!important;
  }
  #menu.window{
    background:rgba(255,253,246,.97)!important;
  }
}
@media (max-width:1100px){
  body.ludicera-lounge{
    background-image:none!important;
    background:linear-gradient(180deg,#fbf7ef 0%,#f2eadf 58%,#eee4d7 100%)!important;
  }
}


/* Ludicera v38.25 – render the approved lounge artwork as a real fixed image layer.
   This avoids body-background cascade/caching issues and keeps all real UI interactive above it. */
.ludicera-fixed-backdrop{display:none}
@media (min-width:1101px){
  html{background:#f4eadf}
  body.ludicera-lounge{
    background:linear-gradient(180deg,rgba(251,247,239,.30),rgba(238,228,215,.22))!important;
    position:relative;
    isolation:isolate;
  }
  .ludicera-fixed-backdrop{
    display:block;
    position:fixed;
    inset:0;
    width:100vw;
    height:100vh;
    object-fit:cover;
    object-position:center top;
    pointer-events:none;
    user-select:none;
    z-index:0;
  }
  body.ludicera-lounge > .visitor-badge,
  body.ludicera-lounge > .ludicera-header,
  body.ludicera-lounge > main,
  body.ludicera-lounge > section,
  body.ludicera-lounge > dialog{
    position:relative;
    z-index:2;
  }
  /* Do not paint the old CSS decorations on top of the real backdrop. */
  .home-decor-layer{display:none!important}
}
@media (max-width:1100px){
  .ludicera-fixed-backdrop{display:none!important}
}
