:root{--bg: #0f172a;--bg2: #1e293b;--bg3: #334155;--text: #f1f5f9;--text2: #94a3b8;--accent: #8b5cf6;--accent2: #a78bfa;--green: #34d399;--orange: #fb923c;--pink: #f472b6;--blue: #60a5fa;--red: #f87171;--gold: #fbbf24;--radius: 16px;--radius-sm: 10px}*{margin:0;padding:0;box-sizing:border-box}html,body{background:var(--bg);color:var(--text);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;min-height:100vh;-webkit-tap-highlight-color:transparent;overflow-x:hidden}#app{max-width:500px;margin:0 auto;padding:16px 16px 100px}.login-page{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:90vh;gap:24px;text-align:center}.login-page h1{font-size:2rem;background:linear-gradient(135deg,var(--accent),var(--pink));-webkit-background-clip:text;-webkit-text-fill-color:transparent}.login-page .subtitle{color:var(--text2);font-size:.95rem}.login-cards{display:flex;flex-direction:column;gap:16px;width:100%;max-width:340px}.login-card{background:var(--bg2);border:2px solid transparent;border-radius:var(--radius);padding:24px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:16px;font-size:1.1rem;color:var(--text)}.login-card:active,.login-card:hover{border-color:var(--accent);transform:scale(1.03);background:var(--bg3)}.login-card .card-emoji{font-size:2.5rem}.pin-modal{position:fixed;inset:0;background:#000000b3;display:flex;align-items:center;justify-content:center;z-index:1000}.pin-box{background:var(--bg2);border-radius:var(--radius);padding:32px;text-align:center;width:300px}.pin-box h3{margin-bottom:16px}.pin-box input{background:var(--bg);border:2px solid var(--bg3);border-radius:var(--radius-sm);color:var(--text);font-size:2rem;text-align:center;letter-spacing:12px;width:100%;padding:12px;outline:none;-webkit-text-security:disc}.pin-box input:focus{border-color:var(--accent)}.pin-error{color:var(--red);font-size:.85rem;margin-top:8px;min-height:20px}.header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px}.header-left{display:flex;align-items:center;gap:12px}.header-left .avatar{width:48px;height:48px;background:linear-gradient(135deg,var(--accent),var(--pink));border-radius:50%;display:flex;align-items:center;justify-content:center;font-size:1.5rem}.header-left h2{font-size:1.2rem}.header-left .greeting{color:var(--text2);font-size:.85rem}.btn-logout{background:var(--bg3);border:none;color:var(--text2);padding:8px 14px;border-radius:var(--radius-sm);cursor:pointer;font-size:.85rem}.level-bar{background:var(--bg2);border-radius:var(--radius);padding:16px;margin-bottom:16px}.level-info{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.level-name{font-weight:700;font-size:1.05rem}.level-pts{color:var(--gold);font-weight:600}.progress-track{height:10px;background:var(--bg);border-radius:5px;overflow:hidden}.progress-fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--pink));border-radius:5px;transition:width .5s cubic-bezier(.34,1.56,.64,1)}.level-next{color:var(--text2);font-size:.8rem;margin-top:6px;text-align:right}.streak-banner{background:linear-gradient(135deg,var(--orange),var(--red));border-radius:var(--radius);padding:14px 20px;margin-bottom:16px;display:flex;align-items:center;gap:12px;font-weight:600}.streak-banner .streak-fire{font-size:1.8rem}.section-title{font-size:.85rem;text-transform:uppercase;letter-spacing:1px;color:var(--text2);margin-bottom:12px;margin-top:20px}.quick-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.action-btn{background:var(--bg2);border:2px solid var(--bg3);border-radius:var(--radius);padding:20px 12px;cursor:pointer;text-align:center;transition:all .15s;color:var(--text);position:relative;overflow:hidden}.action-btn:active{transform:scale(.95);border-color:var(--accent)}.action-btn .action-emoji{font-size:2rem;display:block;margin-bottom:6px}.action-btn .action-label{font-size:.85rem;font-weight:600}.action-btn .action-count{position:absolute;top:8px;right:10px;background:var(--accent);color:#fff;font-size:.75rem;font-weight:700;padding:2px 8px;border-radius:20px;min-width:24px}.action-btn.email{border-color:#60a5fa4d}.action-btn.email:active{border-color:var(--blue);background:#60a5fa1a}.action-btn.reponse{border-color:#34d3994d}.action-btn.reponse:active{border-color:var(--green);background:#34d3991a}.action-btn.adresse{border-color:#fbbf244d}.action-btn.adresse:active{border-color:var(--gold);background:#fbbf241a}.action-btn.rdv{border-color:#f472b64d}.action-btn.rdv:active{border-color:var(--pink);background:#f472b61a}.today-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin-bottom:16px}.today-stat{background:var(--bg2);border-radius:var(--radius-sm);padding:12px 8px;text-align:center}.today-stat .stat-value{font-size:1.5rem;font-weight:700}.today-stat .stat-label{font-size:.7rem;color:var(--text2);margin-top:2px}.week-chart{background:var(--bg2);border-radius:var(--radius);padding:16px;margin-bottom:16px}.week-bars{display:flex;justify-content:space-between;align-items:flex-end;height:100px;gap:6px;margin-top:12px}.week-day{flex:1;display:flex;flex-direction:column;align-items:center;gap:4px}.week-day .bar{width:100%;max-width:36px;background:linear-gradient(180deg,var(--accent),var(--pink));border-radius:4px 4px 0 0;min-height:4px;transition:height .3s}.week-day .day-label{font-size:.7rem;color:var(--text2)}.badges-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:8px}.badge-item{text-align:center;padding:10px 4px;border-radius:var(--radius-sm);background:var(--bg2);transition:all .2s}.badge-item.locked{opacity:.3;filter:grayscale(1)}.badge-item .badge-emoji{font-size:1.5rem}.badge-item .badge-name{font-size:.6rem;color:var(--text2);margin-top:4px}.undo-toast{position:fixed;bottom:24px;left:50%;transform:translate(-50%);background:var(--bg3);color:var(--text);padding:10px 20px;border-radius:30px;font-size:.9rem;z-index:999;display:flex;gap:12px;align-items:center;box-shadow:0 4px 20px #0006;animation:slide-up .3s ease}.undo-toast button{background:var(--accent);border:none;color:#fff;padding:4px 14px;border-radius:20px;cursor:pointer;font-weight:600}@keyframes slide-up{0%{transform:translate(-50%) translateY(40px);opacity:0}to{transform:translate(-50%) translateY(0);opacity:1}}.pulse-celebrate{animation:pulse .6s ease}@keyframes pulse{0%{transform:scale(1)}30%{transform:scale(1.2)}60%{transform:scale(.95)}to{transform:scale(1)}}.points-popup{position:fixed;top:40%;left:50%;transform:translate(-50%,-50%) scale(.5);font-size:3rem;font-weight:900;color:var(--gold);z-index:999;pointer-events:none;animation:points-fly .8s ease forwards;text-shadow:0 2px 10px rgba(251,191,36,.5)}@keyframes points-fly{0%{transform:translate(-50%,-50%) scale(.5);opacity:0}30%{transform:translate(-50%,-60%) scale(1.2);opacity:1}to{transform:translate(-50%,-120%) scale(.8);opacity:0}}.activity-log{background:var(--bg2);border-radius:var(--radius);padding:16px}.log-item{display:flex;align-items:center;gap:10px;padding:8px 0;border-bottom:1px solid var(--bg3);font-size:.85rem}.log-item:last-child{border-bottom:none}.log-item .log-emoji{font-size:1.2rem}.log-item .log-time{color:var(--text2);margin-left:auto;font-size:.75rem}.log-item .log-pts{color:var(--gold);font-weight:600;font-size:.8rem}.empty-state{text-align:center;padding:40px 20px;color:var(--text2)}.empty-state .empty-emoji{font-size:3rem;margin-bottom:12px}