/* Slime Grove pages: the game's soft-jelly palette (cream paper, warm brown ink, serif titles, peach primary, pastel slimes). */
body.sg{--cream:#fbf7ee;--surface:#fffdf8;--sunk:#f3ecdd;--ink:#4a3b38;--ink-2:#76675f;--peach:#fbb98c;--peach-deep:#e6824b;--peach-ink:#4a2a18;--mint:#cfeedf;--mint-ink:#2c6a53;--lip:#e0d3bd;--edge:#f1e8d6;
--serif:'Iowan Old Style','Palatino Linotype',Palatino,Georgia,serif;--sans:system-ui,-apple-system,'Segoe UI',Roboto,sans-serif;
background:var(--cream);color:var(--ink);font:17px/1.6 var(--sans);animation:none}
.sg .site-header{background:#fbf7eee6;border-bottom:1px solid var(--edge);margin:0;padding:0 max(24px,calc((100% - 1180px)/2));width:100%;position:relative;z-index:3}
.sg .site-footer{background:var(--surface);border-top:1px solid var(--edge);margin:0;padding-inline:max(24px,calc((100% - 1180px)/2));width:100%}
.sg .wordmark,.sg .nav a,.sg .footer-links a{color:var(--ink)}
.sg .copyright{color:var(--ink-2)}
.sg .wrap{width:min(1180px,100% - 32px);margin-inline:auto}
.sg h1,.sg h2,.sg h3{font-family:var(--serif);font-weight:600;letter-spacing:-.01em;color:var(--ink)}
.sg a:focus-visible,.sg button:focus-visible{outline:3px solid var(--peach-deep);outline-offset:3px;border-radius:12px}

.sg-hero{padding:clamp(40px,7vw,96px) 0 clamp(24px,4vw,48px);background:radial-gradient(120% 90% at 50% 0,#fffdf8,var(--cream) 60%)}
.sg-hero .wrap{display:grid;grid-template-columns:1fr 1.1fr;gap:clamp(24px,5vw,64px);align-items:center}
.sg-kicker{font-size:13px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;color:var(--mint-ink);margin:0 0 12px}
.sg-hero h1{font-size:clamp(52px,8.5vw,112px);line-height:.95;margin:0 0 20px}
.sg-lead{font-size:clamp(19px,2vw,23px);line-height:1.45;color:var(--ink-2);max-width:32ch;margin:0 0 28px}
.sg-cta{display:flex;flex-wrap:wrap;gap:12px 20px;align-items:center}
.sg-btn{display:inline-flex;align-items:center;gap:10px;background:var(--peach);color:var(--peach-ink);border-radius:999px;font-weight:700;font-size:18px;padding:14px 28px;text-decoration:none;box-shadow:inset 0 1px 0 #fff,0 3px 0 #dccfb7,0 10px 22px #8a6f4a26;transition:transform .15s,background .15s}
.sg-btn:hover{background:#fcc49d;transform:translateY(-1px)}.sg-btn:active{transform:translateY(2px);box-shadow:inset 0 1px 0 #fff,0 1px 0 #dccfb7}
.sg-link{font-weight:700;color:var(--mint-ink);text-decoration:underline;text-decoration-thickness:2px;text-underline-offset:4px}
.sg-link:hover{color:var(--ink)}
.sg-soon{display:block;margin-top:16px;color:var(--ink-2);font-size:15px}
.sg-hero figure{margin:0}.sg-hero figure img{display:block;width:100%;height:auto;border-radius:32px;box-shadow:0 0 0 1px var(--edge),0 18px 40px #8a6f4a1f}

.sg-section{padding:clamp(56px,8vw,104px) 0}
.sg-section h2{font-size:clamp(34px,4.6vw,56px);line-height:1.05;margin:0 0 16px}
.sg-section p{color:var(--ink-2);line-height:1.6}
.sg-card{background:var(--surface);border-radius:28px;box-shadow:0 0 0 1px var(--edge),0 4px 0 var(--lip),0 14px 30px #8a6f4a17}

.sg-play{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:clamp(28px,6vw,88px);align-items:center}
.sg-rules{list-style:none;margin:26px 0 0;padding:0;display:grid;gap:12px}
.sg-rules li{display:flex;gap:16px;align-items:flex-start;padding:16px 18px}
.sg-rules b{flex:none;width:44px;height:44px;border-radius:15px;display:grid;place-items:center;font:600 22px var(--serif);color:var(--ink);box-shadow:inset 0 2px 0 #ffffffa6,0 3px 0 #0000001a}
.sg-rules li:nth-child(1) b{background:#fbb98c}.sg-rules li:nth-child(2) b{background:#95c8f1}.sg-rules li:nth-child(3) b{background:#c7b1ef}.sg-rules li:nth-child(4) b{background:#f5adc1}
.sg-rules strong{display:block;font:600 19px/1.3 var(--serif);margin-bottom:2px}.sg-rules span{color:var(--ink-2);font-size:16px;line-height:1.5}

.sg-phone{width:min(100%,390px);border-radius:46px;padding:10px;background:var(--sunk);box-shadow:0 0 0 6px var(--surface),0 10px 0 6px var(--lip),0 24px 40px #8a6f4a2e}
.sg-phone-screen{position:relative;aspect-ratio:390/760;border-radius:36px;overflow:hidden;background:var(--cream)}
.sg-phone iframe{position:absolute;inset:0;width:100%;height:100%;border:0;background:var(--cream)}
.sg-launch{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:18px;padding:26px;border:0;background:radial-gradient(90% 60% at 50% 30%,#fffdf8,var(--cream));cursor:pointer;font:inherit;color:var(--ink)}
.sg-launch img{width:96%;height:auto}
.sg-launch span{font:600 21px var(--serif)}
.sg-launch .sg-btn{pointer-events:none;font:700 18px var(--sans)}
.sg-open{display:block;text-align:center;margin-top:24px;font-size:15px}

.sg-example{display:grid;grid-template-columns:auto 1fr;gap:clamp(28px,6vw,72px);align-items:center;padding:clamp(24px,4vw,52px)}
.sg-board{width:min(100%,320px)}.sg-board img{display:block;width:100%;height:auto}
.sg-note{font-size:14px!important;margin:12px 0 0}
.sg-features{display:grid;grid-template-columns:repeat(3,1fr);gap:16px;margin-top:28px}
.sg-features .sg-card{padding:22px 24px}
.sg-features h3{font-size:22px;margin:0 0 6px}.sg-features p{margin:0;font-size:16px}
.sg-facts{display:grid;grid-template-columns:repeat(4,1fr);gap:14px;margin:36px 0 0}
.sg-facts div{padding:18px 20px;border-radius:22px;background:var(--sunk)}
.sg-facts dt{font-size:12px;font-weight:700;letter-spacing:.12em;text-transform:uppercase;color:var(--mint-ink);margin-bottom:4px}
.sg-facts dd{margin:0;font:600 19px/1.3 var(--serif)}
.sg-langs{margin-top:20px;font-size:15px}

.sg-end{text-align:center;background:linear-gradient(var(--cream),var(--sunk))}
.sg-end p{max-width:46ch;margin:0 auto 24px}.sg-end .sg-cta{justify-content:center}
.sg-end img{display:block;width:min(100%,760px);height:auto;margin:36px auto 0}
.sg-end-links{display:flex;gap:24px;justify-content:center;flex-wrap:wrap;margin-top:28px}

/* Content pages (how it is built) on the game palette. */
.sg .content-page{padding-top:clamp(40px,6vw,80px)}
.sg .back{color:var(--mint-ink)}
.sg .eyebrow,.sg .small-label,.sg .principle-number{color:var(--mint-ink)}
.sg .lead,.sg .about-copy p,.sg .detail-grid p,.sg .game-body p{color:var(--ink-2)}
.sg .rule{border-color:var(--edge)}
.sg .inline-link{color:var(--ink)}

@media(max-width:860px){.sg-hero .wrap,.sg-play,.sg-example{grid-template-columns:1fr}.sg-play>div:last-child{justify-self:center;width:100%;max-width:390px}.sg-features,.sg-facts{grid-template-columns:1fr 1fr}.sg-example .sg-board{justify-self:center}.sg .site-header,.sg .site-footer{padding-inline:16px}}
@media(max-width:520px){.sg-features,.sg-facts{grid-template-columns:1fr}.sg-btn{font-size:17px;padding:13px 22px}.sg-rules li{padding:14px}}
@media(prefers-reduced-motion:reduce){.sg-btn{transition:none}}
