﻿:root{--text:#efe6d8;--text-dim:#bda9c8;--gold:var(--gold-bright,#E0B040);--sparkle:#E0B0FF;--shadow-deep:0 18px 40px -16px rgba(0,0,0,.7);--frame-grad:linear-gradient(160deg,var(--gold-bright,#F8C000),var(--gold-deep,#C89038));}

/* ===== slot detail bespoke ===== */
.slot-hero{display:grid;grid-template-columns:300px 1fr;gap:34px;align-items:center;padding:30px 0 8px}
@media(max-width:820px){.slot-hero{grid-template-columns:1fr}}
.slot-hero .cover-frame{position:relative;padding:8px;border-radius:20px;
  background:linear-gradient(160deg,rgba(191,238,240,.5),rgba(47,196,214,.15) 30%,rgba(6,40,61,.6) 70%,rgba(22,168,160,.4));
  box-shadow:0 18px 44px -16px rgba(2,16,28,.85),inset 0 1px 0 rgba(255,255,255,.4)}
.slot-hero .cover-frame img{width:100%;aspect-ratio:3/2;object-fit:cover;border-radius:13px;display:block}
.slot-hero .prov-tag{font-family:'Quicksand';font-weight:700;font-size:12px;letter-spacing:1.4px;text-transform:uppercase;color:var(--aqua)}
.slot-hero h1{font-family:'Comfortaa';font-size:40px;color:#fff;line-height:1.05;margin:8px 0 12px}
.slot-hero p{color:var(--foam);font-size:15px;max-width:540px;margin-bottom:18px}
.facts{display:grid;grid-template-columns:repeat(5,1fr);gap:12px;margin:6px 0 0}
@media(max-width:680px){.facts{grid-template-columns:repeat(2,1fr)}}
.fact{padding:16px 14px;text-align:center}
.fact .k{font-family:'Quicksand';font-weight:600;font-size:10.5px;letter-spacing:1px;text-transform:uppercase;color:var(--mute)}
.fact .v{font-family:'Comfortaa';font-weight:700;font-size:19px;color:#fff;margin-top:5px}
.fact .v.gold{color:var(--gold)}
.fact .v.aqua{color:var(--aqua)}

/* THE FRAMED RULES DEVICE вЂ” an ornate ocean porthole/cabinet whose body scrolls */
.rules-wrap{padding:46px 0 10px;display:grid;grid-template-columns:1fr;justify-items:center}
.rules-device{position:relative;width:100%;max-width:760px;
  padding:26px 22px 30px;border-radius:34px;
  background:linear-gradient(165deg,rgba(191,238,240,.42),rgba(47,196,214,.16) 28%,rgba(6,40,61,.7) 68%,rgba(22,168,160,.38));
  box-shadow:0 30px 70px -24px rgba(2,16,28,.9),inset 0 2px 0 rgba(255,255,255,.45),inset 0 0 0 1px rgba(191,238,240,.3)}
.rules-device::before{content:"";position:absolute;inset:12px;border-radius:26px;
  border:2px solid rgba(191,238,240,.4);box-shadow:inset 0 0 26px rgba(6,40,61,.55);pointer-events:none;z-index:3}
/* porthole rivets at the four corners */
.rivet{position:absolute;width:14px;height:14px;border-radius:50%;z-index:4;
  background:radial-gradient(circle at 35% 30%,#eafbfc,#2fc4d6 60%,#0a3d62);
  box-shadow:0 2px 5px rgba(2,16,28,.6),inset 0 1px 1px rgba(255,255,255,.6)}
.rivet.tl{top:20px;left:20px}.rivet.tr{top:20px;right:20px}
.rivet.bl{bottom:24px;left:20px}.rivet.br{bottom:24px;right:20px}
.device-head{display:flex;align-items:center;gap:12px;padding:0 6px 16px;position:relative;z-index:5}
.device-head .lens{width:42px;height:42px;flex:none;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(135deg,rgba(22,168,160,.5),rgba(47,196,214,.25));border:2px solid rgba(191,238,240,.5);
  box-shadow:inset 0 0 14px rgba(6,40,61,.6),0 0 18px rgba(47,196,214,.3)}
.device-head h2{font-family:'Comfortaa';font-size:21px;color:#fff}
.device-head .sub{font-family:'Quicksand';font-weight:600;font-size:11.5px;letter-spacing:1px;text-transform:uppercase;color:var(--aqua)}
/* the glass pane the rules scroll behind */
.rules-screen{position:relative;z-index:5;height:480px;overflow-y:auto;border-radius:20px;
  padding:20px 22px;background:linear-gradient(180deg,rgba(4,32,47,.78),rgba(6,40,61,.62));
  border:1px solid rgba(191,238,240,.25);box-shadow:inset 0 14px 22px -14px rgba(2,16,28,.9),inset 0 -14px 22px -14px rgba(2,16,28,.9)}
.rules-screen::-webkit-scrollbar{width:10px}
.rules-screen::-webkit-scrollbar-track{background:rgba(6,40,61,.5);border-radius:10px}
.rules-screen::-webkit-scrollbar-thumb{background:linear-gradient(180deg,var(--aqua),var(--teal));border-radius:10px;border:2px solid rgba(6,40,61,.5)}
.rules-screen h3{font-family:'Comfortaa';font-size:17px;color:var(--aqua);margin:22px 0 9px;
  display:flex;align-items:center;gap:9px}
.rules-screen h3:first-child{margin-top:0}
.rules-screen h3 .b{width:7px;height:7px;border-radius:50%;background:var(--gold);box-shadow:0 0 10px var(--gold)}
.rules-screen p{color:var(--pearl);font-size:14.5px;line-height:1.7;margin-bottom:10px}
.gloss{display:flex;flex-direction:column;gap:8px;margin:6px 0 4px}
.gloss .row{display:grid;grid-template-columns:120px 1fr;gap:12px;padding:11px 13px;border-radius:12px;
  background:rgba(191,238,240,.06);border:1px solid rgba(191,238,240,.14)}
.gloss .term{font-family:'Comfortaa';font-weight:700;font-size:13.5px;color:var(--foam)}
.gloss .def{font-size:13.5px;color:var(--pearl);line-height:1.55}
.tip-list{list-style:none;display:flex;flex-direction:column;gap:9px;margin:4px 0}
.tip-list li{display:flex;gap:11px;font-size:14px;color:var(--pearl);line-height:1.6}
.tip-list li svg{flex:none;margin-top:3px}
.resp-note{margin-top:6px;padding:14px 16px;border-radius:13px;border:1px solid rgba(255,111,97,.4);
  background:rgba(255,111,97,.08);color:var(--foam);font-size:13.5px;line-height:1.6;display:flex;gap:12px;align-items:flex-start}
.resp-note .age{width:38px;height:38px;flex:none;border-radius:50%;border:2px solid var(--coral);color:var(--coral);
  display:grid;place-items:center;font-family:'Comfortaa';font-weight:700;font-size:12px}

/* ===== related slots row ===== */
.related{padding:44px 0 6px}
.rel-grid{display:grid;grid-template-columns:repeat(8,1fr);gap:12px}
@media(max-width:980px){.rel-grid{grid-template-columns:repeat(4,1fr)}}
@media(max-width:560px){.rel-grid{grid-template-columns:repeat(2,1fr)}}
.rel-card{display:block;position:relative;border-radius:14px;overflow:hidden;
  border:1px solid var(--glass-bd);box-shadow:0 12px 28px -14px rgba(2,16,28,.8);
  transition:transform .25s var(--ease),box-shadow .25s var(--ease)}
.rel-card:hover{transform:translateY(-6px);box-shadow:0 18px 36px -14px rgba(2,16,28,.9),0 0 24px rgba(47,196,214,.4)}
.rel-card img{display:block;width:100%;aspect-ratio:3/2;object-fit:cover;object-position:center}
.rel-card .rel-name{position:absolute;left:0;right:0;bottom:0;z-index:2;padding:18px 10px 9px;
  font-family:'Comfortaa';font-weight:600;font-size:11.5px;color:#fff;line-height:1.2;
  text-shadow:0 2px 8px rgba(0,0,0,.7);
  background:linear-gradient(180deg,transparent,rgba(4,32,47,.9))}

/* ===== where to play CTA ===== */
.wtp{margin:40px 0 6px;padding:30px 32px;display:flex;align-items:center;justify-content:space-between;
  gap:24px;flex-wrap:wrap}
.wtp .wtp-txt h2{font-family:'Comfortaa';font-size:24px;color:#fff;margin-bottom:6px}
.wtp .wtp-txt p{color:var(--foam);font-size:14px;max-width:520px}
.wtp .wtp-cta{display:flex;gap:12px;flex-wrap:wrap}

.review{max-width:920px;margin:38px auto 0;}
.review h2{font-family:'Cinzel',serif;color:var(--gold-bright);font-size:1.4rem;margin:24px 0 8px;text-shadow:0 1px 0 var(--gold-deep,#5a3a00);}
.review p{color:var(--text);line-height:1.75;margin:0 0 12px;font-size:.98rem;}
.tagsec{max-width:920px;margin:34px auto 0;}
.tagsec .lbl{font-family:'Marcellus',serif;color:var(--gold-deep);font-size:.74rem;letter-spacing:2px;text-transform:uppercase;margin:14px 0 8px;display:block;}
.tagcloud{display:flex;flex-wrap:wrap;gap:9px;}
.tagpill{padding:7px 14px;border-radius:24px;background:rgba(var(--surf-rgb,80,16,112),.4);border:1px solid rgba(var(--gold-rgb,248,192,0),.28);font-family:'Marcellus',serif;font-size:.82rem;color:var(--gold-bright);}
.tagpill:hover{background:rgba(var(--surf-rgb,80,16,112),.78);}.tagpill.nolink{opacity:.6;}
.cocoon{margin:42px 0 0;}
.cocoon .section-h{font-family:'Cinzel',serif;color:var(--gold-bright);font-size:1.3rem;margin:0 0 14px;display:flex;justify-content:space-between;align-items:center;}
.cocoon .section-h a{font-size:.8rem;color:var(--gold-deep);}
.recs{max-width:920px;margin:42px auto 0;}
.recs h2{font-family:'Cinzel',serif;color:var(--gold-bright);font-size:1.4rem;margin:0 0 14px;}
.rec-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:14px;}
.rec-card{display:block;padding:16px 18px;border-radius:14px;background:rgba(var(--surf-rgb,80,16,112),.3);border:1px solid rgba(var(--gold-rgb,248,192,0),.22);}
.rec-card:hover{background:rgba(var(--surf-rgb,80,16,112),.6);}
.rec-card .k{font-family:'Marcellus',serif;color:var(--gold-deep);font-size:.68rem;letter-spacing:1.5px;text-transform:uppercase;}
.rec-card .t{display:block;color:var(--gold-bright);font-size:.96rem;margin-top:6px;line-height:1.4;}
.faq{max-width:920px;margin:34px auto 0;}.faq h2{font-family:'Cinzel',serif;color:var(--gold-bright);font-size:1.4rem;margin:0 0 12px;}
.faq details{background:rgba(var(--surf-rgb,80,16,112),.22);border:1px solid rgba(var(--gold-rgb,248,192,0),.2);border-radius:12px;padding:12px 16px;margin:0 0 10px;}
.faq summary{font-family:'Marcellus',serif;color:var(--gold-bright);cursor:pointer;}.faq p{color:var(--text-dim);margin:8px 0 0;line-height:1.6;font-size:.92rem;}
@media(max-width:820px){.rec-grid{grid-template-columns:1fr;}}
/* per-site slot-page layout variants (combinatorics вЂ” blocks differ BETWEEN sites) */
.slot-hero.stack{display:block;}.slot-hero.stack .slot-cover{max-width:440px;margin:0 auto 20px;}
.facts.grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:12px;}
.rules-section.flat .rules-arch{background:none!important;border:0!important;box-shadow:none!important;padding:0!important;}
.rules-section.flat .rules-inner{background:linear-gradient(160deg,rgba(40,10,60,.34),rgba(18,4,32,.34));border:1px solid var(--gold-deep);border-radius:18px;padding:26px 24px;}
/* StarSlots-style real tag cloud (actions + on-page TOC + collection cross-links) top-right of hero */
.slot-tags{display:flex;flex-wrap:wrap;gap:7px;margin-top:18px;max-width:580px;}
.slot-tags .stag{font-size:.76rem;line-height:1.2;padding:6px 11px;border-radius:14px;background:rgba(var(--surf-rgb,80,16,112),.30);border:1px solid rgba(var(--gold-rgb,248,192,0),.26);color:var(--gold-bright,#F8C000);text-decoration:none;}
.slot-tags .stag:hover{background:rgba(var(--surf-rgb,80,16,112),.62);border-color:var(--gold-main,#F8C000);}
/* MOBILE: stop the slot cover from collapsing to content width вЂ” make it a proper large image */
@media(max-width:760px){
  .slot-hero{grid-template-columns:1fr !important;}
  .slot-cover{width:min(88vw,340px) !important;max-width:340px !important;margin:0 auto 6px !important;}
  .slot-hero.stack .slot-cover{width:min(88vw,360px) !important;max-width:360px !important;}
}
/* F30: keep TOC-anchored targets clear of any sticky header when jumped to (scroll-margin-top) */
#description,#rules,#wtp,.review section[id^="sec-"]{scroll-margin-top:90px;}
@media(max-width:760px){#description,#rules,#wtp,.review section[id^="sec-"]{scroll-margin-top:74px;}}
/* ============ F30 TEXT-BLOCK LAYOUTS (per-site; description != rules; compact, no lost content) ============ */
/* DESCRIPTION layouts (.review.dl0..dl3) вЂ” dense, varied look, full content preserved */
.review.dl0 section{margin:0 0 10px;}
.review.dl0 h2{margin:18px 0 6px;font-size:1.28rem;}
.review.dl0 p{line-height:1.6;margin:0 0 8px;font-size:.95rem;}
/* dl1 вЂ” compact zig-zag: tight stacked sections with alternating subtle tint (NO multicol so
   the #sec-N TOC anchors stay scroll-targetable; multicol children can't be scrolled to in Chromium) */
.review.dl1 section{margin:0 0 11px;padding:10px 0;}
.review.dl1 section:nth-child(even){background:rgba(var(--surf-rgb,80,16,112),.10);border-radius:12px;padding:12px 16px;}
.review.dl1 h2{margin:0 0 5px;font-size:1.18rem;}
.review.dl1 p{line-height:1.55;margin:0 0 7px;font-size:.93rem;}
.review.dl1 p:last-child{margin-bottom:0;}
/* dl2 вЂ” left gold rule, tight stacked sections */
.review.dl2 section{margin:0 0 12px;padding-left:14px;border-left:3px solid var(--gold-deep,#C89038);}
.review.dl2 h2{margin:0 0 5px;font-size:1.2rem;}
.review.dl2 p{line-height:1.55;margin:0 0 6px;font-size:.93rem;}
/* dl3 вЂ” boxed cards, compact grid on desktop */
.review.dl3{display:grid;gap:14px;}
@media(min-width:900px){.review.dl3{grid-template-columns:1fr 1fr;}.review.dl3 section:first-child{grid-column:1/-1;}}
.review.dl3 section{margin:0;background:rgba(var(--surf-rgb,80,16,112),.16);border:1px solid rgba(var(--gold-rgb,248,192,0),.18);border-radius:14px;padding:14px 18px;}
.review.dl3 h2{margin:0 0 6px;font-size:1.14rem;}
.review.dl3 p{line-height:1.55;margin:0 0 7px;font-size:.92rem;}
/* RULES layouts (.rules-section.rl0..rl3) вЂ” deliberately DIFFERENT from description; compact */
.rules-section.rl0 .rule-block{margin:0 0 10px;}
.rules-section.rl0 .tips-list{margin:4px 0 0;padding-left:18px;line-height:1.5;}
.rules-section.rl0 .tips-list li{margin:0 0 4px;font-size:.91rem;}
/* rl1 вЂ” two-column rule blocks (dense), single col mobile */
@media(min-width:900px){.rules-section.rl1 .rules-scroll{column-count:2;column-gap:30px;}.rules-section.rl1 .rule-block{break-inside:avoid;display:inline-block;width:100%;}}
.rules-section.rl1 .rule-block{margin:0 0 12px;}
.rules-section.rl1 .rule-block h3{font-size:1rem;margin:0 0 5px;}
.rules-section.rl1 .tips-list{margin:3px 0 0;padding-left:17px;line-height:1.45;}
.rules-section.rl1 .tips-list li{margin:0 0 3px;font-size:.88rem;}
/* rl2 вЂ” compact accordion-ish flat rows */
.rules-section.rl2 .rule-block{margin:0 0 8px;padding:10px 14px;background:rgba(40,10,60,.3);border:1px solid rgba(var(--gold-rgb,248,192,0),.16);border-radius:10px;}
.rules-section.rl2 .rule-block h3{font-size:.98rem;margin:0 0 4px;}
.rules-section.rl2 .tips-list{margin:0;padding-left:16px;line-height:1.45;}
.rules-section.rl2 .tips-list li{margin:0 0 3px;font-size:.88rem;}
/* rl3 вЂ” numbered tight list, gem markers, minimal vertical space */
.rules-section.rl3 .rule-block{margin:0 0 9px;}
.rules-section.rl3 .rule-block h3{font-size:1rem;margin:0 0 4px;}
.rules-section.rl3 .tips-list{margin:2px 0 0;padding-left:18px;line-height:1.42;list-style:disc;}
.rules-section.rl3 .tips-list li{margin:0 0 3px;font-size:.89rem;}
.rules-section.rl3 .cr-links{display:flex;flex-wrap:wrap;gap:4px;}
/* combinatorics off-home blocks dropped onto the slot page: neutralise full-bleed padding/bg so they
   sit cleanly inside .wrap (no double gutters, no overflow) while keeping the variant's grid/cards */
.combo-slotpage,.cocoon{margin:34px 0 0;}
.combo-slotpage>section,.cocoon>section{padding:0!important;background:none!important;width:100%;}
/* cocoon tile()-grid fallback (variants lacking class="tile"): match the page's sibling-grid look */
.cocoon .section-h{font-family:'Cinzel',serif;color:var(--gold-bright);font-size:1.3rem;}
.cocoon .section-h a{font-size:.8rem;color:var(--gold-deep);margin-left:8px;}
@media(max-width:900px){.rules-section.rl1 .rules-scroll{column-count:1;}.review.dl3{grid-template-columns:1fr;}}


/* === visual-judge mobile-overflow fixes (2026-07-10) === */
@media(max-width:680px){
  .facts>*{min-width:0}
  .fact{min-width:0;overflow:hidden}
  .pt-sec{overflow-x:auto;-webkit-overflow-scrolling:touch}
  table.pay{min-width:0}
}
