:root{--ink:#73435e;--muted:#b4879e;--line:#f4d7e4;--pink:#f6a8c5}
body{background:#fff3f8;color:var(--ink)}
.app-shell{grid-template-columns:236px 1fr;background:radial-gradient(circle at 80% 0,#fff 0,transparent 30%),linear-gradient(135deg,#fff8fb,#f5eaff 52%,#edf7ff)}
.sidebar{padding:19px 14px 28px;background:linear-gradient(180deg,#fffaff 0,#fff0f7 46%,#ffe8f1 100%);border-right:3px solid #f7cfe0;gap:8px;box-shadow:7px 0 24px #eeb8cf26}
.brand{padding:3px 0 15px;text-align:center}.brand-kitty-photo{display:block;width:100%;height:121px;object-fit:cover;object-position:center 48%;margin:0 auto 7px;border:3px solid #fff;border-radius:22px;background:#fff;box-shadow:0 5px 0 #f6cddd,0 8px 18px #e68db833}.brand h1{font-size:20px;line-height:1.15;margin:3px 0;color:#df5f95}.brand p,.tiny{color:#b48da2;font-size:12px}.sidebar nav{gap:8px}.nav-group{display:block;color:#df78a5;font-size:13px;margin:12px 8px 1px;font-weight:900}.nav-item{padding:10px 12px;border:2px solid #f5d6e4;border-radius:17px;background:#fffafd;color:#8a586f;font-size:16px;box-shadow:0 3px 0 #f8e4ed;transition:.18s}.nav-item:hover{background:#fff0f6;transform:translateX(3px)}.nav-item.active{background:linear-gradient(100deg,#ffddec,#ffeef5);color:#cd4f86;outline:0;border-color:#ef91b7;box-shadow:0 3px 0 #edb2cb}.nav-icon{width:27px;height:27px;margin-right:10px;background:#ffe39b;color:#c47966;font-size:15px;border-radius:10px}.nav-item.active .nav-icon{background:#f59dc0;color:#fff}.utility .nav-icon{background:#dff1ff;color:#7598b4}.stars-box{margin-top:12px;background:linear-gradient(120deg,#fff2a7,#ffe9c8);color:#9b657b;border:2px solid #f7d57a;border-radius:17px;padding:11px 12px;font-size:15px;box-shadow:0 3px 0 #f8dc9e}.tiny{margin-top:6px;text-align:center}
.kitty-nav-icon{overflow:hidden;padding:0;border:2px solid #f8c2d5;background:#fff!important;box-shadow:0 2px 0 #f7d8e4}.kitty-nav-icon img{display:block;width:100%;height:100%;object-fit:cover}.nav-item.active .kitty-nav-icon{border-color:#fff;background:#fff!important}.stars-box{margin-top:12px;background:linear-gradient(120deg,#fff2a7,#ffe9c8);color:#9b657b;border:2px solid #f7d57a;border-radius:17px;padding:11px 12px;font-size:15px;box-shadow:0 3px 0 #f8dc9e}.tiny{margin-top:6px;text-align:center}
.side-gift{width:100%;margin-top:12px;padding:12px;border:0;border-radius:19px;background:linear-gradient(135deg,#ffcf75,#f49ac0);color:#fff;font:inherit;text-align:left;display:flex;align-items:center;gap:10px;cursor:pointer;box-shadow:0 7px 15px #dc789a48;transition:transform .18s,box-shadow .18s}.side-gift:hover{transform:translateY(-2px);box-shadow:0 10px 20px #dc789a5b}.side-gift-icon{display:grid;place-items:center;width:37px;height:37px;border-radius:13px;background:#ffffff3d;font-size:21px}.side-gift b,.side-gift small{display:block}.side-gift b{font-size:16px}.side-gift small{margin-top:1px;color:#fff7df;font-size:11px}.side-gift small i{font-style:normal;font-weight:900}.side-gift em{margin-left:auto;font-size:18px;font-style:normal}
main{max-width:1180px;padding:20px 28px 42px}header{height:68px;border-radius:18px;background:rgba(255,255,255,.9);box-shadow:0 6px 19px #deb2d428}header h2{font-size:28px;color:#df79a5}.score{border-color:#f3a6c2;background:#ffe8f1;color:#d86294}.hero,.learning-panel{border:1px solid #fff;border-radius:25px;box-shadow:0 8px 24px #dcb2ca2b}.hero h3{color:#d95f95}.hero p{color:#b987a0}.lesson-card{border-color:#f1dce7;color:#75465f;background:#fffafe}.lesson-card:hover{border-color:#f19abd}.lesson-icon{background:#ffe29b!important;color:#9d6555}.lesson-card:nth-child(2) .lesson-icon{background:#dff0ff!important}.lesson-card:nth-child(3) .lesson-icon,.lesson-card:nth-child(6) .lesson-icon{background:#d8f3e9!important}.lesson-card:nth-child(4) .lesson-icon{background:#ffd8e8!important}.tab.active{background:#ffe5ef;border-color:#ee94b8;box-shadow:inset 0 0 0 1px #f4aed0}.hint{color:#df7da8}.study-card{border-color:#f0dce6}.study-card:hover{border-color:#ef9dbd}.primary-btn,.answer-row button{background:#ee8bb5;box-shadow:0 3px 0 #c65d89}.toast{background:#9c5e7e}.modal{background:#fffafd}.sun-face{border-color:#f3a0bc;color:#d75e8c;box-shadow:0 2px 0 #e78ab0}
.char{position:relative;overflow:hidden}.char:before{content:'';position:absolute;left:50%;top:13px;width:82px;height:82px;transform:translateX(-50%);border-radius:50%;background:linear-gradient(145deg,#fff2f8,#ffe2ee);z-index:0}.char .big-character,.char small,.char button{position:relative;z-index:1}.char:focus-visible{outline:4px solid #ee8bb5;outline-offset:3px}.listen-button{margin:10px 0 8px;border:0;border-radius:999px;padding:7px 14px;background:linear-gradient(135deg,#f28bb6,#df6f9f);color:#fff;font:inherit;font-size:14px;cursor:pointer;box-shadow:0 4px 10px #d77da153;transition:transform .18s,box-shadow .18s}.listen-button:hover{transform:translateY(-2px);box-shadow:0 6px 12px #d77da16b}.listen-button span{display:inline-grid;place-items:center;width:17px;height:17px;border-radius:50%;background:#ffffff3d;font-size:10px}.char .stroke-btn{position:relative;z-index:1}
@media(max-width:760px){.app-shell{grid-template-columns:1fr}.sidebar nav{grid-template-columns:repeat(3,1fr)}.nav-group{display:none}.nav-item{font-size:13px;padding:8px}.utility{display:none}}