*{box-sizing:border-box;margin:0;padding:0}:root{--primary:#e45145;--primary-dark:#c73a2f;--bg:#f0f4f8;--text:#0f172a;--muted:#64748b;--card-bg:#fff;--border:#e8edf3}body{background:var(--bg);color:var(--text);font-family:Inter,sans-serif}.app{max-width:430px;min-height:100vh;margin:auto;padding-bottom:48px}.header{color:#fff;background:linear-gradient(140deg,#c0392b 0%,#e45145 45%,#ff8c00 100%);border-radius:0 0 36px 36px;padding:36px 22px 96px;position:relative;overflow:hidden}.header:before{content:"";background:#ffffff12;border-radius:50%;width:220px;height:220px;position:absolute;top:-60px;right:-50px}.header:after{content:"";background:#ffffff0d;border-radius:50%;width:140px;height:140px;position:absolute;bottom:10px;left:-30px}.header-badge{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);letter-spacing:.5px;z-index:1;background:#fff3;border:1px solid #ffffff4d;border-radius:999px;margin-bottom:14px;padding:5px 14px;font-size:12px;font-weight:700;display:inline-block;position:relative}.header h1{letter-spacing:-1px;z-index:1;font-size:42px;font-weight:900;line-height:1.05;position:relative}.header p{opacity:.85;z-index:1;margin-top:10px;font-size:14px;font-weight:500;position:relative}.tabs-wrap{z-index:10;margin-top:-38px;padding:0 16px;position:relative}.tabs{background:#fff;border-radius:20px;padding:5px;display:flex;box-shadow:0 12px 40px #0000001a}.tab{cursor:pointer;color:#64748b;background:0 0;border:none;border-radius:15px;flex:1;height:48px;font-size:13px;font-weight:700;transition:all .2s}.tab.active{background:var(--primary);color:#fff;box-shadow:0 4px 14px #e4514559}.content{padding:20px 16px 0}.tab-content{display:none}.tab-content.active{display:block}.match-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:24px;margin-bottom:14px;padding:18px 18px 16px;transition:transform .15s,box-shadow .15s;box-shadow:0 4px 20px #0000000f}.match-card:active{transform:scale(.985)}.match-card.live{background:linear-gradient(135deg,#fff5f5 0%,#fff 60%);border-color:#fca5a5}.match-top{justify-content:space-between;align-items:flex-start;margin-bottom:18px;display:flex}.match-meta{flex-direction:column;gap:3px;display:flex}.game-type{text-transform:uppercase;letter-spacing:.8px;color:var(--primary);font-size:11px;font-weight:800}.match-time{color:var(--muted);font-size:12px;font-weight:500}.status{color:#4f46e5;background:#eef2ff;border-radius:999px;align-items:center;gap:5px;padding:6px 12px;font-size:12px;font-weight:700;display:flex}.status.live-badge{color:#dc2626;background:#fef2f2}.live-dot{background:#dc2626;border-radius:50%;width:7px;height:7px;animation:1.2s infinite pulse}@keyframes pulse{0%,to{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.75)}}.teams{justify-content:space-between;align-items:center;padding:0 4px;display:flex}.team{text-align:center;width:105px}.flag-wrap{border:2.5px solid var(--border);border-radius:50%;width:62px;height:62px;margin:0 auto;overflow:hidden;box-shadow:0 4px 12px #0000001a}.flag-wrap img{object-fit:cover;width:100%;height:100%}.team-name{color:var(--text);margin-top:10px;font-size:14px;font-weight:800}.team-short{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-top:2px;font-size:11px;font-weight:600}.vs-block{flex-direction:column;align-items:center;gap:6px;display:flex}.vs{background:var(--bg);width:38px;height:38px;color:var(--muted);letter-spacing:.5px;border-radius:50%;justify-content:center;align-items:center;font-size:11px;font-weight:900;display:flex}.predict-btn{background:linear-gradient(135deg, var(--primary), #ff6b35);color:#fff;cursor:pointer;letter-spacing:.3px;border:none;border-radius:15px;width:100%;height:50px;margin-top:18px;font-size:14px;font-weight:800;transition:opacity .15s,transform .1s;box-shadow:0 4px 14px #e451454d}.predict-btn:active{opacity:.9;transform:scale(.98)}.completed-badge{color:#94a3b8;background:#f1f5f9;border-radius:14px;justify-content:center;align-items:center;width:100%;height:46px;margin-top:16px;font-size:13px;font-weight:700;display:flex}.prediction-card{background:var(--card-bg);border:1.5px solid var(--border);border-radius:22px;margin-bottom:14px;padding:18px;box-shadow:0 4px 20px #0000000f}.prediction-top{justify-content:space-between;align-items:center;gap:8px;margin-bottom:10px;display:flex}.prediction-top strong{font-size:14px;font-weight:800}.pending{color:#d97706;white-space:nowrap;background:#fffbeb;border-radius:999px;padding:4px 10px;font-size:13px;font-weight:700}.won{color:#16a34a;white-space:nowrap;background:#f0fdf4;border-radius:999px;padding:4px 10px;font-size:13px;font-weight:700}.prediction-score{font-size:15px;font-weight:800}.prediction-result{border-top:1px solid var(--border);color:var(--muted);margin-top:12px;padding-top:12px;font-size:13px}@keyframes shimmer{0%{background-position:-400px 0}to{background-position:400px 0}}.skel{background:linear-gradient(90deg,#e8edf3 25%,#f4f7fb 50%,#e8edf3 75%) 0 0/800px 100%;border-radius:8px;animation:1.4s linear infinite shimmer}.skeleton-card{border:1.5px solid var(--border);background:#fff;border-radius:24px;margin-bottom:14px;padding:18px}.skeleton-row{justify-content:space-between;align-items:center;margin-bottom:20px;display:flex}.skel-short{width:90px;height:14px}.skel-chip{border-radius:999px;width:70px;height:28px}.skeleton-teams{justify-content:space-between;align-items:center;margin-bottom:18px;padding:0 4px;display:flex}.skel-team{flex-direction:column;align-items:center;gap:10px;width:105px;display:flex}.skel-circle{border-radius:50%;width:62px;height:62px}.skel-name{width:70px;height:13px}.skel-vs{border-radius:50%;width:38px;height:38px}.skel-btn{border-radius:15px;width:100%;height:50px}.error-state,.empty-state{text-align:center;border:1.5px solid var(--border);background:#fff;border-radius:24px;padding:40px 24px}.error-icon,.empty-icon{margin-bottom:14px;font-size:44px}.error-title,.empty-title{margin-bottom:8px;font-size:17px;font-weight:800}.error-msg,.empty-msg{color:var(--muted);font-size:14px;line-height:1.5}.retry-btn{background:var(--primary);color:#fff;cursor:pointer;border:none;border-radius:12px;height:44px;margin-top:20px;padding:0 28px;font-weight:700}.overlay{opacity:0;visibility:hidden;z-index:99;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);background:#00000080;transition:all .3s;position:fixed;inset:0}.overlay.show{opacity:1;visibility:visible}.drawer{z-index:100;background:#fff;border-radius:30px 30px 0 0;width:100%;max-width:430px;padding:22px 22px 36px;transition:transform .35s cubic-bezier(.32,.72,0,1);position:fixed;bottom:0;left:50%;transform:translate(-50%,100%)}.drawer.show{transform:translate(-50%)}.handle{background:#dbe2ea;border-radius:999px;width:48px;height:5px;margin:0 auto 22px}.drawer h3{font-size:22px;font-weight:900}.match-title{color:var(--muted);margin-top:4px;margin-bottom:24px;font-size:14px;font-weight:500}.label{letter-spacing:1.2px;color:#000;text-transform:uppercase;margin-bottom:12px;font-size:11px;font-weight:800}.options{gap:8px;margin-bottom:24px;display:flex}.option{border:1.5px solid var(--border);cursor:pointer;height:48px;color:var(--muted);border-radius:14px;flex:1;justify-content:center;align-items:center;font-size:13px;font-weight:700;transition:all .15s;display:flex}.option.active{background:var(--primary);color:#fff;border-color:var(--primary);box-shadow:0 4px 12px #e451454d}.score{justify-content:center;align-items:center;gap:16px;margin-bottom:26px;display:flex}.score-box{text-align:center}.score-box span{color:var(--muted);text-transform:uppercase;letter-spacing:.5px;margin-bottom:8px;font-size:12px;font-weight:700;display:block}.score input{border:2px solid var(--border);background:var(--bg);text-align:center;width:76px;height:76px;color:var(--text);border-radius:18px;outline:none;font-size:30px;font-weight:900;transition:border-color .15s}.score input:focus{border-color:var(--primary)}.score-sep{color:#cbd5e1;margin-top:24px;font-size:24px}.submit-btn{background:linear-gradient(135deg, var(--primary), #ff6b35);color:#fff;cursor:pointer;letter-spacing:.3px;border:none;border-radius:16px;width:100%;height:54px;font-size:15px;font-weight:800;transition:opacity .15s;box-shadow:0 6px 20px #e4514559}.submit-btn:active{opacity:.9}.success{opacity:0;visibility:hidden;z-index:200;-webkit-backdrop-filter:blur(3px);backdrop-filter:blur(3px);background:#0000008c;justify-content:center;align-items:center;transition:all .3s;display:flex;position:fixed;inset:0}.success.show{opacity:1;visibility:visible}.success-card{text-align:center;background:#fff;border-radius:30px;width:88%;max-width:340px;padding:36px 28px;animation:.3s cubic-bezier(.175,.885,.32,1.275) popIn;box-shadow:0 24px 60px #00000026}@keyframes popIn{0%{opacity:0;transform:scale(.85)}to{opacity:1;transform:scale(1)}}.check{color:#fff;background:linear-gradient(135deg,#22c55e,#16a34a);border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 20px;font-size:34px;display:flex;box-shadow:0 8px 24px #22c55e59}.checkRed{color:#fff;background:linear-gradient(135deg,#c52222,#c52222);border-radius:50%;justify-content:center;align-items:center;width:80px;height:80px;margin:0 auto 20px;font-size:34px;display:flex;box-shadow:0 8px 24px #22c55e59}.success-card h2{font-size:20px;font-weight:900}.success-card p{color:var(--muted);margin-top:8px;font-size:14px;line-height:1.5}.done-btn{background:linear-gradient(135deg, var(--primary), #ff6b35);color:#fff;cursor:pointer;border:none;border-radius:14px;width:100%;height:52px;margin-top:24px;font-size:15px;font-weight:800;box-shadow:0 4px 14px #e451454d}.result-box{flex-direction:column;align-items:center;gap:8px;display:flex}.score-line{font-size:18px;font-weight:600}.winner-badge{color:#fff;border-radius:999px;padding:6px 12px;font-size:12px;font-weight:600}.winner-badge.win{background:linear-gradient(135deg,#16a34a,#22c55e)}.winner-badge.lose{background:linear-gradient(135deg,#ef4444,#f97316)}.predicted-badge{text-align:center;color:#4ade80;text-align:center;background:#ffffff1a;border:1px solid #4ade80;border-radius:8px;flex:1;width:100%;padding:10px;font-size:14px;font-weight:600;display:block}.predicted-actions{align-items:center;gap:8px;display:flex}.edit-btn{color:#fff;cursor:pointer;white-space:nowrap;background:#ffffff1a;border:1px solid #ffffff4d;border-radius:8px;padding:10px 16px;font-size:14px;font-weight:600}.edit-btn:active{opacity:.7}