:root{--primary:#ff6b6b;--primary-dark:#e05555;--accent:#ffd93d;--accent-dark:#f0c830;--bg:#fff8f0;--bg-card:#fff;--text:#3d3d3d;--text-light:#777;--text-heading:#2d2d2d;--success:#6bcb77;--border:#f0e0d0;--shadow:0 2px 8px #00000014;--shadow-lg:0 4px 16px #0000001f;--radius:12px;--nav-height:64px;--banner-height:44px;--header-height:64px;color:var(--text);background:var(--bg);-webkit-font-smoothing:antialiased;touch-action:manipulation;font-family:system-ui,-apple-system,Segoe UI,Roboto,sans-serif}*,:before,:after{box-sizing:border-box}body{background:#f0e6d8;min-height:100dvh;margin:0;overflow-x:hidden}#root{min-height:100dvh}.app-layout{max-width:480px;min-height:100dvh;box-shadow:var(--shadow-lg);flex-direction:column;margin:0 auto;display:flex}.app-header{z-index:10;background:linear-gradient(135deg, var(--primary), #ff922b);color:#fff;text-align:center;height:var(--header-height);justify-content:center;align-items:center;padding:12px 16px;display:flex;position:sticky;top:0}.app-header h1{letter-spacing:-.3px;flex-direction:column;align-items:center;margin:0;font-size:20px;font-weight:700;line-height:1.2;display:flex}.title-main{font-size:20px;font-weight:700}.title-sub{opacity:.9;font-size:14px;font-weight:500}.app-main{padding:0 16px 16px;padding-bottom:calc(var(--nav-height) + 16px);flex:1}.score-banner{top:var(--header-height);z-index:9;background:var(--accent);color:var(--text-heading);text-align:center;height:var(--banner-height);justify-content:center;align-items:center;gap:4px;padding:10px 16px;font-size:15px;font-weight:500;display:flex;position:sticky}.bottom-nav{z-index:10;width:100%;max-width:480px;height:var(--nav-height);background:var(--bg-card);border-top:1px solid var(--border);display:flex;position:fixed;bottom:0;left:50%;transform:translate(-50%);box-shadow:0 -2px 8px #0000000f}.nav-tab{color:var(--text-light);flex-direction:column;flex:1;justify-content:center;align-items:center;gap:2px;min-height:44px;font-size:12px;font-weight:500;text-decoration:none;transition:color .15s;display:flex}.nav-tab.active{color:var(--primary)}.nav-icon{font-size:22px}.nav-label{text-transform:uppercase;letter-spacing:.5px;font-size:11px}.register-page{background:linear-gradient(135deg,#fff8f0 0%,#ffe8d6 100%);justify-content:center;align-items:center;min-height:100dvh;padding:24px;display:flex}.register-card{background:var(--bg-card);border-radius:var(--radius);box-shadow:var(--shadow-lg);text-align:center;width:100%;max-width:380px;padding:40px 32px}.register-card h1{color:var(--text-heading);flex-direction:column;align-items:center;margin:0 0 8px;font-size:24px;line-height:1.3;display:flex}.register-card .title-main{font-size:24px}.register-card .title-sub{font-size:16px}.register-info{text-align:left;background:var(--bg);border-radius:8px;margin:16px 0;padding:14px 16px}.register-info p{color:var(--text);margin:0 0 8px;font-size:14px;line-height:1.5}.register-info p:last-child{margin-bottom:0}.register-card p{color:var(--text-light);margin:0 0 24px;font-size:15px}.register-card form{flex-direction:column;gap:12px;display:flex}.register-card input{border:2px solid var(--border);border-radius:8px;outline:none;padding:14px 16px;font-size:16px;transition:border-color .15s}.register-card input:focus{border-color:var(--primary)}.register-card button{background:linear-gradient(135deg, var(--primary), #ff922b);color:#fff;cursor:pointer;border:none;border-radius:8px;min-height:44px;padding:14px;font-size:16px;font-weight:600;transition:opacity .15s}.register-card button:disabled{opacity:.5;cursor:not-allowed}.register-card button:not(:disabled):active{opacity:.85}.error{color:var(--primary);margin-top:8px;font-size:14px}.challenges-page{padding-top:12px}.challenge-list{flex-direction:column;gap:10px;display:flex}.challenge-card{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);cursor:pointer;-webkit-tap-highlight-color:transparent;-webkit-user-select:none;user-select:none;padding:14px 16px;transition:border-color .15s,box-shadow .15s,transform .1s}.challenge-card:active{transform:scale(.98)}.challenge-card.completed{border-color:var(--success);background:#f0faf2}.card-top{align-items:flex-start;gap:10px;display:flex}.card-check{flex-shrink:0;font-size:20px;line-height:1.2}.card-text{color:var(--text-heading);flex:1;font-size:15px;line-height:1.4}.card-points{color:var(--primary);white-space:nowrap;background:#ff6b6b1a;border-radius:20px;flex-shrink:0;padding:2px 8px;font-size:13px;font-weight:700}.challenge-card.completed .card-points{color:var(--success);background:#6bcb7726}.card-info{background:var(--bg);color:var(--text-light);border-radius:8px;margin-top:10px;padding:10px 12px;font-size:13px;line-height:1.5}.variable-input{border-top:1px solid var(--border);justify-content:center;align-items:center;gap:16px;margin-top:12px;padding-top:12px;display:flex}.stepper-btn{border:2px solid var(--border);background:var(--bg-card);width:44px;height:44px;color:var(--text-heading);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:50%;justify-content:center;align-items:center;font-size:20px;font-weight:700;transition:border-color .15s,background .15s;display:flex}.stepper-btn:active:not(:disabled){background:var(--border)}.stepper-btn:disabled{opacity:.3;cursor:not-allowed}.stepper-count{text-align:center;min-width:80px;color:var(--text-heading);font-size:16px;font-weight:600}.leaderboard-page{padding-top:12px}.leaderboard-loading,.leaderboard-empty{text-align:center;color:var(--text-light);padding:48px 16px;font-size:16px}.leaderboard-list{flex-direction:column;gap:8px;display:flex}.leaderboard-row{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);align-items:center;gap:12px;padding:14px 16px;transition:border-color .15s;display:flex}.leaderboard-row.is-me{border-color:var(--primary);background:#fff5f5}.lb-rank{text-align:center;min-width:36px;color:var(--text-heading);font-size:20px;font-weight:700}.lb-name{color:var(--text-heading);flex:1;font-size:16px;font-weight:500}.lb-you{color:var(--primary);font-size:13px;font-weight:400}.lb-score{color:var(--primary);font-size:15px;font-weight:700}.card-extras{margin-top:10px}.note-row{align-items:center;gap:8px;display:flex}.note-input{border:1px solid var(--border);color:var(--text);background:var(--bg);border-radius:8px;outline:none;flex:1;padding:8px 12px;font-family:inherit;font-size:14px;transition:border-color .15s}.note-input:focus{border-color:var(--success)}.note-input::placeholder{color:var(--text-light);font-style:italic}.photo-upload-btn{border:1px solid var(--border);background:var(--bg);cursor:pointer;-webkit-tap-highlight-color:transparent;border-radius:8px;flex-shrink:0;justify-content:center;align-items:center;width:38px;height:38px;font-size:18px;transition:background .15s;display:flex}.photo-upload-btn:active{background:var(--border)}.card-photo-thumbnail{object-fit:cover;cursor:pointer;border-radius:8px;max-height:120px;margin-top:8px}.feed-page{padding-top:12px}.feed-loading,.feed-empty{text-align:center;color:var(--text-light);padding:48px 16px;font-size:16px}.feed-list{flex-direction:column;gap:10px;display:flex}.feed-item{background:var(--bg-card);border:2px solid var(--border);border-radius:var(--radius);padding:14px 16px}.feed-item-header{justify-content:space-between;align-items:center;margin-bottom:4px;display:flex}.feed-player{color:var(--text-heading);font-size:15px;font-weight:700}.feed-time{color:var(--text-light);flex-shrink:0;font-size:12px}.feed-challenge{color:var(--text);font-size:14px;line-height:1.4}.feed-note{color:var(--text-light);margin-top:6px;font-size:13px;font-style:italic;line-height:1.4}.feed-photo{object-fit:cover;cursor:pointer;border-radius:8px;max-width:100%;margin-top:8px}.loading-screen{min-height:100dvh;color:var(--text-light);justify-content:center;align-items:center;font-size:16px;display:flex}
