#skill-learning{background:#f2faf8;padding-bottom:70px}.learning-status{display:flex;align-items:center;gap:12px;font-size:10px}.learning-status span{color:#81969b}.learning-status strong{color:#4d8992;background:#e2f3ef;border-radius:14px;padding:7px 10px}
.skill-direction-section{padding:34px 0 29px;border-bottom:1px solid #dce9e6}.learning-title span,.simple-heading span{font:700 9px 'DM Sans';letter-spacing:1.5px;color:#ca8a73}.learning-title h1{font-size:29px;margin:7px 0 8px;color:#385966}.learning-title p,.simple-heading>p{font-size:10px;color:#899da2;margin:0}.direction-tabs{display:flex;gap:10px;flex-wrap:wrap;margin-top:22px}.direction-tabs button{border:1px solid #d4e5e2;background:#fff;border-radius:15px;padding:10px 17px;color:#6f878d;font-size:11px;cursor:pointer;transition:.2s}.direction-tabs button:hover{transform:translateY(-2px)}.direction-tabs button.active{background:#fff0b6;border-color:#efd470;color:#806435;font-weight:700;box-shadow:0 5px 13px rgba(182,146,60,.12)}
.growth-planner{display:grid;grid-template-columns:1.3fr .8fr auto;gap:18px;align-items:end;margin-top:20px;padding:17px 18px;background:#fff;border:1px solid #d8e7e4;border-radius:16px}.growth-planner>div>span{display:block;font-size:8px;color:#8b9da0;margin-bottom:7px}.growth-planner label{display:flex;gap:7px}.growth-planner input,.growth-planner select{border:1px solid #d8e6e3;border-radius:9px;background:#f9fcfb;color:#4a6870;padding:9px 10px;outline:none;font-size:10px}.growth-planner input{flex:1}.growth-planner select{width:76px}.planner-summary strong{display:block;font-size:10px;color:#4d878c}.growth-planner>button{border:0;border-radius:9px;background:#5da9b0;color:white;padding:10px 13px;font-size:9px;cursor:pointer}
.daily-recommend-section,.skill-explore-section,.learning-library-section{padding-top:30px}.simple-heading{display:flex;justify-content:space-between;align-items:end;margin-bottom:15px}.simple-heading h2{font-size:20px;margin:5px 0 0}.daily-recommend-card{border:1px solid #e6dfb9;border-radius:21px;background:#fffdf1;padding:23px 25px;box-shadow:0 9px 25px rgba(103,122,110,.06)}.recommend-label{display:flex;gap:8px;align-items:center;color:#b17d42;font-size:10px}.recommend-label b{font:700 8px 'DM Sans';background:#f2b28b;color:white;border-radius:8px;padding:3px 6px}.recommend-main{display:grid;grid-template-columns:1fr 90px;gap:30px;align-items:center;margin-top:14px}.recommend-topic{font-size:11px;color:#d07d62;margin:0}.recommend-main h3{font-size:22px;margin:6px 0 8px;color:#3c5963}.recommend-description{font-size:10px;color:#74888d;line-height:1.65;margin:0}.match-score{width:84px;height:84px;border-radius:50%;background:#e4f4f1;display:grid;place-content:center;text-align:center;border:1px solid #c9e6e1}.match-score strong{font:700 20px 'DM Sans';color:#4b9b9e}.match-score span{font-size:8px;color:#7b9698;margin-top:2px}.recommend-meta{display:flex;align-items:center;gap:24px;margin-top:20px;padding-top:17px;border-top:1px solid #ece6cb}.recommend-meta>span{display:grid;gap:4px}.recommend-meta b{font-size:8px;color:#a1a49a}.recommend-meta em{font-style:normal;font-size:10px;color:#526e76}.recommend-meta>i{height:25px;width:1px;background:#e5e3d8}.recommend-actions{display:flex;gap:9px;margin-top:18px}.recommend-actions button{border:0;border-radius:9px;background:#5ba9b1;color:#fff;padding:9px 15px;font-size:10px;cursor:pointer}.recommend-actions .save-recommend{background:#fff;border:1px solid #d9e4df;color:#6c8389}.recommend-actions .save-recommend.saved{background:#fff0b6;border-color:#efd470;color:#836331}
.skill-path-card{display:grid;grid-template-columns:260px 1fr;border:1px solid #d7e7e4;border-radius:21px;background:#fff;overflow:hidden;box-shadow:0 9px 25px rgba(69,124,130,.06)}.path-overview{background:#dff2ef;padding:27px}.path-overview>span{font-size:9px;color:#5b9598}.path-overview h3{font-size:23px;margin:8px 0 16px}.path-level{display:flex;gap:9px;align-items:center}.path-level b{font-size:9px;color:#82999b}.path-level strong{font-size:9px;background:#fff0b6;color:#8e6e38;padding:5px 9px;border-radius:10px}.path-overview>p{font-size:10px;line-height:1.7;color:#698288;margin:18px 0}.path-progress{height:6px;background:rgba(255,255,255,.65);border-radius:10px;overflow:hidden}.path-progress i{display:block;height:100%;background:#68b3b4}.path-overview small{font-size:8px;color:#769497}.path-stages{display:grid;grid-template-columns:repeat(4,1fr)}.path-stages article{padding:25px 18px;border-left:1px solid #edf0ea;position:relative}.path-stages article.active{background:#fffaf0}.path-stages span{font-size:8px;color:#9ca6a1}.path-stages b{display:block;font:700 22px 'DM Sans';color:#d9dfda;margin:14px 0 24px}.path-stages article.active b{color:#efbe5f}.path-stages h4{font-size:12px;line-height:1.45;margin:0 0 7px}.path-stages p{font-size:8px;line-height:1.55;color:#89999b;margin:0}
.library-tabs{display:flex;gap:6px;margin-bottom:12px}.library-tabs button{border:0;background:#e8f2f0;color:#789095;border-radius:10px;padding:9px 13px;font-size:10px;cursor:pointer}.library-tabs button.active{background:#5da8b0;color:#fff}.library-tabs b{font:600 8px 'DM Sans';margin-left:4px}.library-list{display:grid;gap:8px}.library-list article{display:grid;grid-template-columns:48px 1fr 70px 80px;gap:14px;align-items:center;background:#fff;border:1px solid #dce9e6;border-radius:14px;padding:13px 15px}.library-list article[hidden]{display:none}.library-type{width:42px;height:42px;border-radius:10px;display:grid;place-items:center;font-size:9px}.library-type.article{background:#fff0bf;color:#a27c36}.library-type.video{background:#dceff3;color:#4f8995}.library-type.case{background:#f4ddda;color:#a16c63}.library-list h3{font-size:11px;margin:0 0 4px}.library-list p{font-size:8px;color:#94a3a5;margin:0}.library-list em{font-style:normal;font-size:9px;color:#7c9397}.library-list article>button{border:1px solid #d7e5e2;background:#fff;border-radius:8px;color:#5f8187;padding:7px 8px;font-size:9px;cursor:pointer}
.outfit-inspiration-section{padding-top:30px}.outfit-inspiration-section[hidden]{display:none}.outfit-library-status{display:flex;align-items:baseline;gap:4px;background:#f7ded9;border-radius:15px;padding:7px 11px}.outfit-library-status strong{font:700 16px 'DM Sans';color:#b36f64}.outfit-library-status span{font-size:8px;color:#9a7771}.outfit-upload-bar{display:grid;grid-template-columns:130px 1fr auto;gap:18px;align-items:center;background:#fff;border:1px solid #d9e8e5;border-radius:17px;padding:16px 18px}.outfit-style-select{display:grid;gap:5px}.outfit-style-select span{font-size:8px;color:#899c9f}.outfit-style-select select{border:1px solid #d8e6e3;border-radius:9px;background:#f9fcfb;color:#527078;padding:8px 9px;font-size:9px;outline:none}.outfit-upload-bar>div>strong{font-size:10px}.outfit-upload-bar>div>p{font-size:8px;color:#94a3a4;margin:4px 0 0}.outfit-upload-bar>button{border:0;border-radius:9px;background:#f3d46c;color:#6e592f;padding:10px 14px;font-size:9px;font-weight:700;cursor:pointer}.outfit-gallery{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:13px;margin-top:14px}.outfit-empty{grid-column:1/-1;min-height:150px;border:1px dashed #cfdfdc;border-radius:16px;display:grid;place-content:center;text-align:center;background:rgba(255,255,255,.45)}.outfit-empty[hidden]{display:none}.outfit-empty strong{font-size:11px;color:#6e888d}.outfit-empty p{font-size:8px;color:#99a7a8;margin:6px 0}.outfit-card{background:#fff;border:1px solid #dce8e5;border-radius:15px;overflow:hidden;position:relative}.outfit-card img{display:block;width:100%;aspect-ratio:4/5;object-fit:cover;background:#eef4f1}.outfit-card-body{padding:10px}.outfit-card-body span{display:block;font-size:7px;color:#c17d6b;margin-bottom:5px}.outfit-card-body input{width:100%;border:0;border-bottom:1px dashed #d9e1dc;background:transparent;outline:none;padding:3px 0 6px;font-size:9px;color:#506d74}.outfit-card-delete{position:absolute;right:7px;top:7px;border:0;border-radius:12px;background:rgba(255,255,255,.88);color:#a27973;padding:5px 7px;font-size:8px;cursor:pointer;box-shadow:0 2px 8px rgba(65,84,82,.12)}
.english-learning-section{padding:30px 0 10px}.english-learning-section[hidden]{display:none}.english-learning-section>.simple-heading{margin-bottom:19px}.english-day-badge{border:1px solid #ecd982;border-radius:18px;background:#fff6ce;color:#806536;padding:9px 14px;font:700 10px 'DM Sans';box-shadow:0 5px 13px rgba(176,145,67,.08)}.english-simple-grid{display:grid;grid-template-columns:1fr 1fr;gap:18px}.english-simple-grid article{position:relative;overflow:hidden;border-radius:24px;padding:26px;box-shadow:0 14px 32px rgba(65,107,110,.08)}.english-simple-grid article>span{font:700 9px 'DM Sans';letter-spacing:1.4px;color:#a77858}.english-simple-grid h3{font-size:20px;color:#365762;margin:8px 0}.english-simple-grid p{font-size:10px;line-height:1.65;color:#728b90;margin:0}.english-word-card{background:linear-gradient(145deg,#fff8d9,#fffdf3);border:1px solid #eddfa2}.english-speaking-card{background:linear-gradient(145deg,#e4f5f2,#f5fbfa);border:1px solid #cae4df}.word-target{display:flex;align-items:end;gap:8px;margin-top:20px}.word-target strong{font:700 46px/1 'DM Sans';color:#d09b48}.word-target span{font:700 8px 'DM Sans';letter-spacing:1px;color:#ac946a;padding-bottom:5px}.word-samples{display:flex;flex-wrap:wrap;gap:7px;margin:17px 0 22px}.word-samples b{border:1px solid rgba(211,177,92,.25);border-radius:13px;background:rgba(255,255,255,.72);color:#7c714f;padding:7px 10px;font:600 9px 'DM Sans'}.english-word-card>button{width:100%;min-height:44px;border:0;border-radius:12px;background:#edc75d;color:#604e2b;font-size:10px;font-weight:700;cursor:pointer;box-shadow:0 7px 15px rgba(191,151,50,.18)}.english-word-card>button.completed{background:#76b7aa;color:#fff;box-shadow:0 7px 15px rgba(74,140,128,.16)}.speaking-timer{width:170px;height:170px;margin:21px auto;display:grid;place-content:center;border:12px solid rgba(255,255,255,.8);border-radius:50%;background:#d5efea;box-shadow:inset 0 0 0 1px #b9ddd7,0 10px 23px rgba(86,146,142,.12);font:700 38px 'DM Sans';letter-spacing:2px;color:#438b90}.speaking-actions{display:flex;gap:8px}.speaking-actions button{min-height:44px;flex:1;border:1px solid #c8e1dd;border-radius:11px;background:rgba(255,255,255,.82);color:#5c7e84;font-size:9px;cursor:pointer}.speaking-actions button:first-child{border-color:#5aa8aa;background:#5aa8aa;color:#fff}.english-progress-card{order:-1;grid-column:1/-1;display:grid!important;grid-template-columns:86px 1fr auto;gap:20px;align-items:center;background:linear-gradient(110deg,#fff,#f8fcf7);border:1px solid #d7e8e4}.english-progress-card>img{width:82px;height:82px;border-radius:20px;object-fit:cover;mix-blend-mode:multiply}.english-progress-copy>span{font:700 8px 'DM Sans';letter-spacing:1.4px;color:#c88671}.english-progress-copy h3{font-size:20px;margin:5px 0}.english-progress-copy p{font-size:9px}.english-progress-card>strong{font:700 30px 'DM Sans';color:#4e9598}.english-progress-track{height:9px;border-radius:10px;background:#e8f1ee;overflow:hidden;margin-top:15px}.english-progress-track i{display:block;width:0;height:100%;border-radius:inherit;background:linear-gradient(90deg,#efcf68,#72b7ad);transition:width .3s}
@media(max-width:1020px){.skill-path-card{grid-template-columns:1fr}.path-stages article:first-child{border-left:0}.growth-planner{grid-template-columns:1fr 1fr}.growth-planner>button{justify-self:start}.outfit-gallery{grid-template-columns:repeat(3,1fr)}}@media(max-width:780px){.path-stages{grid-template-columns:repeat(2,1fr)}.library-list article{grid-template-columns:45px 1fr 70px}.library-list article>button{grid-column:2}.simple-heading{align-items:start;gap:10px}.recommend-meta{gap:13px;flex-wrap:wrap}.recommend-meta>i{display:none}.growth-planner{grid-template-columns:1fr}.outfit-upload-bar{grid-template-columns:1fr auto}.outfit-style-select{grid-column:1/-1}.outfit-gallery{grid-template-columns:repeat(2,1fr)}.english-simple-grid{grid-template-columns:1fr}}@media(max-width:540px){.path-stages{grid-template-columns:1fr}.recommend-main{grid-template-columns:1fr}.library-list article{grid-template-columns:45px 1fr}.library-list article>em{grid-column:2}.learning-status span{display:none}.growth-planner label{flex-direction:column}.growth-planner select{width:100%}.outfit-upload-bar{grid-template-columns:1fr}.outfit-gallery{grid-template-columns:1fr 1fr}.speaking-timer{font-size:34px}.speaking-actions{flex-wrap:wrap}.speaking-actions button{min-width:80px}}