:root {
  --navy:#10206f;
  --purple:#6b2fc5;
  --purple2:#8f4be3;
  --pink:#ef0a8a;
  --pink2:#ff4daf;
  --green:#20bf83;
  --blue:#2b8bf0;
  --orange:#ffad1f;
  --red:#ef174f;
  --ink:#14206b;
  --muted:#66709a;
  --line:#e5e9f3;
}
*{box-sizing:border-box}
body{
  margin:0;
  background:#f7f9fc;
  color:var(--ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}
a{text-decoration:none}

.navbar{
  min-height:72px;
  background:#fff;
  border-bottom:1px solid #edf0f6;
}
.brand{
  display:flex;align-items:center;gap:9px;color:var(--navy);
  font-size:1.7rem;font-weight:900;letter-spacing:-1px;
}
.brand .mark{font-size:1.5rem;color:#7130c7}
.brand span{color:var(--pink)}
.brand small{display:block;font-size:.52rem;letter-spacing:2px;color:#777da2;margin-top:-2px}
.nav-link{font-size:.88rem;font-weight:700;color:#22307a!important;padding:.8rem 1rem!important}
.nav-link.active{color:var(--pink)!important;position:relative}
.nav-link.active:after{
  content:"";position:absolute;left:16px;right:16px;bottom:4px;height:3px;
  border-radius:4px;background:var(--pink)
}
.avatar{
  width:38px;height:38px;border-radius:50%;background:#7d3cc5;color:#fff;
  display:grid;place-items:center;font-weight:800;font-size:.85rem
}

.btn-pink{
  background:linear-gradient(90deg,#ef0a8a,#ff249b);
  border:none;color:#fff;border-radius:7px;font-weight:800
}
.btn-pink:hover{color:#fff;opacity:.96}
.btn-outline-purple{
  border:1px solid #7d48d0;color:#5c2bad;background:#fff;border-radius:7px;font-weight:800
}

.page{padding:16px 0 50px}
.breadcrumb{font-size:.78rem;margin-bottom:14px}
.breadcrumb a{color:#2f3b85}

.hero{
  border:1px solid #eadff5;border-radius:13px;
  background:linear-gradient(90deg,#f8f1ff 0%,#fff 48%,#ffeaf6 100%);
  padding:14px 20px;margin-bottom:14px;overflow:hidden
}
.hero-left{display:flex;gap:14px;align-items:center}
.hero-icon{
  width:62px;height:62px;border-radius:50%;display:grid;place-items:center;
  background:linear-gradient(160deg,#9535dc,#5925a9);color:#fff;font-size:1.65rem;
  flex:0 0 62px
}
.hero h1{font-size:1.6rem;font-weight:900;margin:0 0 4px}
.hero p{margin:0;color:#4d598d;font-size:.85rem}
.hero-quote{
  font-family:"Segoe Print","Comic Sans MS",cursive;font-size:1rem;
  font-weight:800;line-height:1.4;text-align:center
}
.book-art{
  display:flex;justify-content:center;align-items:center;min-height:100px
}
.books{
  font-size:4rem;line-height:1
}
.keep-card{
  background:#fff;border:1px solid #f0dce8;border-radius:10px;
  padding:13px;font-size:.72rem;font-weight:700;text-align:center;line-height:1.5
}

.top-grid{
  display:grid;
  grid-template-columns:1fr 1fr .72fr;
  gap:12px;
  margin-bottom:12px
}
.card{
  background:#fff;border:1px solid var(--line);
  border-radius:11px;overflow:hidden
}
.card-head{padding:12px 14px;border-bottom:1px solid var(--line)}
.card-title{font-size:.98rem;font-weight:900;margin:0}
.card-body{padding:14px}

.performance-wrap{
  display:grid;grid-template-columns:170px 1fr;gap:18px;align-items:center
}
.donut{
  width:150px;height:150px;border-radius:50%;
  background:conic-gradient(var(--pink) 0 68%,#e9edf7 68% 100%);
  display:grid;place-items:center;margin:auto
}
.donut-inner{
  width:112px;height:112px;border-radius:50%;background:#fff;
  display:grid;place-items:center;text-align:center
}
.donut-inner strong{font-size:2rem;line-height:1}
.donut-inner span{font-size:.78rem;font-weight:800;margin-top:4px}
.metric-list{display:grid;gap:8px}
.metric-row{
  display:flex;justify-content:space-between;gap:12px;
  padding-bottom:8px;border-bottom:1px solid #edf0f5;font-size:.73rem
}
.metric-row:last-child{border-bottom:0}
.metric-left{display:flex;align-items:center;gap:7px}
.metric-dot{
  width:23px;height:23px;border-radius:50%;display:grid;place-items:center;
  color:#fff;font-size:.65rem
}

.subject-list{display:grid;gap:11px}
.subject-row{
  border:1px solid #e9ecf3;border-radius:8px;padding:10px;
  display:grid;grid-template-columns:130px 1fr 48px 105px;gap:10px;align-items:center
}
.subject-name{display:flex;gap:8px;align-items:center;font-size:.76rem;font-weight:800}
.subject-icon{
  width:30px;height:30px;border-radius:50%;display:grid;place-items:center;font-size:.75rem
}
.bar{height:8px;background:#edf0f7;border-radius:999px;overflow:hidden}
.fill{height:100%;border-radius:999px}
.score{font-size:.75rem;font-weight:900}
.status{
  border-radius:7px;padding:6px 8px;text-align:center;font-size:.66rem;font-weight:800
}
.status.good{background:#ddf8ec;color:#0d905a}
.status.warn{background:#fff1d7;color:#a96b00}
.status.bad{background:#ffe1ee;color:#d2136d}

.next-box{
  background:linear-gradient(160deg,#fff,#fff1f7);
  min-height:100%;
  padding:18px
}
.next-icon{
  width:48px;height:48px;border-radius:50%;display:grid;place-items:center;
  background:#ffe2ef;color:#e70a82;font-size:1.25rem;margin-bottom:8px
}
.next-box h2{font-size:1.15rem;font-weight:900;margin-bottom:6px}
.next-box p{font-size:.75rem;color:#596493;line-height:1.45}
.next-list{display:grid;gap:11px;margin-top:14px}
.next-item{display:flex;gap:8px;align-items:center;font-size:.72rem}
.next-item i{
  width:25px;height:25px;border-radius:50%;display:grid;place-items:center;
  background:#eef2ff;color:#6c36c7
}

.practice-panel{margin-bottom:12px}
.practice-head{
  display:flex;justify-content:space-between;align-items:center;gap:10px;
  padding:12px 14px;border-bottom:1px solid var(--line)
}
.practice-head h2{font-size:1rem;font-weight:900;margin:0}
.panel-link{font-size:.73rem;font-weight:800;color:#5f2cb2}

.practice-grid{
  display:grid;grid-template-columns:repeat(4,1fr);gap:10px;padding:14px
}
.practice-card{
  border:1px solid #e5e8f1;border-radius:9px;padding:14px;background:#fff
}
.practice-card.recommended{border-color:#ef55a7;background:#fff9fc}
.practice-card .top{
  display:flex;justify-content:space-between;align-items:flex-start;gap:8px
}
.picon{
  width:46px;height:46px;border-radius:50%;display:grid;place-items:center;font-size:1.2rem;font-weight:900
}
.badge-small{
  border-radius:999px;padding:5px 7px;font-size:.62rem;font-weight:800
}
.practice-card h3{font-size:.88rem;font-weight:900;margin:10px 0 6px}
.practice-card p{font-size:.7rem;color:#596493;line-height:1.45;min-height:62px}
.practice-meta{
  display:flex;justify-content:space-between;gap:10px;
  font-size:.66rem;color:#39447f;margin:10px 0
}

.cta{
  border:1px solid #eadff5;border-radius:12px;
  background:linear-gradient(90deg,#fff3e8,#fff,#ffeaf6);
  padding:12px 20px
}
.cta-boy{width:150px;display:block;margin:auto;mix-blend-mode:multiply}
.cta-title{
  font-family:"Segoe Print","Comic Sans MS",cursive;
  font-size:1.15rem;font-weight:900;line-height:1.35
}
.cta-quote{
  background:#fff1f6;border:1px solid #f2dce8;border-radius:9px;
  padding:15px;text-align:center;font-family:"Segoe Print","Comic Sans MS",cursive;
  font-size:.85rem;font-weight:700
}

.footer{
  margin-top:25px;background:linear-gradient(135deg,#14236d,#26357d);
  color:#fff;padding:40px 0 24px
}
.footer-brand{font-size:1.55rem;font-weight:900}
.footer-brand span{color:#ff2d98}
.footer h5{font-size:.82rem;font-weight:800;margin-bottom:10px}
.footer a,.footer p{font-size:.72rem;color:#d4daf0}
.footer-bottom{
  border-top:1px solid rgba(255,255,255,.14);
  padding-top:14px;margin-top:24px;font-size:.7rem;color:#c6cde8
}

@media(max-width:991.98px){
  .top-grid{grid-template-columns:1fr}
  .practice-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:767.98px){
  .performance-wrap{grid-template-columns:1fr}
  .subject-row{grid-template-columns:1fr}
  .practice-grid{grid-template-columns:1fr}
}


/* Extracted inline styles */
.inline-recommendations-1{background:#20bf83}
.inline-recommendations-2{background:#ef174f}
.inline-recommendations-3{background:#8a90a7}
.inline-recommendations-4{background:#f2a400}
.inline-recommendations-5{background:#7846d7}
.inline-recommendations-6{background:#e4f3ff;color:#177fd3}
.inline-recommendations-7{width:80%;background:#20bf83}
.inline-recommendations-8{background:#e4f3ff;color:#177fd3}
.inline-recommendations-9{width:50%;background:#ffad1f}
.inline-recommendations-10{background:#ffe2ef;color:#e70a82}
.inline-recommendations-11{width:40%;background:#ef174f}
.inline-recommendations-12{background:#ff5bb0;color:#fff}
.inline-recommendations-13{background:#ffe1ee;color:#d2136d}
.inline-recommendations-14{background:#e5d2ff;color:#6226b7}
.inline-recommendations-15{background:#f0e9ff;color:#6634b8}
.inline-recommendations-16{opacity:.72}
.inline-recommendations-17{background:#bee5ff;color:#147ed2}
.inline-recommendations-18{background:#e4f3ff;color:#177fd3}
.inline-recommendations-19{opacity:.72}
.inline-recommendations-20{background:#cdf5df;color:#15955f}
.inline-recommendations-21{background:#e2f8ec;color:#118957}
.inline-recommendations-22{opacity:.72}
.inline-recommendations-23{color:#5d2cae}
.books{font-size:3.4rem}.books i:last-child{font-size:1.8rem}