*{box-sizing:border-box;margin:0;padding:0;-webkit-tap-highlight-color:transparent}
  html,body{height:100%}
  body{background:#fff;overflow-x:hidden;overscroll-behavior-y:none}
  #gameSec{position:relative;height:100svh}
  canvas{position:absolute;inset:0;width:100%;height:100%;display:block;cursor:pointer;touch-action:pan-y}
  #scrollCue{
    position:absolute;left:50%;bottom:8px;transform:translateX(-50%);
    font-family:'Patrick Hand',cursive;color:#c9c9c9;font-size:15px;
    pointer-events:none;white-space:nowrap;
  }
  #nav{
    position:absolute;top:8px;left:50%;transform:translateX(-50%);z-index:5;
    display:flex;flex-wrap:wrap;align-items:center;justify-content:center;gap:7px;
    font-family:'Patrick Hand','Comic Sans MS',cursive;max-width:96vw;
  }
  #brand{
    font-family:'Permanent Marker','Patrick Hand',cursive;font-size:17px;color:#1b1b1b;
    padding:4px 10px;background:#fff;border:2px solid #1b1b1b;border-radius:9px;
    box-shadow:2px 2px 0 rgba(27,27,27,.85);white-space:nowrap;user-select:none;
  }
  .nv,.ca{
    font-size:14px;color:#1b1b1b;background:#fff;border:2px solid #1b1b1b;border-radius:9px;
    padding:4px 11px;cursor:pointer;box-shadow:2px 2px 0 rgba(27,27,27,.85);
    user-select:none;white-space:nowrap;text-decoration:none;display:inline-block;
  }
  .nv:active,.ca:active{transform:translate(2px,2px);box-shadow:0 0 0 rgba(27,27,27,.85)}
  .nv.x{font-weight:900}
  .nv.tg{color:#2472a4}
  .nv.buy{background:#1f9d55;color:#fff;font-weight:900;letter-spacing:.4px}
  .nv.mute{font-size:15px;line-height:1;padding:5px 9px;font-family:inherit}
  .buyBtn{
    display:inline-block;margin-top:4px;padding:11px 26px;
    font-family:'Permanent Marker',cursive;font-size:21px;
    color:#fff;background:#1f9d55;text-decoration:none;
    border:2px solid #1b1b1b;border-radius:11px;
    box-shadow:4px 4px 0 rgba(27,27,27,.85);
  }
  .buyBtn:active{transform:translate(4px,4px);box-shadow:0 0 0 rgba(27,27,27,.85)}
  .ca.main b{color:#c0392b}
  .ca b{color:#c0392b}
  .ca .s{color:#666}
  #chartWrap,.chartBox{
    width:min(680px,93vw);height:min(300px,42vh);margin:8px auto 0;
    background:#fff;border:2px solid #1b1b1b;border-radius:12px;
    box-shadow:3px 3px 0 rgba(27,27,27,.85);overflow:hidden;
  }
  #chartWrap iframe,.chartBox iframe{width:100%;height:100%;border:0}
  .chartLbl{
    font-family:'Permanent Marker',cursive;font-size:19px;color:#1b1b1b;
    margin:26px 0 0;
  }
  .chartLbl b{color:#c0392b}
  #landing{
    font-family:'Patrick Hand','Comic Sans MS',cursive;color:#1b1b1b;
    text-align:center;padding:38px 16px 52px;max-width:760px;margin:0 auto;
  }
  #landing .tick{font-family:'Permanent Marker',cursive;color:#c0392b;font-size:22px}
  #landing .title{font-family:'Permanent Marker',cursive;font-size:46px;line-height:1.1;margin:2px 0 8px}
  #landing h2{font-family:'Permanent Marker',cursive;color:#c0392b;font-size:24px;margin:34px 0 10px}
  #landing p{color:#666;font-size:18px;line-height:1.55}
  #landing .lite{color:#b5b5b5;font-size:15px}
  #landing a{color:#2472a4}
  .fam{
    background:#fff;border:2px solid #1b1b1b;border-radius:12px;
    box-shadow:3px 3px 0 rgba(27,27,27,.85);
    padding:14px 16px 16px;margin:14px auto;max-width:560px;
  }
  .fam>b{color:#c0392b;font-size:20px}
  .fam p{margin:4px 0 10px}
  #chartPh{
    width:100%;height:100%;display:flex;align-items:center;justify-content:center;
    font-family:'Patrick Hand',cursive;color:#b5b5b5;font-size:17px;text-align:center;padding:10px;
  }

  .nv .sm{display:none}

  /* ---------- phones ---------- */
  @media (max-width:640px){
    /* the nav was eating four rows of a phone screen. Short labels, and the
       two sibling coins drop out — they get a full card each in the lore below. */
    .nv .lg{display:none}
    .nv .sm{display:inline}
    #nav .js-ca-wojak,#nav .js-ca-plumber{display:none}
    #nav{gap:5px;top:6px;max-width:99vw}
    #brand{font-size:14px;padding:3px 8px}
    .nv,.ca{font-size:12px;padding:4px 8px;border-radius:8px;box-shadow:2px 2px 0 rgba(27,27,27,.85)}
    .nv.mute{font-size:13px;padding:4px 7px}
    #scrollCue{font-size:13px;bottom:6px}
    #landing{padding:26px 14px 40px}
    #landing .title{font-size:34px}
    #landing .tick{font-size:18px}
    #landing h2{font-size:20px;margin:26px 0 8px}
    #landing p{font-size:16px}
    #landing .lite{font-size:14px}
    .fam{padding:12px 12px 14px;margin:12px auto}
    .fam>b{font-size:18px}
    .chartLbl{font-size:16px;margin:20px 0 0}
    #chartWrap,.chartBox{height:min(260px,38vh)}
    /* keep every tappable thing at a real thumb size */
    .buyBtn{font-size:19px;padding:13px 22px;min-height:48px}
  }
  @media (max-width:380px){
    #brand{display:none}
    .nv,.ca{font-size:11px;padding:3px 7px}
    #landing .title{font-size:29px}
  }