/* Conta Cu Mi — app styles (scoped under #ccm-root) */
#ccm-root{
  --sea:#0FA3B1; --sea-deep:#0B3954; --sand:#FFF6E5; --coral:#FF6F59;
  --sun:#FFD23F; --leaf:#3DBE7B; --pink:#FB7BA2; --ink:#143A4A; --shadow:#0B395422;
  font-family:'Nunito',system-ui,sans-serif; color:var(--ink); background:var(--sand);
  min-height:100vh; line-height:1.4;
}
#ccm-root *{box-sizing:border-box; -webkit-tap-highlight-color:transparent;}
#ccm-root h1,#ccm-root h2,#ccm-root h3{font-family:'Fredoka',sans-serif; margin:0;}
#ccm-root .i{display:inline-block; vertical-align:middle;}
#ccm-root .ccm-hidden{display:none !important;}

#ccm-root .ccm-app{max-width:520px; margin:0 auto; min-height:100vh; display:flex; flex-direction:column;}

#ccm-root .ccm-header{display:flex; align-items:center; justify-content:space-between; padding:12px 16px 6px;}
#ccm-root .ccm-logo{display:flex; align-items:center; gap:9px;}
#ccm-root .ccm-mark{width:44px;height:44px;border-radius:14px;background:var(--sea);display:grid;place-items:center;box-shadow:0 4px 0 var(--sea-deep);}
#ccm-root .ccm-logo h1{font-size:20px;color:var(--sea-deep);}
#ccm-root .ccm-logo small{display:block;font-size:10.5px;font-weight:800;color:var(--sea);letter-spacing:1.2px;text-transform:uppercase;}
#ccm-root .ccm-pill{background:var(--sun);border-radius:999px;padding:6px 12px;font-weight:800;font-size:14px;box-shadow:0 3px 0 #D9A800;display:flex;align-items:center;gap:5px;color:var(--sea-deep);}

#ccm-root .ccm-mascot{display:flex;gap:10px;align-items:flex-start;padding:4px 16px 0;}
#ccm-root .ccm-bird{animation:ccm-bob 3.2s ease-in-out infinite;}
@keyframes ccm-bob{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}
#ccm-root .ccm-blink{animation:ccm-blink 4.5s infinite;}
@keyframes ccm-blink{0%,93%,100%{transform:scaleY(1)}95%,97%{transform:scaleY(.06)}}
@media (prefers-reduced-motion:reduce){
  #ccm-root .ccm-bird,#ccm-root .ccm-blink,#ccm-root .cur-ring{animation:none !important;}
}
#ccm-root .ccm-bubble{background:#fff;border-radius:16px 16px 16px 4px;padding:9px 13px;font-weight:700;font-size:14px;box-shadow:0 4px 0 var(--shadow);flex:1;}
#ccm-root .ccm-bubble em{color:var(--coral);font-style:normal;}

#ccm-root main{flex:1;padding:10px 16px 92px;}
#ccm-root main.flush{padding:0 0 92px;}

#ccm-root .card{background:#fff;border-radius:20px;padding:16px;box-shadow:0 5px 0 var(--shadow);margin:0 0 14px;}
#ccm-root .btn{font-family:'Fredoka',sans-serif;font-weight:600;font-size:17px;border:none;border-radius:16px;padding:13px 18px;cursor:pointer;color:#fff;background:var(--sea);box-shadow:0 5px 0 #0A7B86;transition:transform .06s,box-shadow .06s;width:100%;line-height:1.2;}
#ccm-root .btn:active{transform:translateY(4px);box-shadow:0 1px 0 #0A7B86;}
#ccm-root .btn.coral{background:var(--coral);box-shadow:0 5px 0 #C24533;}
#ccm-root .btn.coral:active{box-shadow:0 1px 0 #C24533;}
#ccm-root .btn.sun{background:var(--sun);color:var(--sea-deep);box-shadow:0 5px 0 #D9A800;}
#ccm-root .btn.ghost{background:#EAF6F7;color:var(--sea-deep);box-shadow:0 5px 0 #C8E4E7;}
#ccm-root .btn:focus-visible{outline:3px solid var(--sea-deep);outline-offset:2px;}
#ccm-root .eyebrow{font-size:11px;font-weight:800;letter-spacing:1.5px;text-transform:uppercase;color:var(--sea);margin:0 0 4px;}
#ccm-root .muted{color:#5E7B88;font-size:13px;font-weight:700;}

/* auth */
#ccm-root .seg2{display:flex;gap:8px;margin-bottom:14px;}
#ccm-root .seg2 button{flex:1;border:none;border-radius:14px;padding:11px;font:800 14px 'Nunito',sans-serif;background:#EAF6F7;color:var(--sea-deep);cursor:pointer;}
#ccm-root .seg2 button.sel{background:var(--sea-deep);color:#fff;}
#ccm-root .avatars{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;margin:8px 0 14px;}
#ccm-root .avatars button{border-radius:16px;border:3px solid transparent;background:#EAF6F7;cursor:pointer;padding:5px;}
#ccm-root .avatars button.sel{border-color:var(--coral);background:#FFE7E2;transform:scale(1.07);}
#ccm-root input[type=text],#ccm-root input[type=password],#ccm-root input[type=email]{width:100%;padding:13px 14px;border-radius:14px;border:2.5px solid #CFE7EA;font:800 16px 'Nunito',sans-serif;color:var(--ink);background:#FBFEFF;margin-bottom:12px;}
#ccm-root input:focus{outline:none;border-color:var(--sea);}
#ccm-root .agegrid{display:grid;grid-template-columns:1fr;gap:10px;margin-bottom:16px;}
#ccm-root .agegrid button{border:3px solid transparent;border-radius:16px;padding:12px 14px;cursor:pointer;background:#EAF6F7;text-align:left;font-family:'Nunito',sans-serif;}
#ccm-root .agegrid button.sel{border-color:var(--sea);background:#DFF4F6;}
#ccm-root .agegrid .yrs{font:600 18px 'Fredoka',sans-serif;color:var(--sea-deep);}
#ccm-root .agegrid .sch{font-size:11.5px;font-weight:800;color:#5E7B88;line-height:1.3;}
#ccm-root .err{color:var(--coral);font-weight:800;font-size:13.5px;min-height:18px;margin-bottom:8px;}

/* map */
#ccm-root .mapwrap svg{display:block;width:100%;height:auto;}
#ccm-root .node{cursor:pointer;}
#ccm-root .node text{font:600 20px 'Fredoka',sans-serif;fill:#fff;}
#ccm-root .node.locked{cursor:default;}
#ccm-root .cur-ring{animation:ccm-pulse 1.6s ease-out infinite;}
@keyframes ccm-pulse{0%{opacity:.8}70%{opacity:0}100%{opacity:0}}
#ccm-root .maphud{position:sticky;top:0;z-index:5;display:flex;gap:8px;padding:8px 16px;background:linear-gradient(#FFF6E5 70%,transparent);}
#ccm-root .maphud .stat{background:#fff;border-radius:12px;padding:6px 12px;font-weight:800;font-size:13px;box-shadow:0 3px 0 var(--shadow);display:flex;align-items:center;gap:5px;}

/* game tiles */
#ccm-root .tiles{display:grid;grid-template-columns:1fr 1fr;gap:12px;}
#ccm-root .tile{border:none;border-radius:20px;padding:14px;cursor:pointer;text-align:left;color:#fff;font-family:'Nunito',sans-serif;position:relative;min-height:124px;transition:transform .06s;}
#ccm-root .tile:active{transform:translateY(3px);}
#ccm-root .tile h3{margin:8px 0 2px;font-size:16px;color:#fff;}
#ccm-root .tile p{margin:0;font-size:11.5px;font-weight:700;opacity:.92;line-height:1.3;}
#ccm-root .t-sea{background:var(--sea);box-shadow:0 5px 0 #0A7B86;}
#ccm-root .t-coral{background:var(--coral);box-shadow:0 5px 0 #C24533;}
#ccm-root .t-leaf{background:var(--leaf);box-shadow:0 5px 0 #258A55;}
#ccm-root .t-navy{background:var(--sea-deep);box-shadow:0 5px 0 #06222F;}
#ccm-root .best{position:absolute;top:10px;right:10px;background:#ffffff33;border-radius:999px;padding:3px 9px;font-size:11px;font-weight:800;display:flex;gap:4px;align-items:center;}

/* gameplay */
#ccm-root .hud{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
#ccm-root .hud .stat{background:#EAF6F7;border-radius:12px;padding:6px 12px;font-weight:800;font-size:13px;display:flex;align-items:center;gap:5px;}
#ccm-root .prompt{text-align:center;font:600 42px 'Fredoka',sans-serif;color:var(--sea-deep);margin:12px 0;min-height:54px;word-break:break-word;}
#ccm-root .prompt.small{font-size:21px;}
#ccm-root .objfield{text-align:center;margin:8px 0 16px;line-height:1.1;}
#ccm-root .objfield svg{margin:3px;}
#ccm-root .answers{display:grid;grid-template-columns:1fr 1fr;gap:10px;}
#ccm-root .answers .btn{font-size:21px;padding:15px;}
#ccm-root .answers .btn.ok{background:var(--leaf);box-shadow:0 5px 0 #258A55;}
#ccm-root .answers .btn.bad{background:#B9CCD4;box-shadow:0 5px 0 #93A9B2;}
#ccm-root .timerbar{height:10px;background:#E2EFF1;border-radius:99px;overflow:hidden;margin-bottom:8px;}
#ccm-root .timerbar div{height:100%;background:var(--coral);border-radius:99px;transition:width .25s linear;}
#ccm-root .feedback{text-align:center;font:600 19px 'Fredoka',sans-serif;min-height:26px;margin-top:10px;}
#ccm-root .feedback.good{color:var(--leaf);} #ccm-root .feedback.bad{color:var(--coral);}
#ccm-root .bubblegrid{display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:14px 0;}
#ccm-root .bubblegrid button{aspect-ratio:1;border-radius:50%;border:none;cursor:pointer;font:600 25px 'Fredoka',sans-serif;color:#fff;background:var(--sea);box-shadow:0 5px 0 #0A7B86;}
#ccm-root .bubblegrid button.hit{background:var(--leaf);box-shadow:0 5px 0 #258A55;}

/* results */
#ccm-root .result{text-align:center;padding:8px 0;}
#ccm-root .result h2{margin:10px 0 2px;color:var(--sea-deep);}
#ccm-root .xpgain{font:600 22px 'Fredoka',sans-serif;color:var(--leaf);margin:4px 0 14px;}
#ccm-root .bigstars{display:flex;justify-content:center;gap:8px;margin-top:6px;}

/* lists */
#ccm-root .row{display:flex;align-items:center;gap:10px;padding:9px 8px;border-bottom:2px dashed #E5EFF1;}
#ccm-root .row:last-child{border-bottom:none;}
#ccm-root .rank{font:600 17px 'Fredoka',sans-serif;width:30px;color:var(--sea);text-align:center;}
#ccm-root .row .who{flex:1;min-width:0;}
#ccm-root .row .who b{display:block;font-size:15px;}
#ccm-root .row .who span{font-size:11.5px;font-weight:700;color:#5E7B88;}
#ccm-root .row .pts{font:600 17px 'Fredoka',sans-serif;color:var(--sea-deep);display:flex;align-items:center;gap:4px;}
#ccm-root .me{background:#FFF7DC;border-radius:14px;}
#ccm-root .seg{display:flex;gap:6px;margin-bottom:12px;flex-wrap:wrap;}
#ccm-root .seg button{border:none;border-radius:999px;padding:7px 13px;font:800 12.5px 'Nunito',sans-serif;background:#EAF6F7;color:var(--sea-deep);cursor:pointer;display:flex;align-items:center;gap:5px;}
#ccm-root .seg button.sel{background:var(--sea-deep);color:#fff;}
#ccm-root .statgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;margin-top:10px;}
#ccm-root .statgrid .s{background:#EAF6F7;border-radius:14px;padding:10px;text-align:center;}
#ccm-root .statgrid .s b{font:600 20px 'Fredoka',sans-serif;display:block;color:var(--sea-deep);}
#ccm-root .statgrid .s span{font-size:10.5px;font-weight:800;color:#5E7B88;text-transform:uppercase;letter-spacing:.5px;}

/* nav */
#ccm-root nav{position:fixed;bottom:0;left:50%;transform:translateX(-50%);width:100%;max-width:520px;background:#fff;display:flex;box-shadow:0 -4px 18px #0B395418;border-radius:22px 22px 0 0;padding:6px 4px calc(6px + env(safe-area-inset-bottom));z-index:9999;}
#ccm-root nav button{flex:1;border:none;background:none;cursor:pointer;padding:7px 0 4px;font:800 10.5px 'Nunito',sans-serif;color:#8FA8B2;display:flex;flex-direction:column;align-items:center;gap:3px;}
#ccm-root nav button.sel{color:var(--sea-deep);}
#ccm-root nav button svg{stroke:#8FA8B2;}
#ccm-root nav button.sel svg{stroke:var(--coral);}

.ccm-confetti{position:fixed;pointer-events:none;animation:ccm-fall 1.5s ease-in forwards;z-index:99999;}
@keyframes ccm-fall{to{transform:translateY(110vh) rotate(340deg);opacity:0;}}

/* ---- v1.1: dashboard, new game types, animations ---- */
#ccm-root .tile.sm{min-height:108px;padding:12px;}
#ccm-root .tile.sm h3{font-size:14.5px;margin:6px 0 2px;}
#ccm-root .tile.sm p{font-size:10.5px;}
#ccm-root .t-amber{background:#F4A300;box-shadow:0 5px 0 #B87A00;}
#ccm-root .t-purple{background:#6B4E9B;box-shadow:0 5px 0 #4A3470;}
#ccm-root .memgrid{display:grid;grid-template-columns:repeat(3,1fr);gap:10px;margin:14px 0;}
#ccm-root .memcard{min-height:62px;border:none;border-radius:14px;cursor:pointer;background:var(--sea-deep);color:#fff;font:600 15px 'Fredoka',sans-serif;box-shadow:0 4px 0 #06222F;padding:6px;word-break:break-word;transition:transform .12s;}
#ccm-root .memcard.open{background:#fff;color:var(--sea-deep);border:3px solid var(--sea);box-shadow:0 4px 0 #C8E4E7;transform:scale(1.04);}
#ccm-root .memcard.done{background:var(--leaf);box-shadow:0 4px 0 #258A55;color:#fff;cursor:default;}
#ccm-root .shake{animation:ccm-shake .4s;}
@keyframes ccm-shake{0%,100%{transform:translateX(0)}25%{transform:translateX(-6px)}50%{transform:translateX(6px)}75%{transform:translateX(-4px)}}
#ccm-root .gsel{width:100%;padding:11px 12px;border-radius:14px;border:2.5px solid #CFE7EA;font:800 14px 'Nunito',sans-serif;color:var(--ink);background:#FBFEFF;margin-bottom:12px;}
@media (prefers-reduced-motion:reduce){#ccm-root .shake,#ccm-root .memcard{animation:none;transition:none;}}