:root{
  --ink:#2b2320; --soft:#6b5e54; --paper:#fff;
  --bg:#fff7ec; --card:#ffffff; --line:#f0ddc2;
  --btc:#f7931a; --btc-dark:#c9741a; --good:#3b9a57; --bad:#d8503a;
  --blue:#2f7fd6;
}
*{box-sizing:border-box}
body{
  margin:0; background:var(--bg); color:var(--ink);
  font:20px/1.6 "Nunito",-apple-system,Segoe UI,Arial,sans-serif;
}
.wrap{max-width:820px; margin:0 auto; padding:18px 18px 70px}
header.top{
  background:linear-gradient(180deg,#ffb347,#f7931a);
  color:#fff; text-align:center; padding:22px 16px; border-bottom:6px solid #c9741a;
}
header.top .big{font:800 30px/1.05 "Baloo 2","Nunito",sans-serif; letter-spacing:.5px}
header.top .sub{font-weight:700; opacity:.95; margin-top:4px; font-size:16px}
header.top .coin{font-size:40px; line-height:1}
h1.lesson{font:800 30px/1.1 "Baloo 2",sans-serif; color:var(--btc-dark); margin:.3em 0 .1em}
.lnum{display:inline-block; background:var(--btc); color:#fff; font:800 15px/1 "Baloo 2",sans-serif;
  padding:7px 12px; border-radius:999px; letter-spacing:.5px}
h2{font:800 23px/1.2 "Baloo 2",sans-serif; color:#8a5a12; margin:1.1em 0 .3em}
p{margin:.5em 0}
.visual{background:#fffdf8; border:3px solid var(--line); border-radius:18px; padding:14px; margin:18px 0; text-align:center}
.visual svg{max-width:100%; height:auto}
.visual .cap{font-weight:700; color:var(--soft); font-size:15px; margin-top:6px}
.callout{border-radius:16px; padding:14px 16px; margin:16px 0; font-weight:600}
.like{background:#eef6ff; border:2px solid #cfe3fb}
.like b{color:var(--blue)}
.remember{background:#fff2d9; border:2px solid #ffd98a}
.remember b{color:var(--btc-dark)}
.warn{background:#ffece7; border:2px solid #ffc0b2}
.warn b{color:var(--bad)}
.tiles{display:grid; grid-template-columns:repeat(auto-fill,minmax(230px,1fr)); gap:14px; margin-top:18px}
.tile{display:block; text-decoration:none; color:inherit; background:var(--card);
  border:3px solid var(--line); border-radius:18px; padding:16px; transition:transform .1s,border-color .15s}
.tile:hover{transform:translateY(-3px); border-color:var(--btc)}
.tile .n{font:800 14px/1 "Baloo 2",sans-serif; color:#fff; background:var(--btc);
  display:inline-block; padding:6px 11px; border-radius:999px}
.tile .t{font:800 20px/1.15 "Baloo 2",sans-serif; color:var(--btc-dark); margin:10px 0 4px}
.tile .d{color:var(--soft); font-size:16px; font-weight:600}
.nav{display:flex; justify-content:space-between; gap:10px; margin-top:34px}
.nav a{flex:1; text-align:center; text-decoration:none; font:800 17px/1 "Baloo 2",sans-serif;
  padding:14px 10px; border-radius:14px; background:var(--btc); color:#fff; border:0}
.nav a.ghost{background:#fff; color:var(--btc-dark); border:3px solid var(--btc)}
.nav a.dim{background:#eee; color:#aaa; pointer-events:none}
.foot{text-align:center; color:var(--soft); font-weight:700; font-size:14px; margin-top:30px}
ul.big{padding-left:1.1em}
ul.big li{margin:.35em 0}
.try{background:#eafaef; border:2px solid #b9e6c6; border-radius:16px; padding:14px 16px; margin:16px 0; font-weight:600}
.try b{color:var(--good)}