:root{
  --bg:#0f0e17;--surface:#1a1826;--surface2:#232133;--border:#312f4a;
  --text:#f0eeff;--muted:#7a7898;--accent:#7c5cbf;--gold:#f5c842;--gold-dark:#c9962a;
  --red:#ff4d6d;--red-bg:#2e0a14;--green:#6dff9e;--green-bg:#0a2818;--orange:#ffad42;
  --radius:12px;--pixel:'Press Start 2P',monospace;--body:'Nunito',sans-serif;
}
*{box-sizing:border-box;margin:0;padding:0;}
body{background:var(--bg);color:var(--text);font-family:var(--body);min-height:100vh;
  background-image:radial-gradient(ellipse at 20% 10%,#1e1340 0%,transparent 50%),
                   radial-gradient(ellipse at 80% 90%,#130d2a 0%,transparent 50%);}
.stars{position:fixed;inset:0;pointer-events:none;z-index:0;overflow:hidden;}
.star{position:absolute;border-radius:50%;background:white;animation:twinkle var(--d,3s) ease-in-out infinite;animation-delay:var(--delay,0s);}
@keyframes twinkle{0%,100%{opacity:.1}50%{opacity:.7}}
.app{max-width:980px;margin:0 auto;padding:1.5rem 1rem 5rem;position:relative;z-index:1;}

/* AUTH */
#authScreen{position:fixed;inset:0;z-index:100;display:flex;align-items:center;justify-content:center;
  background:var(--bg);background-image:radial-gradient(ellipse at 30% 20%,#1e1340 0%,transparent 60%),radial-gradient(ellipse at 70% 80%,#130d2a 0%,transparent 60%);}
.auth-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:2rem 2.5rem;width:100%;max-width:380px;text-align:center;}
.auth-logo{font-family:var(--pixel);font-size:1.1rem;color:var(--gold);text-shadow:0 0 16px #f5c84255;letter-spacing:2px;margin-bottom:.4rem;}
.auth-sub{color:var(--muted);font-size:.78rem;font-weight:600;margin-bottom:1.75rem;}
.auth-tabs{display:flex;gap:.4rem;margin-bottom:1.25rem;}
.auth-tab{flex:1;background:var(--surface2);border:1px solid var(--border);color:var(--muted);border-radius:8px;padding:.4rem;font-family:var(--body);font-weight:700;font-size:.82rem;cursor:pointer;transition:all .2s;}
.auth-tab.active{background:var(--accent);border-color:var(--accent);color:white;}
.auth-field{display:flex;flex-direction:column;gap:.3rem;margin-bottom:.85rem;text-align:left;}
.auth-field label{font-size:.72rem;font-weight:700;color:var(--muted);}
.auth-field input{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:.5rem .75rem;font-family:var(--body);font-size:.9rem;outline:none;transition:border-color .2s;}
.auth-field input:focus{border-color:var(--accent);}
.btn-auth{width:100%;background:var(--accent);color:white;border:none;border-radius:8px;padding:.6rem;font-family:var(--body);font-weight:800;font-size:.9rem;cursor:pointer;box-shadow:0 4px 0 #4a2f90;transition:transform .1s,box-shadow .2s;margin-top:.25rem;}
.btn-auth:hover{transform:translateY(-2px);box-shadow:0 6px 0 #4a2f90;}
.btn-auth:active{transform:translateY(2px);box-shadow:0 2px 0 #4a2f90;}
.auth-err{color:var(--red);font-size:.78rem;font-weight:700;margin-top:.6rem;min-height:1.2em;}
.auth-info{color:var(--muted);font-size:.7rem;margin-top:.75rem;line-height:1.5;}

/* TOPBAR */
.topbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:1.5rem;flex-wrap:wrap;gap:.5rem;}
.topbar-user{display:flex;align-items:center;gap:.5rem;}
.user-avatar{width:30px;height:30px;border-radius:50%;background:var(--accent);display:flex;align-items:center;justify-content:center;font-family:var(--pixel);font-size:.55rem;color:white;}
.user-name{font-weight:800;font-size:.88rem;}
.topbar-right{display:flex;align-items:center;gap:.6rem;flex-wrap:wrap;}
.btn-sm{background:none;border:1px solid var(--border);color:var(--muted);border-radius:7px;padding:.25rem .65rem;font-family:var(--body);font-weight:700;font-size:.75rem;cursor:pointer;transition:all .15s;}
.btn-sm:hover{border-color:var(--accent);color:var(--text);}
.btn-sm.danger:hover{border-color:var(--red);color:var(--red);}
.sync-status{font-size:.68rem;font-weight:700;color:var(--muted);display:flex;align-items:center;gap:.3rem;}
.sync-dot{width:7px;height:7px;border-radius:50%;background:var(--green);}
.sync-dot.syncing{background:var(--gold);animation:syncPulse .7s ease-in-out infinite;}
.sync-dot.error{background:var(--red);}
@keyframes syncPulse{0%,100%{opacity:.4}50%{opacity:1}}

header{text-align:center;margin-bottom:1.5rem;}
.logo{font-family:var(--pixel);font-size:1.3rem;color:var(--gold);text-shadow:0 0 20px #f5c84266,3px 3px 0 #7c3d0066;letter-spacing:2px;line-height:1.5;margin-bottom:.3rem;}
.tagline{color:var(--muted);font-size:.78rem;font-weight:600;}
.week-badge{display:inline-block;margin-top:.5rem;background:var(--surface2);border:1px solid var(--border);border-radius:99px;padding:.22rem .8rem;font-size:.72rem;font-weight:700;color:var(--muted);}
.week-badge span{color:var(--text);}

.status-bar{display:flex;align-items:center;justify-content:center;gap:.55rem;margin-bottom:1.1rem;flex-wrap:wrap;}
.stat-pill{display:flex;align-items:center;gap:.32rem;border-radius:99px;padding:.28rem .82rem;font-family:var(--pixel);font-size:.54rem;border:2px solid;}
.stat-pill.gold{background:var(--surface);border-color:var(--gold-dark);color:var(--gold);box-shadow:0 0 8px #f5c84222;}
.stat-pill.purple{background:var(--surface);border-color:var(--accent);color:#d4b8ff;}
.stat-pill.red{background:var(--red-bg);border-color:var(--red);color:var(--red);animation:redPulse 2s ease-in-out infinite;}
.stat-pill.gray{background:var(--surface);border-color:var(--border);color:var(--muted);}
.stat-pill.neg{background:#1a0a0e;border-color:#c0203a;color:#ff6b88;}
@keyframes redPulse{0%,100%{box-shadow:0 0 0 0 #ff4d6d33}50%{box-shadow:0 0 10px 2px #ff4d6d33}}
.coin-icon{display:inline-block;animation:spin 4s linear infinite;}
@keyframes spin{0%{transform:rotateY(0)}100%{transform:rotateY(360deg)}}

.penalty-banner{background:var(--red-bg);border:2px solid var(--red);border-radius:var(--radius);padding:.85rem 1.1rem;margin-bottom:1rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;}
.pb-text{font-weight:700;font-size:.83rem;line-height:1.55;}
.pb-text .px{color:var(--red);font-family:var(--pixel);font-size:.58rem;}
.btn-pay{background:var(--red);color:white;border:none;border-radius:8px;padding:.38rem .85rem;font-family:var(--body);font-weight:800;font-size:.78rem;cursor:pointer;box-shadow:0 3px 0 #991130;transition:transform .1s;}
.btn-pay:hover{transform:translateY(-1px);}
.btn-pay:disabled{opacity:.4;cursor:not-allowed;transform:none;}

.card{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem 1.35rem;margin-bottom:1rem;}
.card-title{font-family:var(--pixel);font-size:.56rem;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-bottom:.85rem;}

.budget-bar-wrap{background:var(--surface2);border-radius:99px;height:9px;overflow:hidden;margin:.4rem 0;}
.budget-bar-fill{height:100%;border-radius:99px;transition:width .4s,background .3s;}
.budget-info{display:flex;justify-content:space-between;font-size:.7rem;font-weight:700;color:var(--muted);}
.stats-section{margin-top:1.1rem;}
.stats-subtitle{font-size:.82rem;font-weight:800;color:var(--text);margin-bottom:.6rem;}
.stat-row{margin-bottom:.65rem;}
.stat-row-head{display:flex;justify-content:space-between;gap:.5rem;font-size:.74rem;font-weight:700;margin-bottom:.28rem;}
.stat-row-name{color:var(--text);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;}
.stat-row-val{color:var(--muted);flex-shrink:0;}

/* FORM */
.add-form{display:flex;gap:.55rem;flex-wrap:wrap;align-items:flex-end;}
.field{display:flex;flex-direction:column;gap:.26rem;}
.field label{font-size:.68rem;font-weight:700;color:var(--muted);}
.field input,.field select{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:.4rem .6rem;font-family:var(--body);font-size:.82rem;outline:none;transition:border-color .2s;}
.field input:focus,.field select:focus{border-color:var(--accent);}
.field input[type="number"]{width:80px;}
.field input[type="text"]{min-width:130px;}
.field select{min-width:108px;}
.btn-add{background:var(--accent);color:white;border:none;border-radius:8px;padding:.44rem .9rem;font-family:var(--body);font-weight:800;font-size:.82rem;cursor:pointer;box-shadow:0 3px 0 #4a2f90;white-space:nowrap;align-self:flex-end;transition:transform .1s,box-shadow .2s;}
.btn-add:hover{transform:translateY(-2px);box-shadow:0 5px 0 #4a2f90;}
.btn-add:active{transform:translateY(2px);box-shadow:0 2px 0 #4a2f90;}

/* TOGGLE */
.toggle-wrap{display:flex;align-items:center;gap:.36rem;cursor:pointer;padding:.34rem 0;user-select:none;}
.toggle-wrap input{display:none;}
.toggle-track{width:32px;height:18px;border-radius:99px;background:var(--surface2);border:1px solid var(--border);position:relative;transition:background .2s,border-color .2s;flex-shrink:0;}
.toggle-thumb{position:absolute;top:3px;left:3px;width:10px;height:10px;border-radius:50%;background:var(--muted);transition:transform .2s,background .2s;}
.toggle-wrap input:checked~.toggle-track{background:#3a2060;border-color:var(--accent);}
.toggle-wrap input:checked~.toggle-track .toggle-thumb{transform:translateX(14px);background:var(--accent);}
.toggle-label{font-size:.75rem;font-weight:700;color:var(--muted);min-width:22px;}
.toggle-label.on{color:var(--accent);}

/* BADGES */
.prio-badge{font-size:.56rem;font-weight:700;padding:.1rem .38rem;border-radius:99px;border:1px solid;white-space:nowrap;}
.prio-hoch{color:#ff4d6d;border-color:#ff4d6d;background:#2e0a1499;}
.prio-mittel{color:#ffad42;border-color:#ffad42;background:#2e1a0099;}
.prio-niedrig{color:#6dff9e;border-color:#6dff9e;background:#0a281899;}
.cat-chip{display:inline-flex;align-items:center;gap:.2rem;font-size:.6rem;font-weight:700;padding:.1rem .4rem;border-radius:99px;border:1px solid;white-space:nowrap;}
.waste-badge{font-size:.56rem;font-weight:700;padding:.1rem .38rem;border-radius:99px;border:1px solid;white-space:nowrap;color:var(--red);border-color:var(--red);background:var(--red-bg);}
.prod-badge{font-size:.56rem;font-weight:700;padding:.1rem .38rem;border-radius:99px;border:1px solid;white-space:nowrap;color:var(--green);border-color:var(--green);background:var(--green-bg);}
.neutral-badge{font-size:.56rem;font-weight:700;padding:.1rem .38rem;border-radius:99px;border:1px solid;white-space:nowrap;color:var(--muted);border-color:var(--muted);background:var(--surface2);}
.rec-badge{font-size:.54rem;font-weight:700;padding:.1rem .38rem;border-radius:99px;background:#3a2060;color:var(--accent);border:1px solid var(--accent);white-space:nowrap;}
.rec-badge.off{background:none;border-color:var(--border);color:var(--muted);}

/* TASK ITEMS */
.tasks-empty{text-align:center;padding:1.6rem;color:var(--muted);font-size:.8rem;font-weight:600;line-height:1.6;}
.task-item{border:1px solid var(--border);border-radius:var(--radius);padding:.85rem 1.05rem .85rem 1.05rem;margin-bottom:.7rem;position:relative;overflow:hidden;transition:transform .15s;}
.task-item:hover{transform:translateY(-1px);}
.task-del-btn{position:absolute;top:.5rem;right:.5rem;background:none;border:1px solid transparent;color:var(--muted);border-radius:6px;width:24px;height:24px;font-size:.75rem;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .15s;z-index:2;}
.task-del-btn:hover{border-color:#3d2020;background:#3d2020;color:#c05050;}
.task-accent{position:absolute;left:0;top:0;bottom:0;width:4px;border-radius:4px 0 0 4px;}
.task-header{display:flex;align-items:flex-start;justify-content:space-between;gap:.5rem;flex-wrap:wrap;margin-bottom:.6rem;}
.task-name-row{font-weight:800;font-size:.9rem;display:flex;align-items:center;gap:.35rem;flex-wrap:wrap;}
.task-meta{display:flex;align-items:center;gap:.28rem;flex-wrap:wrap;margin-top:.25rem;}
.task-actions{display:flex;gap:.3rem;align-items:center;flex-wrap:wrap;}
.btn-log{font-family:var(--body);font-size:.72rem;font-weight:700;padding:.22rem .6rem;border-radius:7px;border:none;cursor:pointer;transition:opacity .15s,transform .1s;white-space:nowrap;}
.btn-log:hover{opacity:.85;transform:scale(1.03);}
.btn-icon{background:none;border:1px solid var(--border);color:var(--muted);border-radius:7px;padding:.2rem .46rem;font-size:.74rem;cursor:pointer;transition:background .15s,color .15s,border-color .15s;}
.btn-icon:hover{background:var(--surface2);color:var(--text);}
.btn-icon.del:hover{border-color:#3d2020;background:#3d2020;color:#c05050;}
.btn-icon.active-green{border-color:var(--green);color:var(--green);background:var(--green-bg);}
.btn-icon.done-check{border-color:var(--gold);color:var(--gold);background:#2a2000;}

/* PROGRESS */
.progress-wrap{height:14px;background:var(--surface2);border-radius:99px;overflow:hidden;position:relative;margin-bottom:.3rem;}
.progress-fill{height:100%;border-radius:99px;transition:width .5s cubic-bezier(.4,0,.2,1);position:relative;overflow:hidden;}
.progress-fill::after{content:'';position:absolute;inset:0;background:linear-gradient(90deg,transparent,rgba(255,255,255,.2),transparent);animation:shimmer 2s linear infinite;}
@keyframes shimmer{0%{transform:translateX(-100%)}100%{transform:translateX(100%)}}
.progress-labels{display:flex;justify-content:space-between;font-size:.68rem;font-weight:700;color:var(--muted);}
/* Overtime bar for waste tasks */
.overtime-bar-wrap{height:7px;background:#2e0a14;border-radius:99px;overflow:hidden;margin-top:.25rem;}
.overtime-bar-fill{height:100%;background:var(--red);border-radius:99px;transition:width .5s;}

/* TIMER */
.timer-display{font-family:var(--pixel);font-size:.9rem;color:var(--gold);letter-spacing:2px;padding:.3rem .6rem;background:var(--surface2);border-radius:8px;border:1px solid var(--border);min-width:90px;text-align:center;}
.timer-display.running{color:var(--green);border-color:var(--green);animation:timerGlow .8s ease-in-out infinite;}
@keyframes timerGlow{0%,100%{box-shadow:0 0 0 0 #6dff9e22}50%{box-shadow:0 0 8px 2px #6dff9e33}}

/* LOG & EDIT PANELS */
.log-panel{display:none;margin-top:.6rem;border-top:1px solid var(--border);padding-top:.6rem;}
.log-panel.open{display:block;}
.edit-panel{display:none;margin-top:.6rem;border-top:1px solid var(--border);padding-top:.6rem;}
.edit-panel.open{display:block;}
.log-row{display:flex;gap:.4rem;align-items:center;flex-wrap:wrap;margin-bottom:.5rem;}
.log-row input{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:.32rem .52rem;font-family:var(--body);font-size:.78rem;width:85px;outline:none;}
.log-row input:focus{border-color:var(--accent);}
.btn-submit{font-family:var(--body);font-weight:800;font-size:.72rem;padding:.32rem .72rem;border-radius:7px;border:none;cursor:pointer;color:var(--bg);transition:transform .1s;}
.btn-submit:hover{transform:scale(1.04);}
.log-history{margin-top:.45rem;display:flex;flex-wrap:wrap;gap:.24rem;}
.log-chip{font-size:.64rem;font-weight:700;padding:.13rem .4rem;border-radius:99px;background:var(--surface2);color:var(--muted);border:1px solid var(--border);display:flex;align-items:center;gap:.2rem;}
.chip-del{cursor:pointer;color:#c05050;font-size:.7rem;line-height:1;}
.edit-row{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.55rem .5rem;align-items:end;}
.edit-row .field{min-width:0;}
.edit-row .field input,.edit-row .field select{width:100%;}
.btn-save-edit{font-family:var(--body);font-weight:800;font-size:.73rem;padding:.33rem .72rem;border-radius:7px;border:none;cursor:pointer;background:var(--accent);color:white;box-shadow:0 2px 0 #4a2f90;transition:transform .1s;align-self:flex-end;white-space:nowrap;}
.btn-save-edit:hover{transform:translateY(-1px);}

/* GOALS */
.goals-list{display:flex;flex-direction:column;gap:.65rem;margin-bottom:1rem;}
.goal-item{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:.85rem 1rem;}
.goal-header{display:flex;align-items:center;justify-content:space-between;gap:.5rem;margin-bottom:.5rem;flex-wrap:wrap;}
.goal-name{font-weight:800;font-size:.9rem;display:flex;align-items:center;gap:.38rem;}
.goal-progress-wrap{height:11px;background:var(--bg);border-radius:99px;overflow:hidden;}
.goal-progress-fill{height:100%;border-radius:99px;transition:width .5s;}
.goal-tasks-list{display:flex;flex-wrap:wrap;gap:.28rem;margin-top:.5rem;}
.goal-task-badge{font-size:.68rem;font-weight:700;padding:.12rem .42rem;border-radius:99px;border:1px solid var(--border);color:var(--muted);background:var(--surface);}
.goal-task-badge.done{color:var(--green);border-color:var(--green);}
.add-goal-row{display:flex;gap:.45rem;align-items:center;flex-wrap:wrap;}
.add-goal-row input,.add-goal-row select{background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:.38rem .6rem;font-family:var(--body);font-size:.82rem;outline:none;}
.add-goal-row input{flex:1;min-width:150px;}
.add-goal-row input:focus,.add-goal-row select:focus{border-color:var(--accent);}

/* NEXT WEEK */
.nw-section{border:1px dashed var(--accent);border-radius:var(--radius);padding:.85rem 1rem;margin-bottom:1rem;}
.nw-title{font-family:var(--pixel);font-size:.52rem;color:var(--accent);letter-spacing:1px;margin-bottom:.7rem;}
.nw-task-list{display:flex;flex-direction:column;gap:.42rem;}
.nw-task{background:var(--surface2);border:1px solid var(--border);border-radius:9px;padding:.52rem .82rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;}

/* SHOP */
.shop-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(175px,1fr));gap:.6rem;}
.shop-item{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:.8rem;text-align:center;transition:border-color .2s;position:relative;display:flex;flex-direction:column;align-items:center;}
.shop-item:hover{border-color:var(--gold-dark);}
.si-title{font-weight:800;font-size:.82rem;margin-bottom:.15rem;}
.si-desc{font-size:.7rem;color:var(--muted);margin-bottom:.52rem;line-height:1.45;}
.si-cost{font-family:var(--pixel);font-size:.48rem;color:var(--gold);margin-bottom:.38rem;}
.si-cost.expensive{color:var(--red);}
.si-stock{font-size:.68rem;font-weight:700;color:var(--muted);margin-bottom:.38rem;}
.si-stock.low{color:var(--orange);}
.si-stock.out{color:var(--red);}
.btn-buy{background:var(--gold);color:var(--bg);border:none;border-radius:7px;padding:.27rem .75rem;font-family:var(--body);font-weight:800;font-size:.75rem;cursor:pointer;box-shadow:0 3px 0 var(--gold-dark);transition:transform .1s,opacity .15s;}
.btn-buy:hover{transform:translateY(-2px);box-shadow:0 5px 0 var(--gold-dark);}
.btn-buy:active{transform:translateY(1px);box-shadow:0 2px 0 var(--gold-dark);}
.btn-buy:disabled{opacity:.4;cursor:not-allowed;transform:none;box-shadow:none;}
.reward-del{position:absolute;top:.4rem;right:.4rem;background:none;border:none;color:var(--muted);cursor:pointer;font-size:.75rem;opacity:.5;transition:opacity .15s;}
.reward-del:hover{opacity:1;color:var(--red);}

/* ACHIEVEMENTS */
.achievements-list{display:flex;flex-wrap:wrap;gap:.36rem;}
.achievement{background:var(--surface2);border:1px solid var(--border);border-radius:99px;padding:.22rem .7rem;font-size:.68rem;font-weight:700;display:flex;align-items:center;gap:.28rem;}
.achievement.earned{border-color:var(--gold-dark);color:var(--gold);}
.achievement.locked{color:var(--muted);filter:grayscale(1);opacity:.5;}

/* TABS */
.tabs{display:flex;gap:.35rem;margin-bottom:1rem;flex-wrap:wrap;}
.tab{background:var(--surface);border:1px solid var(--border);color:var(--muted);border-radius:8px;padding:.34rem .78rem;font-family:var(--body);font-weight:700;font-size:.76rem;cursor:pointer;transition:all .2s;}
.tab:hover{border-color:var(--accent);color:var(--text);}
.tab.active{background:var(--accent);border-color:var(--accent);color:white;}
.tab-content{display:none;}
.tab-content.active{display:block;}

/* STATS */
.stats-controls{display:flex;gap:.4rem;margin-bottom:1rem;flex-wrap:wrap;align-items:center;}
.btn-range{background:var(--surface2);border:1px solid var(--border);color:var(--muted);border-radius:8px;padding:.28rem .75rem;font-family:var(--body);font-weight:700;font-size:.74rem;cursor:pointer;transition:all .18s;}
.btn-range:hover{border-color:var(--accent);color:var(--text);}
.btn-range.active{background:var(--accent);border-color:var(--accent);color:white;}
.chart-wrap{position:relative;height:230px;margin-bottom:1rem;}
.stats-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(130px,1fr));gap:.5rem;margin-bottom:1rem;}
.stat-card{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:.72rem;text-align:center;}
.sc-val{font-family:var(--pixel);font-size:.75rem;color:var(--gold);margin-bottom:.22rem;}
.sc-lbl{font-size:.66rem;color:var(--muted);font-weight:700;}
.week-history{display:flex;flex-direction:column;gap:.4rem;}
.wh-row{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:.6rem .85rem;}
.wh-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:.38rem;flex-wrap:wrap;gap:.35rem;}
.wh-week{font-family:var(--pixel);font-size:.48rem;color:var(--muted);}
.wh-tasks{display:flex;flex-wrap:wrap;gap:.26rem;}
.wh-task{font-size:.66rem;font-weight:700;padding:.11rem .4rem;border-radius:99px;border:1px solid;}

/* LEADERBOARD */
.lb-controls{display:flex;gap:.4rem;margin-bottom:.85rem;flex-wrap:wrap;}
.lb-table{width:100%;border-collapse:collapse;}
.lb-table th{font-family:var(--pixel);font-size:.44rem;color:var(--muted);letter-spacing:1px;text-align:left;padding:.5rem .6rem;border-bottom:1px solid var(--border);}
.lb-table td{padding:.5rem .6rem;font-size:.78rem;font-weight:700;border-bottom:1px solid var(--border)44;}
.lb-table tr:hover td{background:var(--surface2);}
.lb-rank{font-family:var(--pixel);font-size:.55rem;color:var(--muted);}
.lb-rank.gold{color:var(--gold);}
.lb-rank.silver{color:#c0c0c0;}
.lb-rank.bronze{color:#cd7f32;}
.lb-bar{height:6px;background:var(--accent);border-radius:99px;min-width:4px;}
.lb-no-data{text-align:center;color:var(--muted);font-size:.8rem;font-weight:600;padding:1.5rem;}

/* FREETIME */
.freetime-list{display:flex;flex-direction:column;gap:.48rem;}
.ft-item{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:.6rem .85rem;display:flex;justify-content:space-between;align-items:center;gap:.7rem;flex-wrap:wrap;}
.ft-label{font-weight:700;font-size:.82rem;}
.ft-amount{font-family:var(--pixel);font-size:.5rem;color:var(--green);}

/* TUTORIAL */
.tutorial-step{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:1.1rem 1.25rem;margin-bottom:.75rem;display:flex;gap:1rem;align-items:flex-start;}
.tutorial-num{font-family:var(--pixel);font-size:.7rem;color:var(--accent);min-width:28px;margin-top:.1rem;}
.tutorial-title{font-weight:800;font-size:.92rem;margin-bottom:.3rem;}
.tutorial-desc{font-size:.8rem;color:var(--muted);line-height:1.6;font-weight:600;}
.tutorial-tip{margin-top:.5rem;background:var(--surface);border-left:3px solid var(--gold);padding:.4rem .75rem;border-radius:0 6px 6px 0;font-size:.76rem;color:var(--gold);font-weight:700;}

/* MODAL */
.modal-overlay{position:fixed;inset:0;background:#00000088;z-index:500;display:flex;align-items:center;justify-content:center;padding:1rem;}
.modal-box{background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:1.5rem;width:100%;max-width:420px;max-height:90vh;overflow-y:auto;}
.modal-title{font-family:var(--pixel);font-size:.58rem;color:var(--muted);margin-bottom:1rem;letter-spacing:1px;}
.modal-actions{display:flex;gap:.5rem;justify-content:flex-end;margin-top:1.2rem;flex-wrap:wrap;}
.btn-modal{font-family:var(--body);font-weight:800;font-size:.8rem;padding:.38rem .88rem;border-radius:8px;border:none;cursor:pointer;transition:opacity .15s;}
.btn-modal.primary{background:var(--accent);color:white;}
.btn-modal.danger{background:var(--red);color:white;}
.btn-modal.secondary{background:var(--surface2);color:var(--muted);border:1px solid var(--border);}
.btn-modal:hover{opacity:.85;}

/* CALENDAR */
.cal-controls{display:flex;align-items:center;justify-content:center;gap:.75rem;margin-bottom:.75rem;}
.cal-legend{display:flex;flex-wrap:wrap;gap:.35rem;margin-bottom:.75rem;}
.cal-legend-item{display:flex;align-items:center;gap:.25rem;font-size:.65rem;font-weight:700;color:var(--muted);}
.cal-legend-dot{width:9px;height:9px;border-radius:50%;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.cal-dow{text-align:center;font-family:var(--pixel);font-size:.4rem;color:var(--muted);padding:.3rem 0;}
.cal-day{border-radius:6px;aspect-ratio:1;position:relative;cursor:default;overflow:hidden;background:var(--surface2);transition:transform .1s;}
.cal-day:hover{transform:scale(1.08);z-index:2;}
.cal-day.empty{background:transparent;}
.cal-day.today{box-shadow:0 0 0 2px var(--gold);}
.cal-day-num{position:absolute;top:2px;left:3px;font-size:.52rem;font-weight:700;color:rgba(255,255,255,.5);line-height:1;pointer-events:none;}
.cal-day-bars{position:absolute;bottom:0;left:0;right:0;display:flex;height:55%;}
.cal-day-bar{flex:1;transition:height .3s;}
.cal-tooltip{position:fixed;background:var(--surface);border:1px solid var(--border);border-radius:8px;padding:.5rem .75rem;font-size:.72rem;font-weight:700;z-index:100;pointer-events:none;box-shadow:0 4px 16px #00000066;min-width:130px;display:none;}
.cal-tooltip-row{display:flex;align-items:center;gap:.4rem;margin-bottom:.18rem;}
.cal-tooltip-dot{width:8px;height:8px;border-radius:50%;flex-shrink:0;}
/* LEFTOVER POOL */
.leftover-summary{background:var(--surface2);border:1px solid var(--border);border-radius:var(--radius);padding:.85rem 1rem;margin-bottom:.85rem;display:flex;align-items:center;justify-content:space-between;gap:.75rem;flex-wrap:wrap;}
.leftover-sum{font-family:var(--pixel);font-size:.6rem;color:var(--text);line-height:1.5;}
.leftover-sum strong{color:var(--gold);font-size:.85rem;}
.leftover-list{display:flex;flex-direction:column;gap:.4rem;}
.leftover-item{background:var(--surface2);border:1px solid var(--border);border-radius:9px;padding:.55rem .75rem;display:flex;align-items:center;gap:.6rem;cursor:pointer;transition:all .15s;}
.leftover-item:hover{border-color:var(--accent);transform:translateY(-1px);}
.leftover-item.selected{border-color:var(--gold);background:#2a2000;}
.leftover-check{width:18px;height:18px;border:2px solid var(--border);border-radius:5px;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:.85rem;color:var(--gold);transition:all .15s;}
.leftover-item.selected .leftover-check{border-color:var(--gold);background:var(--gold);color:var(--bg);}
.leftover-item-info{flex:1;min-width:0;}
.leftover-item-name{font-weight:800;font-size:.85rem;color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;}
.leftover-item-meta{font-size:.7rem;color:var(--muted);font-weight:600;}
.leftover-rest{font-family:var(--pixel);font-size:.55rem;color:var(--gold);}
.btn-redeem{background:var(--gold);color:var(--bg);border:none;border-radius:7px;padding:.45rem 1rem;font-family:var(--body);font-weight:800;font-size:.85rem;cursor:pointer;box-shadow:0 3px 0 var(--gold-dark);transition:transform .1s;white-space:nowrap;}
.btn-redeem:hover:not(:disabled){transform:translateY(-1px);}
.btn-redeem:disabled{opacity:.4;cursor:not-allowed;box-shadow:none;}
/* LOGIN REMINDER */
.login-reminder{background:#1a1420;border:1px solid var(--accent);border-radius:var(--radius);padding:.85rem 1rem;margin-top:1rem;display:none;}
.lr-title{font-family:var(--pixel);font-size:.5rem;color:var(--accent);letter-spacing:1px;margin-bottom:.6rem;}
.lr-item{display:flex;align-items:flex-start;gap:.5rem;font-size:.78rem;font-weight:700;margin-bottom:.38rem;line-height:1.4;}
.lr-dot{width:7px;height:7px;border-radius:50%;flex-shrink:0;margin-top:.28rem;}
/* ICS IMPORT */
.ics-drop{border:2px dashed var(--border);border-radius:var(--radius);padding:1.25rem;text-align:center;cursor:pointer;transition:border-color .2s,background .2s;margin-bottom:.85rem;}
.ics-drop:hover,.ics-drop.dragover{border-color:var(--accent);background:var(--accent)11;}
.ics-drop-icon{font-size:1.6rem;margin-bottom:.35rem;}
.ics-drop-text{font-size:.78rem;font-weight:700;color:var(--muted);}
.ics-drop-sub{font-size:.68rem;color:var(--muted);margin-top:.2rem;}
.ics-preview-list{max-height:220px;overflow-y:auto;display:flex;flex-direction:column;gap:.35rem;margin-bottom:.85rem;}
.ics-preview-item{background:var(--surface2);border:1px solid var(--border);border-radius:8px;padding:.45rem .75rem;display:flex;align-items:center;gap:.6rem;}
.ics-preview-item input[type=checkbox]{width:15px;height:15px;accent-color:var(--accent);flex-shrink:0;cursor:pointer;}
.ics-preview-title{font-weight:700;font-size:.82rem;flex:1;}
.ics-preview-date{font-size:.68rem;color:var(--muted);font-weight:700;white-space:nowrap;}
/* MILESTONE ANIMATION */
.milestone-pop{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);
  z-index:3000;pointer-events:none;text-align:center;
  animation:milestonePop 3.5s cubic-bezier(.3,1.4,.5,1) forwards;}
.milestone-pop .mp-emoji{font-size:3.2rem;display:block;animation:mpBounce 3.5s ease forwards;}
.milestone-pop .mp-title{font-family:var(--pixel);font-size:.62rem;display:block;margin-top:.5rem;
  text-shadow:0 0 20px currentColor;letter-spacing:1px;}
.milestone-pop .mp-sub{font-size:.82rem;font-weight:800;display:block;margin-top:.3rem;
  color:var(--text);max-width:280px;}
@keyframes milestonePop{
  0%{transform:translate(-50%,-50%) scale(0);opacity:0}
  15%{transform:translate(-50%,-55%) scale(1.15);opacity:1}
  70%{transform:translate(-50%,-55%) scale(1.1);opacity:1}
  100%{transform:translate(-50%,-65%) scale(1);opacity:0}
}
@keyframes mpBounce{
  0%,100%{transform:translateY(0) rotate(0deg)}
  20%{transform:translateY(-12px) rotate(-8deg)}
  40%{transform:translateY(-6px) rotate(6deg)}
  60%{transform:translateY(-10px) rotate(-4deg)}
  80%{transform:translateY(-4px) rotate(2deg)}
}
/* CALENDAR */
.cal-day.has-events{outline:2px solid var(--accent);outline-offset:-2px;}
.cal-event-dots{position:absolute;top:2px;right:2px;display:flex;gap:2px;flex-wrap:wrap;justify-content:flex-end;max-width:50%;}
.cal-event-dot{width:5px;height:5px;border-radius:50%;background:var(--accent);flex-shrink:0;}
.agenda-event-list{margin-top:.85rem;display:flex;flex-direction:column;gap:.45rem;}
.agenda-event{background:var(--surface2);border:1px solid var(--border);border-radius:9px;padding:.55rem .85rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem;flex-wrap:wrap;}
.agenda-event-info{display:flex;align-items:center;gap:.5rem;flex-wrap:wrap;}
.agenda-event-name{font-weight:800;font-size:.88rem;}
.agenda-event-date{font-size:.7rem;color:var(--muted);font-weight:700;}
.agenda-event-actions{display:flex;gap:.35rem;align-items:center;}
.btn-plan{font-family:var(--body);font-weight:800;font-size:.72rem;padding:.22rem .6rem;border-radius:7px;border:1px solid var(--accent);color:var(--accent);background:none;cursor:pointer;white-space:nowrap;transition:background .15s,color .15s;}
.btn-plan:hover{background:var(--accent);color:white;}
/* SEARCH */
.search-bar{display:flex;align-items:center;gap:.5rem;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius);padding:.45rem .75rem;margin-bottom:.75rem;transition:border-color .2s;}
.search-bar:focus-within{border-color:var(--accent);}
.search-icon{font-size:.9rem;flex-shrink:0;}
.search-bar input{flex:1;background:none;border:none;outline:none;color:var(--text);font-family:var(--body);font-size:.88rem;font-weight:600;}
.search-bar input::placeholder{color:var(--muted);}
.search-clear{background:none;border:none;color:var(--muted);cursor:pointer;font-size:.85rem;padding:0 .1rem;line-height:1;transition:color .15s;}
.search-clear:hover{color:var(--text);}
.btn-undo{background:var(--surface2);color:var(--red);border:1px solid var(--red);border-radius:7px;padding:.27rem .75rem;font-family:var(--body);font-weight:800;font-size:.72rem;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;gap:.35rem;transition:background .15s;margin:0 auto;}
.btn-undo:hover{background:var(--red-bg);}
.btn-refill{background:var(--surface2);color:var(--green);border:1px solid var(--green);border-radius:7px;padding:.27rem .75rem;font-family:var(--body);font-weight:800;font-size:.72rem;cursor:pointer;transition:background .15s;margin:0 auto;display:block;}
.btn-refill:hover{background:var(--green-bg);}
.refill-opt:hover{border-color:var(--accent)!important;color:var(--accent)!important;}
.refill-opt.active{background:var(--accent)!important;border-color:var(--accent)!important;color:white!important;}
.undo-timer{font-family:var(--pixel);font-size:.55rem;color:var(--red);}
/* SETTINGS */
.settings-section{margin-bottom:1.25rem;}
.settings-section-title{font-family:var(--pixel);font-size:.52rem;color:var(--muted);letter-spacing:1px;text-transform:uppercase;margin-bottom:.65rem;}
.settings-row{display:flex;gap:.5rem;align-items:center;margin-bottom:.6rem;flex-wrap:wrap;}
.settings-row label{font-size:.75rem;font-weight:700;color:var(--muted);min-width:110px;}
.settings-row input[type="text"]{flex:1;background:var(--surface2);border:1px solid var(--border);color:var(--text);border-radius:8px;padding:.4rem .65rem;font-family:var(--body);font-size:.85rem;outline:none;transition:border-color .2s;min-width:0;}
.settings-row input[type="text"]:focus{border-color:var(--accent);}
.settings-row input[type="color"]{width:38px;height:32px;border:1px solid var(--border);border-radius:7px;background:var(--surface2);cursor:pointer;padding:2px;}
.cat-custom-list{display:flex;flex-direction:column;gap:.4rem;margin-bottom:.75rem;}
.cat-custom-item{background:var(--surface2);border:1px solid var(--border);border-radius:9px;padding:.5rem .75rem;display:flex;align-items:center;justify-content:space-between;gap:.5rem;}
.cat-custom-item .ci-left{display:flex;align-items:center;gap:.5rem;font-weight:700;font-size:.85rem;}
.cat-custom-item .ci-color{width:12px;height:12px;border-radius:50%;flex-shrink:0;}
.emoji-grid{display:flex;flex-wrap:wrap;gap:.28rem;margin-top:.4rem;max-height:110px;overflow-y:auto;padding:.3rem;background:var(--surface2);border:1px solid var(--border);border-radius:8px;}
.emoji-btn{font-size:1rem;cursor:pointer;padding:.18rem .22rem;border-radius:5px;border:1px solid transparent;transition:background .1s,border-color .1s;line-height:1;}
.emoji-btn:hover{background:var(--border);border-color:var(--accent);}
.emoji-btn.selected{background:var(--accent)22;border-color:var(--accent);}
.emoji-preview{font-size:1.4rem;min-width:32px;text-align:center;line-height:1;}
/* ACHIEVEMENT POP */
.ach-pop{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);z-index:3500;text-align:center;pointer-events:none;animation:achPop 3s cubic-bezier(.3,1.4,.5,1) forwards;}
.ach-pop-inner{background:linear-gradient(135deg,#2a1f4a,#1a1826);border:2px solid var(--gold);border-radius:var(--radius);padding:1.25rem 2rem;box-shadow:0 0 40px #f5c84244;}
.ach-pop-label{font-family:var(--pixel);font-size:.5rem;color:var(--gold);letter-spacing:2px;margin-bottom:.4rem;}
.ach-pop-icon{font-size:2.5rem;display:block;margin-bottom:.3rem;}
.ach-pop-title{font-weight:800;font-size:1.1rem;color:var(--text);}
.ach-pop-desc{font-size:.75rem;color:var(--muted);font-weight:600;margin-top:.2rem;}
@keyframes achPop{0%{transform:translate(-50%,-50%) scale(0);opacity:0}15%{transform:translate(-50%,-55%) scale(1.1);opacity:1}70%{transform:translate(-50%,-55%) scale(1.05);opacity:1}100%{transform:translate(-50%,-65%) scale(1);opacity:0}}
/* REMINDER */
.reminder-badge{display:inline-flex;align-items:center;gap:.3rem;font-size:.62rem;font-weight:700;padding:.1rem .42rem;border-radius:99px;border:1px solid var(--orange);color:var(--orange);background:#2e1a0033;white-space:nowrap;cursor:pointer;}
/* SLIDESHOW */
.slideshow{position:relative;min-height:280px;overflow:hidden;}
.slide{display:none;padding:2rem 2rem 1rem;text-align:center;animation:slideFadeIn .35s ease;}
.slide.active{display:block;}
@keyframes slideFadeIn{from{opacity:0;transform:translateX(18px)}to{opacity:1;transform:translateX(0)}}
.slide-icon{font-size:2.8rem;margin-bottom:.5rem;}
.slide-num{font-family:var(--pixel);font-size:.48rem;color:var(--muted);margin-bottom:.5rem;}
.slide-title{font-size:1.1rem;font-weight:800;margin-bottom:.75rem;color:var(--text);}
.slide-desc{font-size:.85rem;font-weight:600;color:var(--muted);line-height:1.7;margin-bottom:.65rem;text-align:left;}
.slide-desc strong{color:var(--text);}
.slide-tip{font-size:.76rem;font-weight:700;color:var(--gold);background:#2a2000;border-left:3px solid var(--gold);padding:.4rem .75rem;border-radius:0 6px 6px 0;text-align:left;}
.slideshow-nav{display:flex;align-items:center;justify-content:center;gap:1rem;padding:.85rem 1.5rem 1.25rem;border-top:1px solid var(--border);}
.slide-btn{background:none;border:1px solid var(--border);color:var(--text);border-radius:8px;width:36px;height:36px;font-size:1.2rem;cursor:pointer;transition:all .15s;display:flex;align-items:center;justify-content:center;}
.slide-btn:hover{border-color:var(--accent);color:var(--accent);}
.slide-dots{display:flex;gap:.4rem;}
.slide-dot{width:8px;height:8px;border-radius:50%;background:var(--border);cursor:pointer;transition:background .2s,transform .2s;}
.slide-dot.active{background:var(--accent);transform:scale(1.3);}
/* TOUR */
.tour-overlay{position:fixed;inset:0;z-index:4000;pointer-events:none;}
.tour-backdrop{position:fixed;inset:0;background:#00000077;z-index:4001;}
.tour-highlight{position:fixed;z-index:4002;border-radius:12px;box-shadow:0 0 0 4px var(--accent),0 0 0 9999px #00000077;pointer-events:none;transition:all .4s cubic-bezier(.4,0,.2,1);}
.tour-bubble{position:fixed;z-index:4003;background:var(--surface);border:2px solid var(--accent);border-radius:var(--radius);padding:1rem 1.25rem;max-width:280px;box-shadow:0 8px 32px #00000088;animation:bubblePop .3s cubic-bezier(.3,1.4,.5,1);}
@keyframes bubblePop{from{transform:scale(0.8);opacity:0}to{transform:scale(1);opacity:1}}
.tour-bubble::before{content:'';position:absolute;width:12px;height:12px;background:var(--surface);border:2px solid var(--accent);transform:rotate(45deg);}
.tour-bubble.arrow-top::before{top:-7px;left:50%;margin-left:-6px;border-bottom:none;border-right:none;}
.tour-bubble.arrow-bottom::before{bottom:-7px;left:50%;margin-left:-6px;border-top:none;border-left:none;}
.tour-bubble-title{font-weight:800;font-size:.92rem;margin-bottom:.35rem;color:var(--accent);}
.tour-bubble-text{font-size:.8rem;font-weight:600;color:var(--muted);line-height:1.55;}
.tour-bubble-actions{display:flex;justify-content:space-between;align-items:center;margin-top:.75rem;gap:.5rem;}
.tour-step-label{font-family:var(--pixel);font-size:.48rem;color:var(--muted);}
.btn-tour-next{background:var(--accent);color:white;border:none;border-radius:7px;padding:.32rem .85rem;font-family:var(--body);font-weight:800;font-size:.8rem;cursor:pointer;}
.btn-tour-skip{background:none;border:none;color:var(--muted);font-family:var(--body);font-size:.75rem;font-weight:700;cursor:pointer;text-decoration:underline;}
/* IMPRESSUM */
.impressum-content{font-size:.85rem;line-height:1.7;color:var(--text);}
.imp-section{margin-bottom:1.25rem;padding-bottom:1.25rem;border-bottom:1px solid var(--border);}
.imp-section:last-of-type{border-bottom:none;}
.imp-title{font-family:var(--pixel);font-size:.52rem;color:var(--accent);letter-spacing:1px;text-transform:uppercase;margin-bottom:.55rem;}
.imp-section p{color:var(--muted);font-weight:600;margin-bottom:.4rem;}
.imp-section p strong{color:var(--text);}
.imp-list{list-style:none;padding:0;margin:.35rem 0 .55rem 0;}
.imp-list li{color:var(--muted);font-weight:600;padding:.2rem 0;display:flex;gap:.5rem;}
.imp-list li::before{content:'–';color:var(--accent);flex-shrink:0;}
.imp-date{font-size:.72rem;color:var(--muted);font-weight:700;margin-top:1rem;}
/* TOAST */
.toast{position:fixed;bottom:1.75rem;left:50%;transform:translateX(-50%);background:var(--surface);border:1px solid var(--border);border-radius:99px;padding:.46rem 1.2rem;font-weight:700;font-size:.77rem;z-index:2000;box-shadow:0 4px 24px #00000066;white-space:nowrap;animation:toastIn .3s ease,toastOut .3s ease 2.5s forwards;}
@keyframes toastIn{from{opacity:0;transform:translateX(-50%) translateY(10px)}to{opacity:1;transform:translateX(-50%) translateY(0)}}
@keyframes toastOut{from{opacity:1}to{opacity:0}}
.coin-pop{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%) scale(0);z-index:1000;text-align:center;pointer-events:none;animation:coinPop .8s cubic-bezier(.3,1.6,.5,1) forwards;}
.coin-pop .cp-icon{font-size:3rem;display:block;}
.coin-pop .cp-text{font-family:var(--pixel);font-size:.55rem;color:var(--gold);text-shadow:0 0 12px #f5c842;margin-top:.3rem;display:block;}
@keyframes coinPop{0%{transform:translate(-50%,-50%) scale(0);opacity:0}60%{opacity:1}100%{transform:translate(-50%,-60%) scale(1.2);opacity:0}}

@media(max-width:600px){.logo{font-size:1rem;}.add-form{flex-direction:column;}.field input[type="text"]{width:100%;}.task-actions{gap:.22rem;}}