@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:400;src:url(/demos/bubu-dudu/assets/fredoka-latin-400-normal-17JuUzdy.woff2) format("woff2"),url(/demos/bubu-dudu/assets/fredoka-latin-400-normal-DbXSrOeS.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:500;src:url(/demos/bubu-dudu/assets/fredoka-latin-500-normal-B0JifZgm.woff2) format("woff2"),url(/demos/bubu-dudu/assets/fredoka-latin-500-normal-BL692wg7.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:600;src:url(/demos/bubu-dudu/assets/fredoka-latin-600-normal-C4zohCW5.woff2) format("woff2"),url(/demos/bubu-dudu/assets/fredoka-latin-600-normal-CcrEjrB4.woff) format("woff")}@font-face{font-family:Fredoka;font-style:normal;font-display:swap;font-weight:700;src:url(/demos/bubu-dudu/assets/fredoka-latin-700-normal-BOIZVyIN.woff2) format("woff2"),url(/demos/bubu-dudu/assets/fredoka-latin-700-normal-C8FeHd3X.woff) format("woff")}:root{--ink: #3b2a22;--pink: #f7a8bd;--pink-d: #ef7f9c;--blue: #a8c8f0;--cream: #fff7ef;--glass: rgba(255, 255, 255, .62);--glass-b: rgba(255, 255, 255, .85);--shadow: 0 10px 30px rgba(196, 120, 140, .22);--r: 22px;--font: "Fredoka", "Rubik", ui-rounded, system-ui, sans-serif;color-scheme:light}*{box-sizing:border-box}html,body{margin:0;height:100%;overflow:hidden;font-family:var(--font);color:var(--ink);background:radial-gradient(circle at 15% 15%,#ffe3ea 0,transparent 40%),radial-gradient(circle at 85% 20%,#e3efff 0,transparent 40%),radial-gradient(circle at 50% 100%,#fff1d9 0,transparent 50%),#fbe9ee;-webkit-tap-highlight-color:transparent;overscroll-behavior:none;user-select:none;-webkit-user-select:none}#app{position:fixed;inset:0;display:flex;flex-direction:column;padding:env(safe-area-inset-top) env(safe-area-inset-right) env(safe-area-inset-bottom) env(safe-area-inset-left)}.btn{font:inherit;font-weight:600;font-size:16px;padding:10px 18px;border-radius:999px;border:2.5px solid var(--ink);background:#fff;color:var(--ink);cursor:pointer;box-shadow:0 4px 0 var(--ink);transition:transform .08s,box-shadow .08s}.btn:hover{transform:translateY(-1px)}.btn:active{transform:translateY(3px);box-shadow:0 1px 0 var(--ink)}.btn.primary{background:linear-gradient(180deg,#ffc2d1,var(--pink))}.btn.blue{background:linear-gradient(180deg,#d3e5fb,var(--blue))}.btn.ghost{background:var(--glass-b)}.btn.small{padding:6px 12px;font-size:14px}.btn:disabled{opacity:.5;cursor:default}#topbar{display:none;align-items:center;gap:10px;padding:8px 12px}body[data-screen=game] #topbar{display:flex}#topbar h1{flex:1;margin:0;font-size:clamp(15px,2.4vw,22px);font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.icon{width:44px;height:44px;border-radius:50%;border:2.5px solid var(--ink);background:var(--glass-b);font-size:20px;cursor:pointer;box-shadow:0 3px 0 var(--ink)}.coins{display:inline-flex;align-items:center;gap:6px;padding:4px 14px 4px 6px;border-radius:999px;background:var(--glass-b);border:2.5px solid var(--ink);font-weight:700;font-size:18px}.coins img{width:30px;height:30px}#stage{position:relative;flex:1;min-height:0;visibility:hidden}body[data-screen=game] #stage{visibility:visible}#stage canvas{border-radius:18px;box-shadow:var(--shadow);touch-action:none}#hud{position:absolute;inset:0;pointer-events:none;z-index:5}#hud>*{pointer-events:auto}.hud-pill{position:absolute;display:flex;align-items:center;gap:10px;padding:8px 14px;border-radius:999px;background:var(--glass);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px);border:2px solid rgba(255,255,255,.9);box-shadow:var(--shadow);font-weight:600;font-size:clamp(13px,1.8vw,18px)}.hud-pill.tl{top:10px;left:10px}.hud-pill.tr{top:10px;right:10px}.hud-pill.tc{top:10px;left:50%;transform:translate(-50%)}.hud-pill.bl{bottom:10px;left:10px}.hud-pill.br{bottom:10px;right:10px}.hearts img{width:26px;height:26px}.hearts img.empty{filter:grayscale(1);opacity:.35}.meter{width:120px;height:12px;border-radius:99px;background:#fffc;border:2px solid var(--ink);overflow:hidden}.meter>i{display:block;height:100%;background:linear-gradient(90deg,#ff9fb5,#ff6d8d);transition:width .2s}.banner{position:absolute;left:50%;top:40%;transform:translate(-50%,-50%) scale(.7);opacity:0;font-size:clamp(26px,6vw,60px);font-weight:700;color:#fff;-webkit-text-stroke:2px var(--ink);text-shadow:0 5px 0 var(--ink);pointer-events:none;transition:opacity .25s,transform .3s cubic-bezier(.3,1.6,.6,1);white-space:nowrap}.banner.show{opacity:1;transform:translate(-50%,-50%) scale(1)}#hub{position:absolute;inset:0;overflow-y:auto;padding:18px 16px 30px}body[data-screen=game] #hub{display:none}.hub-inner{max-width:1180px;margin:0 auto}.hub-head{display:flex;align-items:center;gap:18px;flex-wrap:wrap;margin-bottom:18px}.hub-bears{display:flex;align-items:flex-end}.hb{width:110px;animation:bob 1.6s ease-in-out infinite}.hb.bubu{margin-left:-26px;animation-delay:.3s}@keyframes bob{50%{transform:translateY(-7px) rotate(-2deg)}}.logo{margin:0;font-size:clamp(36px,7vw,64px);font-weight:700;line-height:1;color:#fff;-webkit-text-stroke:3px var(--ink);text-shadow:0 6px 0 var(--ink);letter-spacing:.01em}.logo span{color:var(--pink)}.sub{margin:10px 0 0;font-size:17px;opacity:.8}.hub-tools{margin-left:auto;display:flex;gap:10px;align-items:center}.cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:18px}.card{position:relative;display:flex;flex-direction:column;border-radius:var(--r);background:var(--glass);backdrop-filter:blur(10px);-webkit-backdrop-filter:blur(10px);border:2.5px solid var(--ink);box-shadow:0 6px 0 var(--ink);overflow:hidden;transition:transform .15s}.card:hover{transform:translateY(-4px) rotate(-.5deg)}.art{position:relative;height:170px;overflow:hidden}.card-snack .art{background:linear-gradient(180deg,#2c3166,#6a5aa8)}.card-cafe .art{background:linear-gradient(180deg,#ffe7c7,#f9c9a6)}.card-maze .art{background:linear-gradient(180deg,#d8f0c9,#a9dc96)}.card-notes .art{background:linear-gradient(180deg,#ffd9e3,#f7b4c4)}.art img{position:absolute}.art .a1{width:120px;left:18%;bottom:-6px}.art .a2{width:120px;left:46%;bottom:-6px}.art .flip{transform:scaleX(-1)}.art .p1{right:8%;top:18px;width:64px;animation:bob 2s ease-in-out infinite}.art .p2{left:8%;top:24px;width:48px;animation:bob 2.4s ease-in-out infinite reverse}.card-body{display:flex;flex-direction:column;gap:6px;padding:14px 16px 16px;flex:1}.card-body h2{margin:0;font-size:21px;line-height:1.15}.card-body p{margin:0;font-size:15px;opacity:.85}.card-body .btn{margin-top:auto;align-self:flex-start}.card-body .progress{font-size:13px;opacity:.7;margin-bottom:8px}.tag{align-self:flex-start;font-size:12px;font-weight:600;padding:2px 10px;border-radius:99px;background:#fff;border:2px solid var(--ink)}.foot{text-align:center;opacity:.7;margin-top:22px}#modal{position:fixed;inset:0;z-index:50;display:none;align-items:center;justify-content:center;padding:16px;background:#50283c40;backdrop-filter:blur(4px)}#modal.open{display:flex}.modal-card{width:min(480px,100%);max-height:100%;overflow-y:auto;padding:24px;border-radius:var(--r);background:#ffffffe6;border:2.5px solid var(--ink);box-shadow:0 6px 0 var(--ink);text-align:center;user-select:text}.modal-card.wide{width:min(760px,100%)}.modal-card h2{margin:0 0 10px;font-size:28px}.modal-card .row{display:flex;gap:10px;justify-content:center;flex-wrap:wrap;margin-top:16px}.modal-card .hero{width:120px}.field{display:flex;flex-direction:column;gap:6px;text-align:left;margin:12px 0;font-weight:600}input[type=range]{accent-color:var(--pink-d)}input[type=text],input[type=password],textarea{font:inherit;font-weight:500;padding:10px 12px;border-radius:14px;border:2.5px solid var(--ink);background:#fff;color:var(--ink);user-select:text}textarea{min-height:120px;resize:vertical}.stars{font-size:34px;color:#ffc93c;-webkit-text-stroke:1.5px var(--ink);letter-spacing:4px}.stars i{font-style:normal;color:#eee}.stat-row{display:flex;justify-content:center;gap:18px;flex-wrap:wrap;margin:10px 0}.stat-row b{display:block;font-size:24px}.toast{position:fixed;left:50%;bottom:24px;transform:translate(-50%,30px);opacity:0;z-index:60;padding:10px 18px;border-radius:999px;background:#fff;border:2.5px solid var(--ink);box-shadow:0 4px 0 var(--ink);font-weight:600;transition:opacity .2s,transform .2s;pointer-events:none}.toast.show{opacity:1;transform:translate(-50%)}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(96px,1fr));gap:10px;margin-top:10px}.tile{font:inherit;display:flex;flex-direction:column;align-items:center;gap:4px;padding:10px 6px;border-radius:16px;border:2.5px solid var(--ink);background:#fff;cursor:pointer;color:var(--ink)}.tile:disabled{opacity:.45;cursor:default}.tile.on{background:#ffe1ea}.tile img{width:56px;height:56px;object-fit:contain}.tile small{font-size:12px;opacity:.75}.tile .stars{font-size:15px;letter-spacing:1px}#touch{display:none;position:absolute;inset:auto 0 0;height:0;z-index:6}body.touch[data-game=snack] #touch{display:block}.pad{position:absolute;bottom:12px;display:flex;gap:10px;align-items:flex-end}.pad.p1{left:12px}.pad.p2{right:12px}.pad button{width:64px;height:64px;border-radius:50%;border:2.5px solid var(--ink);background:#ffffffbf;font-size:24px;touch-action:none;box-shadow:0 3px 0 var(--ink)}.pad button.jump{width:76px;height:76px;background:#ffc2d1d9}.pad button.on{transform:translateY(3px);box-shadow:0 0 0 var(--ink)}.pad .who{position:absolute;top:-28px;left:0;font-weight:700;font-size:13px}@media(max-width:640px){.hb{width:84px}.art{height:140px}.art .a1,.art .a2{width:96px}.pad button{width:54px;height:54px}.pad button.jump{width:64px;height:64px}}@media(prefers-reduced-motion:reduce){.hb,.art img{animation:none!important}}.paper{display:block;width:56px;height:56px;border-radius:10px;border:2px solid var(--ink)}.paper-hearts{background:radial-gradient(circle at 10px 10px,#ffb3c4 4px,transparent 5px) 0 0 / 28px 28px,#fff3f6}.paper-clouds{background:radial-gradient(ellipse 12px 7px at 14px 14px,#ffffff 90%,transparent) 0 0 / 34px 30px,#d9ecfb}.paper-stars{background:radial-gradient(circle at 8px 8px,#ffe9a8 2.5px,transparent 3.5px) 0 0 / 22px 22px,#3a3f75;color:#fff}.paper-kraft{background:repeating-linear-gradient(0deg,transparent 0 27px,rgba(59,42,34,.12) 27px 28px),#ecd3b0}.letter-card{background:transparent!important;border:0!important;box-shadow:none!important;padding:0!important}.letter{position:relative;padding:34px 30px 26px;border-radius:22px;border:3px solid var(--ink);box-shadow:0 8px 0 var(--ink);text-align:left;font-size:20px;line-height:1.5;animation:unfold .6s cubic-bezier(.3,1.5,.6,1)}.letter.paper-stars{color:#fff}.letter .to{font-weight:700;font-size:24px;margin:0 0 10px}.letter .msg{margin:0 0 14px;white-space:normal;word-break:break-word}.letter .from{text-align:right;font-weight:600;margin:0}.letter .stickers{display:flex;gap:8px;justify-content:center;margin-top:10px}.letter .stickers img{width:90px}@keyframes unfold{0%{transform:scaleY(.2) translateY(60px);opacity:0}}#rotate{display:none}@media(orientation:portrait)and (pointer:coarse){body[data-screen=game]:not(.rotate-ok) #rotate{position:fixed;inset:auto 12px 12px;z-index:40;display:flex;align-items:center;gap:10px;padding:12px 14px;border-radius:18px;background:#fff;border:2.5px solid var(--ink);box-shadow:0 4px 0 var(--ink);font-weight:600}#rotate span{font-size:28px;animation:tilt 1.6s ease-in-out infinite}#rotate p{flex:1;margin:0}}@keyframes tilt{50%{transform:rotate(-90deg)}}@media(max-height:500px){#topbar{padding:4px 10px}#topbar .icon{width:36px;height:36px;font-size:16px}#topbar .coins{padding:2px 10px 2px 4px;font-size:15px}#topbar .coins img{width:24px;height:24px}.hud-pill{padding:5px 10px}}
