@font-face{font-family:SUIT;src:url(/assets/fonts/SUIT-Regular.ttf) format("truetype");font-weight:400}@font-face{font-family:SUIT;src:url(/assets/fonts/SUIT-Bold.ttf) format("truetype");font-weight:700}@font-face{font-family:SUIT;src:url(/assets/fonts/SUIT-ExtraBold.ttf) format("truetype");font-weight:800}@font-face{font-family:SUIT;src:url(/assets/fonts/SUIT-Heavy.ttf) format("truetype");font-weight:900}:root{color:#251836;background:#fff7fb;font-family:SUIT,system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,sans-serif;font-synthesis:none;text-rendering:optimizeLegibility}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh}button,input{font:inherit}button{border:0;color:inherit;cursor:pointer}.appShell{min-height:100vh;display:grid;place-items:center;padding:18px;background:radial-gradient(circle at 18% 12%,rgba(255,214,117,.38),transparent 30%),linear-gradient(135deg,#fff7fb,#eef8ff)}.appShell.dark{color:#f8f3ff;background:#100a1d}.phoneFrame{width:min(100%,430px);height:min(900px,calc(100vh - 36px));min-height:680px;display:grid;grid-template-rows:1fr 78px;overflow:hidden;border:1px solid rgba(255,255,255,.75);border-radius:30px;background:#fff7fb;box-shadow:0 24px 70px #3d235638}.dark .phoneFrame{border-color:#ffffff14;background:#171024;box-shadow:0 24px 70px #0000006b}.screenBody{min-height:0;overflow:hidden}.playScreen,.collectionScreen,.detailScreen,.settingsScreen{height:100%;padding:18px 22px;overflow:auto}.topRow,.listHeader,.detailTopBar{display:flex;align-items:center;justify-content:space-between;gap:16px}.eyebrow,.sectionLabel{margin:0;color:#786a88;font-size:13px;font-weight:900}.dark .eyebrow,.dark .sectionLabel,.dark .collectionRow span,.dark .statCard>span,.dark .settingRow em,.dark .versionRow,.dark .statRow span{color:#bdb2cd}.todayCount{display:block;margin-top:3px;font-size:34px;font-weight:900;letter-spacing:0}.iconButton,.plainIcon{width:40px;height:40px;display:grid;place-items:center;border-radius:50%;background:#fff;box-shadow:0 10px 22px #502d6821}.plainIcon{background:transparent;box-shadow:none;font-size:32px;font-weight:900}.muted{opacity:.55}.dark .iconButton,.dark .collectionRow,.dark .statCard,.dark .statsBox{background:#241935;box-shadow:none}.ballInfo{display:grid;justify-items:center;gap:8px;margin-top:18px}h1,h2,p{margin:0}.ballInfo h1{font-size:22px;font-weight:900}.badgeRow,.nameRow,.goalRow{display:flex;align-items:center;gap:8px}.rarityBadge{display:inline-flex;align-items:center;min-height:24px;padding:0 10px;border-radius:999px;color:#fff;font-size:11px;font-weight:900}.rarityBadge.common{background:#34b89f}.rarityBadge.rare{background:#4d9cff}.rarityBadge.epic{background:#9355f2}.rarityBadge.legendary{background:#ff9d33}.statusPill,.miniBadge{display:inline-flex;align-items:center;min-height:24px;padding:0 9px;border-radius:999px;background:#ff5faa;color:#fff;font-size:11px;font-weight:900}.statusPill.random{background:#24b3a7}.stage{position:relative;min-height:330px;display:grid;place-items:center}.ballTouch{position:relative;width:292px;height:292px;display:grid;place-items:center;padding:0;border-radius:50%;background:transparent;-webkit-tap-highlight-color:transparent}.ballWrap{position:relative;width:286px;height:286px}.ballWrap.bump{animation:ballBump .18s ease-out}.ballWrap.squish{animation:ballSquish .76s ease-out}.ballImage,.ballShadow{position:absolute;inset:0;width:100%;height:100%;object-fit:contain;-webkit-user-select:none;user-select:none;pointer-events:none}.ballShadow{transform:translateY(26px) scale(.9);opacity:.55}.ballShadow.hide{opacity:0}.ballImage{z-index:1}.ballImage.broken{animation:brokenPop .18s ease-out both}.shardLayer{position:absolute;inset:0;z-index:2;pointer-events:none}.shardPiece{position:absolute;left:50%;top:50%;width:var(--shard-size, 24px);height:var(--shard-size, 24px);border-radius:42% 58% 52% 48%;background-position:center;background-repeat:no-repeat;background-size:var(--shard-bg-size, contain);box-shadow:0 8px 14px #502d6824;transform:translate(-50%,-50%);animation:shardBurst .76s ease-out both}.shardPiece.imageShard{border-radius:0;box-shadow:none}.tapGuide .guideBall{width:44px;height:44px;object-fit:contain;transform-origin:center;animation:guideBallScale 1.2s ease-in-out infinite}@keyframes guideBallScale{0%{transform:scale(1.03)}50%{transform:scale(1)}to{transform:scale(1.03)}}.bottomArea{display:grid;gap:10px;transform:translateY(-18px)}.statCard,.statsBox{padding:16px;border-radius:20px;background:#ffffffdb;box-shadow:0 10px 22px #502d6821}.statCard:not(.goalCard){display:flex;align-items:center;gap:7px}.statCard>span,.versionRow span,.statRow span{color:#786a88;font-size:13px;font-weight:900}.statCard strong{display:block;margin-top:6px;color:#251836;font-size:24px;font-weight:900}.shardAmount{align-items:center;gap:4px;line-height:1}.statCard strong.shardAmount{display:inline-flex;margin-top:0;font-size:16px}.statRow strong.shardAmount{display:inline-flex}.shardAmount span{color:inherit;font:inherit}.shardIcon{width:1.05em;height:1.12em;object-fit:contain;flex:0 0 auto}.dark .statCard strong,.dark .collectionRow,.dark .settingsScreen,.dark .detailScreen{color:#f8f3ff}.detailScreen{position:relative}.goalCard strong{margin:0;font-size:14px}.goalBody{flex:1;display:grid;gap:7px}.goalRow em{color:#786a88;font-size:11px;font-style:normal;font-weight:900}.progressTrack{position:relative;height:9px;display:block;overflow:hidden;border-radius:999px;background:#ece5f2}.progressFill{position:absolute;inset:0 auto 0 0;border-radius:inherit;background:linear-gradient(90deg,#ff5faa,#ffd675)}.tabBar{display:grid;grid-template-columns:repeat(3,1fr);gap:6px;padding:10px 12px 12px;border-top:1px solid rgba(128,106,146,.16);background:#ffffffb8;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px)}.dark .tabBar{border-top-color:#ffffff14;background:#171024c7}.tabButton{display:grid;place-items:center;gap:3px;min-height:54px;border-radius:18px;background:transparent;color:#786a88}.tabIcon{width:21px;height:21px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.tabButton strong{font-size:12px;font-weight:900}.tabButton.active{background:#251836;color:#fff}.dark .tabButton.active{background:#ff5faa}.listHeader h1,.settingsScreen h1,.detailTopBar h1{font-size:20px;font-weight:900}.listHeader span{color:#786a88;font-weight:900}.collectionList{display:grid;gap:12px;margin-top:18px}.collectionRow{width:100%;display:flex;align-items:center;gap:14px;min-height:98px;padding:14px;border-radius:20px;background:#ffffffe0;text-align:left;box-shadow:0 10px 22px #502d681a}.ballPreview{position:relative;flex:0 0 auto;display:inline-grid;place-items:center}.ballPreview img{width:100%;height:100%;object-fit:contain}.ballPreview.locked img{filter:grayscale(1);opacity:.48}.rowBody{min-width:0;flex:1;display:grid;gap:8px}.nameRow{justify-content:space-between}.nameRow strong{min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;font-size:16px;font-weight:900}.check,.lock{flex:0 0 auto;font-weight:900}.inlineProgress{display:grid;gap:5px}.inlineProgress span{color:#786a88;font-size:11px;font-weight:900}.detailScroll{display:grid;justify-items:center;gap:14px;padding:18px 0 28px}.detailScroll h2{font-size:24px;font-weight:900}.detailScroll p{max-width:320px;color:#786a88;text-align:center;font-size:14px;font-weight:800;line-height:1.45}.statsBox{width:100%;display:grid;gap:12px}.statRow,.versionRow{display:flex;align-items:center;justify-content:space-between;gap:16px}.statRow strong,.versionRow strong{font-size:14px;font-weight:900}.actionButton{width:100%;min-height:52px;border-radius:18px;font-weight:900}.actionButton.primary{background:#ff5faa;color:#fff}.actionButton.disabled{background:#ece5f2;color:#786a88;cursor:default}.toast{position:absolute;left:50%;bottom:clamp(168px,22vh,220px);transform:translate(-50%);z-index:10;min-width:180px;padding:13px 16px;border-radius:999px;background:#251836;color:#fff;text-align:center;font-size:13px;font-weight:900}.settingsScreen{display:grid;align-content:start;gap:0}.settingsScreen h1{margin-bottom:28px;text-align:center}.sectionLabel{margin-bottom:4px}.settingRow{min-height:64px;display:flex;align-items:center;justify-content:space-between;gap:14px;border-bottom:1px solid #eadfed}.dark .settingRow,.dark .versionRow{border-bottom-color:#ffffff1f}.settingRow span{display:grid;gap:3px}.settingRow strong{font-size:16px;font-weight:900}.settingRow em{max-width:270px;color:#786a88;font-size:12px;font-style:normal;font-weight:800}.settingRow input{width:48px;height:28px;flex:0 0 auto;accent-color:#ff5faa}.versionRow{min-height:58px;border-bottom:1px solid #eadfed}@keyframes ballBump{0%{transform:scale(1)}40%{transform:scale(1.05)}70%{transform:scale(.95)}to{transform:scale(1)}}@keyframes ballSquish{0%{transform:translateY(0) scale(1)}15%{transform:translateY(18px) scale(1.1,.82)}55%{transform:translateY(18px) scale(1.1,.82)}76%{transform:translateY(4px) scale(.98,1.04)}to{transform:translateY(0) scale(1)}}@keyframes brokenPop{0%{transform:scale(.96);opacity:1}58%{transform:scale(1.04);opacity:1}to{transform:scale(1);opacity:1}}@keyframes shardBurst{0%{opacity:1;transform:translate(-50%,-50%) translate(0) rotate(0) scale(.9)}76%{opacity:1}to{opacity:0;transform:translate(-50%,-50%) translate(var(--x),var(--y)) rotate(var(--r)) scale(1)}}@keyframes guideBounce{0%,to{transform:translateY(0)}50%{transform:translateY(18px)}}@media(max-width:520px){.appShell{padding:0}.phoneFrame{width:100%;height:100vh;min-height:100vh;border:0;border-radius:0}}
