:root{
  --cream:#FFF6E9; --card:#FFFFFF; --ink:#3B2B20; --ink-soft:#6E5A4A;
  --mint:#3ECF8E; --mint-dark:#2AA872; --tomato:#FF5A4E; --sun:#FFC93C;
  --shadow:0 10px 30px rgba(59,43,32,.12); --radius:22px;
}
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:'Nunito',system-ui,sans-serif;background:var(--cream);color:var(--ink);line-height:1.7}
img{max-width:100%;height:auto}

header{position:sticky;top:0;z-index:50;background:rgba(255,246,233,.92);backdrop-filter:blur(8px);border-bottom:2px solid rgba(59,43,32,.06)}
nav{max-width:860px;margin:0 auto;display:flex;align-items:center;gap:16px;padding:12px 20px}
nav a.logo{display:flex;align-items:center;gap:10px;font-family:'Baloo 2',system-ui,sans-serif;font-weight:800;font-size:1.2rem;color:var(--ink);text-decoration:none}
nav img{width:36px;height:36px;border-radius:10px}
nav .back{margin-left:auto;font-weight:700;font-size:.92rem;color:var(--ink-soft);text-decoration:none}
nav .back:hover{color:var(--ink)}
.btn{display:inline-block;background:var(--mint);color:#fff;text-decoration:none;font-weight:800;
     font-family:'Baloo 2',system-ui,sans-serif;padding:8px 18px;border-radius:999px;
     box-shadow:0 6px 0 var(--mint-dark);font-size:.9rem;transition:transform .08s ease}
.btn:active{transform:translateY(4px);box-shadow:0 2px 0 var(--mint-dark)}

main{max-width:860px;margin:34px auto 60px;padding:38px clamp(20px,5vw,48px) 46px;
     background:var(--card);border-radius:var(--radius);box-shadow:var(--shadow)}
h1{font-family:'Baloo 2',system-ui,sans-serif;font-size:clamp(1.6rem,5vw,2.1rem);margin-bottom:6px}
.updated{color:var(--ink-soft);font-size:.9rem;margin-bottom:30px}
h2{font-family:'Baloo 2',system-ui,sans-serif;font-size:1.22rem;margin:30px 0 10px}
p,li{color:var(--ink-soft)}
strong{color:var(--ink)}
ul{padding-left:22px;margin:10px 0}
a{color:var(--mint-dark)}
code{background:var(--cream);border-radius:6px;padding:1px 7px;font-size:.92em}

footer{text-align:center;color:var(--ink-soft);font-size:.85rem;padding:10px 20px 40px}
footer a{margin:0 10px;color:var(--mint-dark)}
footer div{margin-top:8px}

.big-emoji{font-size:3.4rem;line-height:1;margin-bottom:14px}
.center{text-align:center}

@media (max-width:640px){
  main{margin:0 0 34px;border-radius:0;box-shadow:none;padding:30px 18px 40px}
  nav{padding:10px 14px}
  nav .back{display:none}
  nav .btn{margin-left:auto}
}