/* ═══════════════════════════════════════════════════════
   AALTO DESIGN SYSTEM v3.0 — Final
   Glassmorphism · Atmospheric depth · Premium animations
   Variables: semantic names used across ALL files
═══════════════════════════════════════════════════════ */

/* ── TOKENS ─────────────────────────────────────────── */
:root {
  /* Background layers */
  --bg:    #020408;
  --surf:  #050b12;
  --card:  #090f1c;
  --panel: #0d1927;
  --bord:  #1a2e44;   /* brighter border */

  /* Semantic status */
  --safe:  #22dd88;   /* optimal ACWR, good */
  --warn:  #ffcc44;   /* caution, streak fire */
  --risk:  #ff4466;   /* danger, high ACWR */
  --info:  #44aaff;   /* neutral info, volleyball */
  --purp:  #aa66ff;   /* AI / XP / level */

  /* Text */
  --white: #f0f6ff;
  --text:  #9ab8d4;   /* raised: 9.9:1 on bg */
  --muted: #6888a8;   /* raised: 5.5:1 on bg, was 2.2:1 */

  /* Layout */
  --hdr-h:  52px;
  --nav-h:  62px;
  --r:      16px;
  --r-sm:   10px;

  /* Glass */
  --glass-bg:    rgba(255,255,255,.035);
  --glass-bord:  rgba(255,255,255,.07);
}

/* ── RESET ──────────────────────────────────────────── */
*,*::before,*::after{box-sizing:border-box;margin:0;padding:0;}
html{height:100%;overflow:hidden;}
body{
  height:100vh;overflow:hidden;
  background:var(--bg);color:var(--text);
  font-family:'Nunito',sans-serif;font-size:15px;line-height:1.5;
  -webkit-tap-highlight-color:transparent;
}
*{scrollbar-width:none;}*::-webkit-scrollbar{width:0;}

/* ── ATMOSPHERIC BACKGROUND ─────────────────────────── */
body::before,body::after{
  content:'';position:fixed;border-radius:50%;
  filter:blur(80px);pointer-events:none;z-index:0;
}
body::before{
  width:320px;height:320px;
  background:radial-gradient(circle,rgba(34,221,136,.06) 0%,transparent 70%);
  top:-80px;right:-80px;
  animation:orbFloat1 18s ease-in-out infinite;
}
body::after{
  width:280px;height:280px;
  background:radial-gradient(circle,rgba(170,102,255,.05) 0%,transparent 70%);
  bottom:80px;left:-60px;
  animation:orbFloat2 22s ease-in-out infinite;
}
@keyframes orbFloat1{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(-30px,40px) scale(1.1)}}
@keyframes orbFloat2{0%,100%{transform:translate(0,0) scale(1)}50%{transform:translate(40px,-30px) scale(.9)}}

/* ── SHELL ──────────────────────────────────────────── */
#app{display:flex;flex-direction:column;height:100vh;max-width:480px;margin:0 auto;position:relative;z-index:1;}

/* ── HEADER ─────────────────────────────────────────── */
.aalto-header{
  height:var(--hdr-h);flex-shrink:0;
  display:flex;align-items:center;justify-content:space-between;
  padding:0 16px;
  background:rgba(5,11,18,.92);
  border-bottom:1px solid var(--bord);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  position:relative;z-index:20;
}
.hdr-logo{font-family:'Nunito',sans-serif;font-weight:900;font-size:22px;color:var(--white);letter-spacing:-.02em;}
.hdr-logo em{font-style:normal;color:var(--safe);}
.hdr-meta{display:flex;align-items:center;gap:8px;}

/* Streak badge in header */
.hdr-streak{display:flex;align-items:center;gap:3px;font-family:'JetBrains Mono',monospace;font-weight:700;font-size:13px;}
.hdr-fire{font-size:16px;animation:firePulse 1.2s ease-in-out infinite;}
@keyframes firePulse{0%,100%{transform:scaleY(1)}50%{transform:scaleY(1.18)}}
.streak-count{color:var(--warn);}

/* XP pill */
.hdr-lv{
  font-family:'JetBrains Mono',monospace;font-weight:700;font-size:11px;
  color:var(--warn);background:rgba(255,204,68,.1);border:1px solid rgba(255,204,68,.25);
  padding:3px 8px;border-radius:4px;letter-spacing:.06em;
}
.hdr-xp-wrap{width:52px;height:5px;background:var(--bord);border-radius:3px;overflow:hidden;}
.hdr-xp-fill{height:5px;background:linear-gradient(90deg,var(--purp),var(--warn));border-radius:3px;transition:width .8s cubic-bezier(.4,0,.2,1);}

/* ── SCREEN ─────────────────────────────────────────── */
#screen-wrap{flex:1;overflow-y:auto;overflow-x:hidden;-webkit-overflow-scrolling:touch;}
.page{padding:12px 14px calc(var(--nav-h)+20px);max-width:480px;margin:0 auto;}

/* ── NAVIGATION ─────────────────────────────────────── */
.aalto-nav{
  height:var(--nav-h);flex-shrink:0;
  display:flex;position:relative;
  background:rgba(5,11,18,.95);
  border-top:1px solid var(--bord);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  z-index:20;
}
.nav-a{flex:1;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;text-decoration:none;color:var(--muted);transition:color .2s;position:relative;-webkit-user-select:none;user-select:none;min-width:0;}
button.nav-a{font-family:inherit;font-size:inherit;}
.nav-a.active,.nav-a.on{color:var(--safe);}
.nav-a::after{
  content:'';position:absolute;bottom:0;left:25%;right:25%;
  height:2px;background:var(--safe);border-radius:2px;
  transform:scaleX(0);transition:transform .25s cubic-bezier(.34,1.56,.64,1);
}
.nav-a.active::after,.nav-a.on::after{transform:scaleX(1);}
.nav-icon{font-size:20px;line-height:1;}
.nav-label{font-family:'JetBrains Mono',monospace;font-size:7px;letter-spacing:.1em;text-transform:uppercase;}

/* ── GLASS CARD ─────────────────────────────────────── */
.card{
  background:var(--glass-bg);
  backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);
  border:1px solid var(--glass-bord);
  border-radius:var(--r);padding:14px;margin-bottom:10px;
  position:relative;
}
.card::before{
  content:'';position:absolute;inset:0;border-radius:var(--r);
  background:linear-gradient(135deg,rgba(255,255,255,.03) 0%,transparent 50%);
  pointer-events:none;
}
.card-title{
  font-family:'JetBrains Mono',monospace;font-size:8px;letter-spacing:.16em;
  text-transform:uppercase;color:var(--muted);
  display:flex;align-items:center;gap:6px;margin-bottom:12px;
}
.card-title::before{content:'';width:10px;height:1px;background:var(--muted);flex-shrink:0;}

/* ── STREAK HERO ─────────────────────────────────────── */
.streak-hero{
  background:linear-gradient(135deg,rgba(255,204,68,.1),rgba(255,100,30,.06));
  border:1px solid rgba(255,204,68,.25);
  border-radius:var(--r);padding:14px 16px;margin-bottom:10px;
  display:flex;align-items:center;gap:14px;
  position:relative;overflow:hidden;
}
.streak-hero::before{
  content:'';position:absolute;top:-40px;right:-40px;
  width:120px;height:120px;
  background:radial-gradient(circle,rgba(255,204,68,.12) 0%,transparent 70%);
  pointer-events:none;
}
.streak-flame{
  font-size:50px;line-height:1;flex-shrink:0;
  filter:drop-shadow(0 0 16px rgba(255,160,30,.6));
  animation:flameDance 2s ease-in-out infinite;
}
@keyframes flameDance{0%,100%{transform:rotate(-3deg) scale(1)}33%{transform:rotate(3deg) scale(1.05)}66%{transform:rotate(-2deg) scale(.97)}}
.streak-info{flex:1;}
.streak-num{
  font-family:'Nunito',sans-serif;font-weight:900;
  font-size:46px;line-height:1;color:var(--warn);
  text-shadow:0 0 24px rgba(255,204,68,.35);
}
.streak-days{font-size:12px;color:rgba(255,204,68,.7);font-weight:700;margin-top:-2px;}
.streak-msg{font-size:11px;color:var(--muted);margin-top:5px;}
.streak-freeze{
  background:rgba(255,204,68,.08);border:1px solid rgba(255,204,68,.2);
  border-radius:10px;padding:8px 10px;font-size:10px;
  color:var(--warn);cursor:pointer;text-align:center;
  font-weight:700;transition:all .15s;flex-shrink:0;line-height:1.4;
}
.streak-freeze:hover{background:rgba(255,204,68,.18);}

/* ── XP CARD ─────────────────────────────────────────── */
.xp-card{
  background:linear-gradient(135deg,rgba(170,102,255,.08),rgba(68,170,255,.05));
  border:1px solid rgba(170,102,255,.2);
  border-radius:var(--r);padding:14px 16px;margin-bottom:10px;
}
.xp-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px;}
.xp-level{
  font-family:'Nunito',sans-serif;font-weight:900;font-size:13px;
  background:linear-gradient(135deg,var(--purp),var(--info));
  -webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;
}
.xp-next{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--muted);}
.xp-bar{background:var(--bord);border-radius:100px;height:10px;overflow:hidden;position:relative;}
.xp-fill{
  height:10px;border-radius:100px;
  background:linear-gradient(90deg,var(--purp),var(--info));
  transition:width .8s cubic-bezier(.4,0,.2,1);
  position:relative;overflow:hidden;
}
.xp-fill::after{
  content:'';position:absolute;top:0;right:-20px;bottom:0;width:40px;
  background:linear-gradient(90deg,transparent,rgba(255,255,255,.35),transparent);
  animation:xpShim 2.2s ease-in-out infinite;
}
@keyframes xpShim{0%{transform:translateX(-40px);opacity:0}40%{opacity:1}100%{transform:translateX(40px);opacity:0}}
.xp-meta{display:flex;justify-content:space-between;margin-top:6px;font-family:'JetBrains Mono',monospace;font-size:10px;}
.xp-today{color:var(--purp);}
.xp-total{color:var(--muted);}

/* XP FLOAT ANIMATION */
.xp-float{
  position:fixed;font-family:'JetBrains Mono',monospace;font-weight:700;
  font-size:14px;color:var(--purp);pointer-events:none;z-index:300;
  animation:xpFloat 1.4s cubic-bezier(.4,0,.2,1) forwards;
}
@keyframes xpFloat{0%{transform:translateY(0);opacity:1}100%{transform:translateY(-80px);opacity:0}}

/* ── AI BOX ─────────────────────────────────────────── */
.ai-box{
  background:linear-gradient(135deg,rgba(170,102,255,.07),rgba(68,170,255,.04));
  border:1px solid rgba(170,102,255,.18);
  border-radius:var(--r);padding:14px;margin-bottom:10px;
}
.ai-label{
  display:flex;align-items:center;gap:6px;
  font-family:'JetBrains Mono',monospace;font-size:9px;color:rgba(170,102,255,.7);
  letter-spacing:.1em;text-transform:uppercase;margin-bottom:8px;
}
.ai-label::before{content:'🧠';font-size:14px;}
.ai-text{font-size:13px;color:rgba(238,246,255,.8);line-height:1.65;font-style:italic;}
.ai-loading{display:flex;align-items:center;gap:8px;font-size:12px;color:var(--muted);}
.ai-spinner{width:12px;height:12px;border-radius:50%;border:2px solid var(--bord);border-top-color:var(--purp);animation:spin .8s linear infinite;flex-shrink:0;}
@keyframes spin{to{transform:rotate(360deg)}}

/* ── MINI STATS ROW ──────────────────────────────────── */
.stat-row{display:flex;gap:8px;margin-bottom:10px;}
.stat-box{
  flex:1;background:var(--glass-bg);border:1px solid var(--glass-bord);
  border-radius:12px;padding:10px 8px;text-align:center;
}
.stat-val{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:20px;line-height:1;color:var(--white);}
.stat-unit{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);display:inline;}
.stat-label{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);letter-spacing:.08em;margin-top:3px;}

/* ── QUICK TILES ─────────────────────────────────────── */
.quick-grid{display:grid;grid-template-columns:1fr 1fr;gap:8px;margin-bottom:10px;}
.qtile{
  background:var(--glass-bg);border:1px solid var(--glass-bord);
  border-radius:14px;padding:14px 12px;
  display:flex;flex-direction:column;align-items:flex-start;gap:3px;
  cursor:pointer;-webkit-user-select:none;user-select:none;
  position:relative;overflow:hidden;
  transition:transform .12s cubic-bezier(.34,1.56,.64,1),border-color .15s;
}
.qtile:active{transform:scale(.93);}
.qtile::after{
  content:'';position:absolute;inset:0;
  background:linear-gradient(135deg,rgba(255,255,255,.04) 0%,transparent 50%);
  pointer-events:none;
}
.qt-icon{font-size:28px;line-height:1;}
.qt-name{font-size:13px;font-weight:800;color:var(--white);}
.qt-au{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);}
.qt-xp{font-family:'JetBrains Mono',monospace;font-size:9px;font-weight:700;margin-top:1px;}

/* ── SCHED ROWS ──────────────────────────────────────── */
.sched-row{display:flex;align-items:center;gap:10px;padding:9px 10px;border-radius:10px;background:rgba(255,255,255,.02);margin-bottom:2px;}
.sched-day{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);min-width:28px;text-align:center;}
.sched-icon{font-size:18px;flex-shrink:0;}
.sched-info{flex:1;}
.sched-name{font-size:13px;font-weight:700;color:var(--white);}
.sched-sub{font-size:11px;color:var(--muted);}
.sched-au{font-family:'JetBrains Mono',monospace;font-size:10px;}

/* ── APPLE WATCH RINGS ───────────────────────────────── */
.rings-section{display:flex;justify-content:center;align-items:center;padding:16px 0 8px;gap:0;}
.rings-canvas-wrap{position:relative;width:200px;height:200px;flex-shrink:0;}
.rings-canvas-wrap canvas{position:absolute;inset:0;}
.rings-center{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:1px;}
.rc-main{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:38px;line-height:1;color:var(--white);}
.rc-lbl{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);letter-spacing:.12em;}
.rc-status{font-size:10px;font-weight:700;}
.rings-legend{display:flex;flex-direction:column;gap:10px;padding-left:14px;}
.rl-row{display:flex;align-items:center;gap:7px;}
.rl-dot{width:9px;height:9px;border-radius:50%;flex-shrink:0;}
.rl-name{font-size:11px;font-weight:800;}
.rl-val{font-family:'JetBrains Mono',monospace;font-size:10px;}

/* ── ACHIEVEMENT POPUP ───────────────────────────────── */
.ach-popup{
  position:fixed;bottom:calc(var(--nav-h)+14px);left:14px;right:14px;max-width:452px;margin:0 auto;
  background:linear-gradient(135deg,rgba(15,8,0,.98),rgba(10,5,0,.98));
  border:2px solid var(--warn);border-radius:var(--r);padding:14px 16px;
  display:flex;align-items:center;gap:12px;
  transform:translateY(100px);opacity:0;
  transition:transform .5s cubic-bezier(.34,1.56,.64,1),opacity .3s;
  z-index:200;pointer-events:none;
  box-shadow:0 8px 40px rgba(255,204,68,.25),0 0 0 1px rgba(255,204,68,.1);
}
.ach-popup.show{transform:translateY(0);opacity:1;}
.ap-icon{font-size:38px;flex-shrink:0;animation:popIn .45s cubic-bezier(.34,1.56,.64,1) .1s both;}
@keyframes popIn{from{transform:scale(0) rotate(-10deg)}to{transform:scale(1) rotate(0)}}
.ap-label{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--warn);letter-spacing:.15em;margin-bottom:2px;}
.ap-title{font-weight:800;font-size:15px;color:var(--white);}
.ap-desc{font-size:11px;color:rgba(255,204,68,.6);margin-top:1px;}
.ap-xp{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:15px;color:var(--warn);flex-shrink:0;}

/* ── CONFETTI ────────────────────────────────────────── */
#confetti-canvas{position:fixed;inset:0;pointer-events:none;z-index:250;display:none;}

/* ── SECTION LABEL ───────────────────────────────────── */
.sec-label{
  font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);
  letter-spacing:.16em;text-transform:uppercase;
  display:flex;align-items:center;gap:6px;margin:12px 0 8px;
}
.sec-label::before{content:'';width:10px;height:1px;background:var(--muted);flex-shrink:0;}

/* ── MODAL ───────────────────────────────────────────── */
.modal-overlay{display:none;position:fixed;inset:0;z-index:100;background:rgba(0,0,0,.8);align-items:flex-end;justify-content:center;}
.modal-overlay.open{display:flex;animation:fadeIn .2s;}
@keyframes fadeIn{from{opacity:0}to{opacity:1}}
.modal{
  background:rgba(8,15,26,.97);
  border:1px solid var(--bord);
  border-radius:20px 20px 0 0;
  padding:20px 16px 32px;width:100%;max-width:480px;max-height:88vh;overflow-y:auto;
  animation:slideUp .32s cubic-bezier(.34,1.2,.64,1);
}
@keyframes slideUp{from{transform:translateY(60px);opacity:0}to{transform:none;opacity:1}}
.modal-handle{width:36px;height:4px;background:var(--bord);border-radius:2px;margin:0 auto 16px;}
.modal-title{font-weight:800;font-size:18px;color:var(--white);margin-bottom:16px;}

/* ── FORM ELEMENTS ───────────────────────────────────── */
.form-label{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);letter-spacing:.12em;text-transform:uppercase;display:block;margin-bottom:6px;}
.form-input,.form-select{
  width:100%;background:rgba(255,255,255,.04);border:1px solid var(--bord);
  border-radius:10px;padding:11px 12px;color:var(--white);
  font-family:'Nunito',sans-serif;font-size:14px;outline:none;
  transition:border-color .2s,box-shadow .2s;
}
.form-input:focus,.form-select:focus{border-color:var(--safe);box-shadow:0 0 0 3px rgba(34,221,136,.1);}
.form-select{appearance:none;cursor:pointer;}
.form-group{margin-bottom:14px;}
.rpe-row{display:flex;gap:5px;}
.rpe-btn{
  flex:1;padding:9px 0;text-align:center;
  background:rgba(255,255,255,.04);border:1px solid var(--bord);
  border-radius:8px;color:var(--text);font-weight:700;cursor:pointer;
  font-size:13px;transition:all .12s;font-family:'Nunito',sans-serif;
}
.rpe-btn.sel{background:rgba(34,221,136,.12);border-color:var(--safe);color:var(--safe);}
.rpe-btn:active{transform:scale(.93);}

/* ── BUTTONS ─────────────────────────────────────────── */
.btn{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  border:none;border-radius:12px;cursor:pointer;
  font-family:'Nunito',sans-serif;font-weight:800;font-size:14px;
  padding:12px 20px;transition:transform .12s,opacity .15s;
  text-decoration:none;line-height:1;-webkit-user-select:none;user-select:none;
}
.btn:active{transform:scale(.95);}
.btn-primary{background:linear-gradient(135deg,var(--safe),#00b870);color:#001a0e;}
.btn-secondary{background:rgba(255,255,255,.05);color:var(--text);border:1px solid var(--bord);}
.btn-danger{background:rgba(255,68,102,.1);color:var(--risk);border:1px solid rgba(255,68,102,.3);}
.btn-full{width:100%;margin-bottom:8px;}
.btn-sm{padding:7px 14px;font-size:12px;border-radius:8px;}

/* ── TOAST ───────────────────────────────────────────── */
.toast{
  position:fixed;bottom:calc(var(--nav-h)+14px);left:50%;
  transform:translateX(-50%) translateY(20px);
  background:rgba(12,24,37,.96);border:1px solid var(--bord);
  border-radius:10px;padding:9px 16px;
  font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--white);
  z-index:150;opacity:0;transition:opacity .22s,transform .22s;
  pointer-events:none;white-space:nowrap;
  box-shadow:0 4px 20px rgba(0,0,0,.4);
}
.toast.show{opacity:1;transform:translateX(-50%) translateY(0);}

/* ── ONBOARDING ──────────────────────────────────────── */
.onboard-step{display:none;}
.onboard-step.active{display:block;}
.onboard-hero{text-align:center;padding:24px 0 20px;}
.onboard-emoji{font-size:64px;display:block;margin-bottom:12px;animation:popIn .5s cubic-bezier(.34,1.56,.64,1);}
.onboard-title{font-weight:900;font-size:22px;color:var(--white);margin-bottom:6px;}
.onboard-sub{font-size:13px;color:var(--text);line-height:1.55;}
.step-dots{display:flex;justify-content:center;gap:6px;margin:16px 0;}
.dot{width:6px;height:6px;border-radius:50%;background:var(--bord);transition:all .3s;}
.dot.active{background:var(--safe);width:20px;border-radius:3px;}

/* ── JOURNAL ─────────────────────────────────────────── */
.emoji-grid{display:grid;grid-template-columns:repeat(5,1fr);gap:6px;margin:8px 0;}
.emoji-btn{
  aspect-ratio:1;border-radius:var(--r-sm);background:rgba(255,255,255,.03);
  border:1px solid var(--bord);display:flex;flex-direction:column;
  align-items:center;justify-content:center;cursor:pointer;
  transition:all .15s;font-size:22px;gap:2px;
}
.emoji-btn.sel{border-width:2px;transform:scale(1.06);}
.emoji-btn span{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);letter-spacing:.04em;}
.mood-row{display:flex;gap:8px;margin:8px 0;}
.mood-btn{
  flex:1;padding:10px 4px;border-radius:var(--r-sm);
  background:rgba(255,255,255,.03);border:2px solid var(--bord);
  text-align:center;cursor:pointer;transition:all .15s;
}
.mood-btn.sel{transform:scale(1.04);}
.mood-emoji{font-size:24px;display:block;margin-bottom:3px;}
.mood-label{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);}
.beh-row{display:flex;flex-wrap:wrap;gap:6px;margin:8px 0;}
.beh-chip{
  padding:6px 12px;border-radius:100px;border:1px solid var(--bord);
  background:rgba(255,255,255,.03);font-size:12px;cursor:pointer;
  transition:all .15s;color:var(--text);font-family:'Nunito',sans-serif;
}
.beh-chip.sel{border-color:var(--info);background:rgba(68,170,255,.1);color:var(--info);}

/* ── CYCLE PHASES ────────────────────────────────────── */
.cycle-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:8px;margin:8px 0;}
.cycle-phase{
  padding:12px 4px;border-radius:var(--r-sm);text-align:center;
  border:1px solid var(--bord);cursor:pointer;
  background:rgba(255,255,255,.03);transition:all .15s;
}
.cycle-phase.active{border-width:2px;}
.cp-icon{font-size:20px;display:block;margin-bottom:3px;}
.cp-name{font-size:11px;font-weight:700;}
.cp-days{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);margin-top:2px;}

/* ── JOURNAL HISTORY ─────────────────────────────────── */
.j-entry{display:grid;grid-template-columns:auto 1fr auto;gap:12px;align-items:center;padding:9px 0;border-bottom:1px solid rgba(255,255,255,.03);}
.j-entry:last-child{border-bottom:none;}
.j-date{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--muted);min-width:44px;}
.j-emojis{font-size:16px;letter-spacing:2px;}
.j-score{font-family:'JetBrains Mono',monospace;font-size:14px;font-weight:700;}

/* ── CHAT ────────────────────────────────────────────── */
.chat-wrap{display:flex;flex-direction:column;height:calc(100vh - var(--hdr-h) - var(--nav-h));max-width:480px;margin:0 auto;}
.chat-messages{flex:1;overflow-y:auto;padding:12px 14px 8px;display:flex;flex-direction:column;gap:10px;}
.msg{display:flex;gap:8px;max-width:88%;}
.msg.user{align-self:flex-end;flex-direction:row-reverse;}
.msg.ai{align-self:flex-start;}
.msg-bubble{padding:10px 14px;border-radius:16px;font-size:14px;line-height:1.55;}
.msg.user .msg-bubble{background:linear-gradient(135deg,var(--info),#0060aa);color:#fff;border-radius:16px 16px 4px 16px;}
.msg.ai  .msg-bubble{background:var(--glass-bg);border:1px solid var(--glass-bord);color:var(--white);border-radius:16px 16px 16px 4px;}
.msg-avatar{width:26px;height:26px;border-radius:50%;flex-shrink:0;display:flex;align-items:center;justify-content:center;font-size:13px;background:rgba(170,102,255,.15);border:1px solid rgba(170,102,255,.3);}
.msg-time{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);margin-top:3px;align-self:flex-end;}
.chat-input-wrap{border-top:1px solid var(--bord);background:rgba(5,11,18,.95);padding:10px 12px;padding-bottom:calc(10px + env(safe-area-inset-bottom));}
.chat-input-row{display:flex;gap:8px;align-items:flex-end;}
.chat-input{flex:1;background:rgba(255,255,255,.05);border:1px solid var(--bord);border-radius:20px;padding:10px 14px;color:var(--white);font-family:'Nunito',sans-serif;font-size:14px;outline:none;resize:none;max-height:100px;transition:border-color .2s;line-height:1.4;}
.chat-input:focus{border-color:var(--info);}
.chat-send-btn{width:40px;height:40px;border-radius:50%;border:none;cursor:pointer;background:linear-gradient(135deg,var(--info),#0060aa);display:flex;align-items:center;justify-content:center;font-size:18px;flex-shrink:0;transition:opacity .15s;}
.chat-send-btn:disabled{opacity:.4;}
.quick-prompts{display:flex;gap:6px;flex-wrap:wrap;padding:6px 14px 2px;}
.qp{background:rgba(255,255,255,.04);border:1px solid var(--bord);border-radius:100px;padding:5px 12px;font-size:12px;color:var(--text);cursor:pointer;white-space:nowrap;transition:all .15s;font-family:'Nunito',sans-serif;}
.qp:hover{border-color:var(--purp);color:var(--purp);}
.typing-dots span{display:inline-block;width:5px;height:5px;border-radius:50%;background:var(--muted);margin:0 1px;animation:bounce .8s ease-in-out infinite;}
.typing-dots span:nth-child(2){animation-delay:.15s;}
.typing-dots span:nth-child(3){animation-delay:.3s;}
@keyframes bounce{0%,100%{transform:translateY(0)}50%{transform:translateY(-5px)}}

/* ── WEEK REPORT ─────────────────────────────────────── */
.week-nav{display:flex;align-items:center;justify-content:space-between;padding:10px 0;margin-bottom:10px;}
.week-nav-btn{background:none;border:1px solid var(--bord);border-radius:var(--r-sm);color:var(--text);padding:8px 14px;cursor:pointer;font-size:13px;transition:border-color .2s;font-family:'Nunito',sans-serif;}
.week-nav-btn:hover{border-color:var(--info);}
.week-lbl{font-family:'JetBrains Mono',monospace;font-size:11px;color:var(--white);letter-spacing:.05em;}
.score-big{font-family:'Nunito',sans-serif;font-weight:900;font-size:72px;line-height:1;}
.day-row{display:grid;grid-template-columns:56px 1fr auto;gap:10px;align-items:center;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.03);}
.day-row:last-child{border-bottom:none;}
.dr-day{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);}
.dr-bar-bg{background:var(--bord);border-radius:100px;height:7px;overflow:hidden;}
.dr-bar{height:7px;border-radius:100px;transition:width .8s cubic-bezier(.4,0,.2,1);}
.dr-val{font-family:'JetBrains Mono',monospace;font-size:10px;color:var(--white);text-align:right;min-width:48px;}
.vs-grid{display:grid;grid-template-columns:1fr auto 1fr;gap:8px;align-items:center;margin:10px 0;}
.vs-side{text-align:center;background:rgba(255,255,255,.03);border:1px solid var(--bord);border-radius:var(--r-sm);padding:12px 8px;}
.vs-val{font-family:'JetBrains Mono',monospace;font-weight:700;font-size:20px;color:var(--white);}
.vs-lbl{font-family:'JetBrains Mono',monospace;font-size:9px;color:var(--muted);margin-top:2px;}
.vs-delta{font-family:'JetBrains Mono',monospace;font-size:11px;margin-top:3px;}
.vs-mid{font-size:11px;color:var(--muted);text-align:center;}
.badge-row{display:flex;gap:8px;flex-wrap:wrap;margin:8px 0;}
.badge{display:flex;flex-direction:column;align-items:center;gap:3px;background:rgba(255,255,255,.03);border:1px solid var(--bord);border-radius:var(--r-sm);padding:10px 12px;min-width:72px;text-align:center;}
.badge-icon{font-size:26px;}
.badge-name{font-family:'JetBrains Mono',monospace;font-size:8px;color:var(--muted);letter-spacing:.06em;}
.export-row{display:flex;align-items:center;justify-content:space-between;padding:8px 0;border-bottom:1px solid rgba(255,255,255,.03);}
.export-row:last-child{border-bottom:none;}
.score-slider{width:100%;accent-color:var(--info);height:6px;cursor:pointer;margin:8px 0;}

/* ── BACKWARDS COMPATIBILITY ALIASES ───────────────────
   Legacy names used in older pages → map to new system
───────────────────────────────────────────────────── */
:root {
  --lime:     var(--safe);
  --wave:     var(--info);
  --gold:     var(--warn);
  --coral:    var(--risk);
  --violet:   var(--purp);
  --foam:     var(--safe);
  --blue:     var(--info);
  --dim:      var(--panel);
  --border:   var(--bord);
  --header-h: var(--hdr-h);
  --r-sm:     10px;
  --r:        16px;
  /* Also add legacy class names for old pages */
  --surf:     #050b12;
}