:root{--text: #6b6375;--text-h: #08060d;--bg: #fff;--border: #e5e4e7;--code-bg: #f4f3ec;--accent: #aa3bff;--accent-bg: rgba(170, 59, 255, .1);--accent-border: rgba(170, 59, 255, .5);--social-bg: rgba(244, 243, 236, .5);--shadow: rgba(0, 0, 0, .1) 0 10px 15px -3px, rgba(0, 0, 0, .05) 0 4px 6px -2px;--safe-area-top: env(safe-area-inset-top, 0px);--safe-area-bottom: env(safe-area-inset-bottom, 0px);--safe-area-left: env(safe-area-inset-left, 0px);--safe-area-right: env(safe-area-inset-right, 0px);--sans: system-ui, "Segoe UI", Roboto, sans-serif;--heading: system-ui, "Segoe UI", Roboto, sans-serif;--mono: ui-monospace, Consolas, monospace;font:16px/145% var(--sans);letter-spacing:.18px;color-scheme:light dark;color:var(--text);background:var(--bg);font-synthesis:none;text-rendering:optimizeLegibility;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}button,a,[role=button],input[type=submit],input[type=button]{transition:transform .15s ease}button:active,a:active,[role=button]:active,input[type=submit]:active,input[type=button]:active{transform:scale(.96)}@media(prefers-color-scheme:dark){:root{--text: #9ca3af;--text-h: #f3f4f6;--bg: #16171d;--border: #2e303a;--code-bg: #1f2028;--accent: #c084fc;--accent-bg: rgba(192, 132, 252, .15);--accent-border: rgba(192, 132, 252, .5);--social-bg: rgba(47, 48, 58, .5);--shadow: rgba(0, 0, 0, .4) 0 10px 15px -3px, rgba(0, 0, 0, .25) 0 4px 6px -2px}.stat-item{background:#c084fc1a}.calendar-day:hover{background:#c084fc26}.calendar-day.today{background:#c084fc33}.day-run-card{background:#c084fc26}.modal-content{background:#16171d}.modal-form input{background:#1f2028;border-color:#2e303a;color:#f3f4f6}#social .button-icon{filter:invert(1) brightness(2)}}#root{width:100%;max-width:100%;margin:0 auto;display:flex;flex-direction:column;box-sizing:border-box;overflow-x:hidden}html,body{margin:0;overflow-x:hidden;touch-action:manipulation}h1,h2{font-family:var(--heading);font-weight:500;color:var(--text-h)}h1{font-size:56px;letter-spacing:-1.68px;margin:32px 0}@media(max-width:1024px){h1{font-size:36px;margin:20px 0}}h2{font-size:24px;line-height:118%;letter-spacing:-.24px;margin:0 0 8px}@media(max-width:1024px){h2{font-size:20px}}p{margin:0}code,.counter{font-family:var(--mono);display:inline-flex;border-radius:4px;color:var(--text-h)}code{font-size:15px;line-height:135%;padding:4px 8px;background:var(--code-bg)}.app{max-width:600px;margin:0 auto;padding:20px;padding-top:calc(20px + var(--safe-area-top));padding-bottom:calc(20px + var(--safe-area-bottom));padding-left:calc(20px + var(--safe-area-left));padding-right:calc(20px + var(--safe-area-right));font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif}.header{text-align:center;margin-bottom:30px}.header h1{font-size:2rem;color:#333;margin-bottom:5px}.header p{color:#666;margin:0}.stats{display:grid;grid-template-columns:repeat(3,1fr);gap:15px;margin-bottom:30px}.stat-card{background:#f8f9fa;border-radius:12px;padding:15px;text-align:center}.stat-card h3{font-size:.75rem;color:#666;margin:0 0 5px;text-transform:uppercase}.stat-value{font-size:1.25rem;font-weight:700;color:#333;margin:0}.runs-list h2{font-size:1.25rem;margin-bottom:15px}.run-card{background:#fff;border:1px solid #e1e4e8;border-radius:12px;padding:15px;margin-bottom:10px}.run-date{font-size:.875rem;color:#666;margin-bottom:8px}.run-details{display:flex;gap:20px}.run-details span{font-size:.9rem}.distance{font-weight:600;color:#333}.duration{color:#666}.pace{color:#007bff}.auth-container{max-width:400px;margin:0 auto;padding:20px;padding-top:calc(20px + var(--safe-area-top));padding-bottom:calc(20px + var(--safe-area-bottom));padding-left:calc(20px + var(--safe-area-left));padding-right:calc(20px + var(--safe-area-right))}.auth-form{display:flex;flex-direction:column;gap:15px}.form-group{display:flex;flex-direction:column;gap:5px;text-align:left}.form-group label{font-size:.875rem;color:var(--text)}.form-group input{padding:10px;border:1px solid var(--border);border-radius:8px;font-size:1rem}.btn{padding:10px 20px;border:none;border-radius:8px;font-size:1rem;cursor:pointer;text-decoration:none;display:inline-block}.btn-primary{background:var(--accent);color:#fff}.btn-secondary{background:var(--border);color:var(--text-h)}.auth-links{margin-top:15px;font-size:.875rem}.auth-links a{color:var(--accent)}nav{display:flex;gap:20px;justify-content:center;padding:10px 0;margin-bottom:20px}nav a{color:var(--text);text-decoration:none}nav a:hover{color:var(--accent)}.add-run-form{display:flex;flex-direction:column;gap:15px;max-width:400px;margin:0 auto}.error-message{color:#dc3545;font-size:.875rem}.mobile-app{padding-top:var(--safe-area-top);padding-bottom:var(--safe-area-bottom);padding-left:var(--safe-area-left);padding-right:var(--safe-area-right);background:var(--bg);display:flex;flex-direction:column;box-sizing:border-box;overflow-x:hidden;min-height:100vh;width:100%;position:relative}.safe-area-bg{position:fixed;top:0;left:0;right:0;height:var(--safe-area-top);background:var(--bg);z-index:1000;transition:background-color .3s ease}.mobile-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;background:var(--bg);border-bottom:1px solid var(--border);position:sticky;top:0;z-index:100;gap:8px}.mobile-header h1{flex:1;text-align:center;font-size:1.1rem;margin:0;color:var(--text-h)}.header-actions{display:flex;align-items:center;gap:8px}.settings-link{font-size:1.25rem;text-decoration:none;padding:8px;border-radius:8px;transition:background .2s}.settings-link:hover{background:var(--accent-bg)}.logout-btn{background:transparent;border:none;color:var(--accent);font-size:.875rem;cursor:pointer;padding:8px 12px;border-radius:8px}.logout-btn:hover{background:var(--accent-bg)}.stats-bar{display:grid;grid-template-columns:repeat(3,1fr);gap:8px;padding:16px;background:var(--bg)}.stat-item{text-align:center;padding:12px 8px;background:var(--accent-bg);border-radius:12px}.stat-item .label{font-size:.7rem;color:var(--text);text-transform:uppercase;margin-bottom:4px}.stat-item .value{font-size:1.1rem;font-weight:600;color:var(--text-h)}.stat-item.withdraw-stat{cursor:pointer;border:none;width:100%;transition:transform .15s ease,background .15s ease}.stat-item.withdraw-stat:active{transform:scale(.96)}.stats-bar.monthly-stats{padding-top:0;background:transparent}.stats-bar.monthly-stats .stat-item{background:var(--bg);border:1px solid var(--border)}.stats-bar.monthly-stats .stat-item .label{font-size:.65rem}.stats-bar.monthly-stats .stat-item .value{font-size:1rem}.calendar-container{flex:1;min-height:0;padding:16px;overflow:visible}.calendar-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.calendar-header h2{font-size:1.125rem;margin:0}.month-nav{display:flex;gap:8px}.month-nav button{background:var(--border);border:none;width:36px;height:36px;border-radius:50%;font-size:1.25rem;cursor:pointer;display:flex;align-items:center;justify-content:center;color:var(--text-h);line-height:1;padding:0 0 2px}.month-nav button:hover{background:var(--accent-bg);color:var(--accent)}.calendar-weekdays{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;margin-bottom:8px}.calendar-weekdays span{font-size:.75rem;color:var(--text);padding:8px 0;font-weight:500}.calendar-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:4px;overflow:visible}.calendar-day{aspect-ratio:1;display:flex;flex-direction:column;align-items:center;justify-content:center;border-radius:12px;cursor:pointer;position:relative;background:transparent;border:none;font-size:.875rem;color:var(--text-h);transition:background .2s}.calendar-day:hover{background:var(--accent-bg)}.calendar-day.other-month{color:var(--border)}.calendar-day.today{background:var(--accent-bg);font-weight:600}.calendar-day.has-run:after{display:none}.calendar-day .day-distance{font-size:.65rem;color:var(--accent);font-weight:600;margin-top:2px}.calendar-day .day-runs{display:flex;flex-wrap:wrap;gap:2px;justify-content:center;margin-top:2px;max-width:100%}.calendar-day .run-indicator{font-size:.55rem;color:#fff;padding:1px 4px;border-radius:4px;line-height:1.2;min-width:18px;text-align:center}.calendar-day .run-indicator.more{background:var(--text);opacity:.7}.calendar-legend{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px;padding:12px;background:var(--code-bg);border-radius:12px;justify-content:center}.legend-item{display:flex;align-items:center;gap:4px;font-size:.75rem;color:var(--text)}.legend-item.my-run{font-weight:600;color:var(--text-h)}.legend-dot{width:8px;height:8px;border-radius:50%}.add-run-fab{position:fixed;bottom:calc(20px + var(--safe-area-bottom));right:calc(20px + var(--safe-area-right));width:56px;height:56px;border-radius:50%;background:var(--accent);color:#fff;border:none;font-size:1.5rem;cursor:pointer;box-shadow:var(--shadow);display:flex;align-items:center;justify-content:center;z-index:50}.add-run-fab:hover{transform:scale(1.05)}.modal-overlay{position:fixed;inset:0;background:#00000080;display:flex;align-items:flex-end;justify-content:center;z-index:200;padding-bottom:var(--safe-area-bottom)}.modal-content{background:var(--bg);width:100%;max-width:500px;border-radius:20px 20px 0 0;padding:24px 20px;padding-bottom:calc(24px + var(--safe-area-bottom));max-height:90vh;overflow-y:auto;animation:slideUp .3s ease}@keyframes slideUp{0%{transform:translateY(100%)}to{transform:translateY(0)}}.modal-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px}.modal-header h3{font-size:1.125rem;margin:0;color:var(--text-h)}.modal-close{background:transparent;border:none;font-size:1.5rem;color:var(--text);cursor:pointer;padding:4px;line-height:1}.modal-form{display:flex;flex-direction:column;gap:16px}.modal-form .form-group{gap:8px}.modal-form input{width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--border);border-radius:12px;font-size:1rem;background:var(--bg);color:var(--text-h)}.modal-form input:focus{outline:none;border-color:var(--accent)}.modal-form .btn-primary{padding:14px;font-size:1rem;font-weight:600;margin-top:8px}.day-detail{margin-top:16px}.day-run-card{background:var(--accent-bg);border-radius:12px;padding:16px;margin-bottom:12px}.day-run-card .distance{font-size:1.25rem;font-weight:600;color:var(--accent)}.day-run-card .details{display:flex;gap:16px;margin-top:8px;font-size:.875rem;color:var(--text)}.empty-day{text-align:center;padding:20px;color:var(--text)}.empty-day p{margin-bottom:12px}.date-detail-container{flex:1;padding:16px;overflow-y:auto}.date-header{margin-bottom:20px}.date-header h2{font-size:1.125rem;margin:0 0 8px;color:var(--text-h)}.date-summary{font-size:.875rem;color:var(--text)}.back-link{color:var(--accent);text-decoration:none;font-size:.875rem;padding:8px 12px;border-radius:8px;white-space:nowrap}.back-link:hover{background:var(--accent-bg)}.settings-container{flex:1;min-height:0;padding:16px;overflow-y:auto;overflow-x:hidden}.settings-form{display:flex;flex-direction:column;gap:16px;max-width:400px;width:100%;box-sizing:border-box;margin-bottom:32px}.settings-form .form-group{gap:8px}.settings-form input{width:100%;max-width:100%;box-sizing:border-box;padding:12px;border:1px solid var(--border);border-radius:12px;font-size:1rem;background:var(--bg);color:var(--text-h);-webkit-appearance:none;appearance:none}.settings-form input[type=date]{min-width:0}.settings-form input:focus{outline:none;border-color:var(--accent)}.form-hint{font-size:.75rem;color:var(--text);margin:4px 0 0}.success-message{color:#10b981;font-size:.875rem;padding:8px 12px;background:#10b9811a;border-radius:8px}.settings-info{margin-top:24px}.settings-info h3{font-size:1rem;color:var(--text-h);margin-bottom:12px}.settings-table{width:100%;border-collapse:collapse;font-size:.875rem}.settings-table th,.settings-table td{padding:10px 12px;text-align:left;border-bottom:1px solid var(--border)}.settings-table th{font-weight:600;color:var(--text-h);background:var(--code-bg)}.settings-table td{color:var(--text)}.withdraw-container{flex:1;padding:16px;overflow-y:auto}.current-balance{background:var(--accent-bg);border-radius:16px;padding:24px;text-align:center;margin-bottom:24px}.balance-label{font-size:.875rem;color:var(--text);margin-bottom:8px}.balance-value{font-size:2rem;font-weight:700;color:var(--accent)}.withdraw-form{display:flex;flex-direction:column;gap:16px}.withdraw-form .form-group input{width:100%;box-sizing:border-box;padding:14px;border:1px solid var(--border);border-radius:12px;font-size:1.125rem;background:var(--bg);color:var(--text-h)}.withdraw-form .form-group input:focus{outline:none;border-color:var(--accent)}.withdraw-btn{padding:16px;font-size:1rem;font-weight:600;margin-top:8px}.withdraw-btn:disabled{opacity:.6;cursor:not-allowed}.history-btn{width:100%;margin-bottom:16px}.history-container{flex:1;padding:16px;overflow-y:auto}.history-summary{margin-bottom:24px}.summary-item.current{background:var(--accent-bg);border-radius:16px;padding:20px;text-align:center;margin-bottom:12px}.summary-item .summary-label{font-size:.8rem;color:var(--text);margin-bottom:4px}.summary-item .summary-value{font-size:1.75rem;font-weight:700;color:var(--accent)}.summary-row{display:grid;grid-template-columns:1fr 1fr;gap:12px}.summary-item.earn{background:#22c55e1a;border-radius:12px;padding:16px;text-align:center}.summary-item.earn .summary-value{color:#22c55e;font-size:1.25rem}.summary-item.withdraw{background:#ef44441a;border-radius:12px;padding:16px;text-align:center}.summary-item.withdraw .summary-value{color:#ef4444;font-size:1.25rem}.history-list h3{font-size:1rem;color:var(--text-h);margin-bottom:12px}.empty-history{text-align:center;padding:40px 20px;color:var(--text);font-size:.875rem}.history-item{display:flex;justify-content:space-between;align-items:center;padding:14px 16px;background:var(--code-bg);border-radius:12px;margin-bottom:8px}.history-item.earn{border-left:4px solid #22c55e}.history-item.withdraw{border-left:4px solid #ef4444}.history-left{display:flex;flex-direction:column;gap:4px}.history-type{font-weight:600;color:var(--text-h);font-size:.9rem}.history-date{font-size:.75rem;color:var(--text)}.history-right{text-align:right;display:flex;flex-direction:column;gap:4px}.history-amount{font-weight:700;font-size:1rem}.history-item.earn .history-amount{color:#22c55e}.history-item.withdraw .history-amount{color:#ef4444}.history-balance{font-size:.75rem;color:var(--text)}