:root{--plum:#4A2C3D;--ink:#4A2C3D;--muted:#766d70;--paper:#F7F2EA;--line:#e6ded9;--cream:#f2ece5;--olive:#6B4E8C;--rose:#eee5e8}*{box-sizing:border-box}html{scroll-behavior:smooth;scroll-padding-top:90px}body{margin:0;background:var(--paper);color:var(--ink);font-family:'Lora',serif;font-size:15px;line-height:1.7}button,input,select{font:inherit}button,a{-webkit-tap-highlight-color:transparent}button,a.button{cursor:pointer}a{color:inherit;text-decoration:none}button{color:inherit}button:disabled{opacity:.55;cursor:wait}button:focus-visible,a:focus-visible,input:focus-visible{outline:3px solid #B89968;outline-offset:4px}img{max-width:100%;display:block}h1,h2,h3,p{margin:0}h1,h2,h3{font-family:'Playfair Display',serif;line-height:1.2;letter-spacing:-1.3px}h2{font-size:36px;font-weight:600}h3{font-size:28px;font-weight:600}p{color:var(--muted)}.topbar{height:98px;padding:0 5%;display:flex;align-items:center;justify-content:space-between;gap:25px;border-bottom:1px solid var(--line);background:var(--paper)}.brand{display:flex;align-items:center;gap:14px;font-size:13px;letter-spacing:2px;font-weight:700;line-height:1.6}.brand small{display:block;font-size:8px;letter-spacing:1.3px;color:var(--muted);font-weight:500}.monogram{font-family:'Playfair Display',serif;font-size:38px;letter-spacing:-4px;font-weight:400;border-right:1px solid var(--line);padding-right:18px;color:var(--plum)}.monogram span{color:#B89968}.topbar nav{display:flex;gap:27px;font-size:12px}.topbar nav a:hover{color:#6B4E8C}.button{border:1px solid var(--plum);border-radius:7px;background:var(--plum);color:#fffaf2;padding:14px 23px;display:inline-flex;align-items:center;justify-content:center;gap:25px;font-weight:500;font-size:13px;line-height:1.5;transition:background .2s,transform .2s}.button:hover{background:#6B4E8C;transform:translateY(-1px)}.button.light{background:transparent;color:var(--plum);border-color:#cfc1c8}.button.light:hover{background:var(--rose)}.button.small{padding:11px 16px;font-size:12px}.wide{width:100%}.hero{position:relative;margin:24px 3% 0;border-radius:16px;overflow:hidden;min-height:590px;background:#efe7dc;isolation:isolate}.hero>img{position:absolute;width:100%;height:100%;object-fit:cover;z-index:-2}.hero:after{content:'';position:absolute;inset:0;z-index:-1;background:linear-gradient(90deg,rgba(244,236,223,.7),transparent 60%)}.hero-copy{padding:65px 5%;width:51%;max-width:650px}.eyebrow{font-size:10px;letter-spacing:2.2px;font-weight:600;color:var(--olive);display:block;margin-bottom:20px}.hero h1{font-size:57px;font-weight:500;letter-spacing:-2.7px;color:var(--plum)}.hero h1 em{font-style:normal;color:#6B4E8C}.hero p{font-size:14px;line-height:1.9;max-width:340px;margin:25px 0 28px;color:#605953}.hero-note{position:absolute;bottom:30px;right:36px;font-size:9px;letter-spacing:2px;color:#fff;text-shadow:0 1px 10px #362734}.hero-note strong{display:block;font-size:12px;letter-spacing:.1px;font-weight:400}.intro-strip{padding:24px 9%;display:flex;justify-content:space-between;border-bottom:1px solid var(--line);gap:15px;color:#9e8b8b;font-family:'Lora',serif;font-size:13px}.intro-strip b{font-family:'Lora',serif;font-size:11px;letter-spacing:.3px;color:#665b60;font-weight:400;margin-left:15px}.section{max-width:1240px;margin:0 auto;padding:75px 40px}.section-heading{display:flex;justify-content:space-between;align-items:end;gap:30px;margin-bottom:34px}.section-heading .eyebrow{margin-bottom:13px}.section-heading p{font-size:12px;line-height:1.8}.course-card{display:grid;grid-template-columns:43% 57%;border:1px solid var(--line);border-radius:14px;overflow:hidden;background:white}.course-art{position:relative;min-height:370px;background:var(--plum)}.course-art img{height:100%;width:100%;object-fit:cover}.art-label{position:absolute;top:30px;left:30px;color:#f5eadb;font-size:30px;letter-spacing:1px;font-family:'Lora',serif;line-height:1.4}.art-label small{font-family:'Lora',serif;letter-spacing:2px;font-size:8px}.course-copy{padding:40px}.pill{display:inline-block;border:1px solid var(--line);background:var(--paper);color:var(--olive);padding:5px 11px;border-radius:30px;font-size:9px;letter-spacing:.8px}.course-copy h3{font-size:39px;margin:21px 0 15px;color:var(--plum)}.course-copy p{font-size:13px;line-height:1.9}.course-details{display:flex;gap:16px;font-size:10px;color:var(--olive);margin:22px 0}.course-details span+span{border-left:1px solid var(--line);padding-left:16px}.actions{display:flex;gap:10px;flex-wrap:wrap}.caption,.course-copy .caption{font-size:10px;line-height:1.8;margin-top:15px}.dashboard-section{max-width:none;background:var(--cream);padding:60px max(40px,calc((100% - 1160px)/2))}.empty-state{text-align:center;padding:40px 25px;border:1px dashed #d8cbd0;border-radius:12px;background:rgba(255,255,255,.4)}.empty-state h3{font-size:23px;margin:10px 0}.empty-state p{font-size:12px;margin-bottom:20px}.empty-icon{font-size:27px;color:var(--olive)}.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:24px 0}.stat{padding:23px 25px;background:white;border-radius:10px;border:1px solid var(--line)}.stat small{font-size:10px;color:var(--muted)}.stat strong{font-family:'Lora',serif;display:block;font-size:35px;line-height:1.6;color:var(--plum)}.student-welcome{display:flex;justify-content:space-between;align-items:center;gap:20px}.student-welcome h3{font-size:24px}.student-welcome p{font-size:12px}.history{display:flex;gap:10px;overflow:auto;padding-bottom:10px}.day-item{min-width:138px;background:#fff9;border:1px solid var(--line);border-radius:8px;padding:13px 18px;font-size:10px}.day-item strong{display:block;font-size:18px;color:var(--olive)}.segmented{display:flex;padding:4px;background:#eee8e9;border-radius:8px}.segmented button{background:transparent;border:0;padding:9px 16px;border-radius:5px;font-size:12px;cursor:pointer}.segmented .active{background:#fff;color:var(--plum);box-shadow:0 1px 4px #4A2C3D12}.ranking-layout{display:grid;grid-template-columns:1.65fr 1fr;gap:30px}.ranking-card{border:1px solid var(--line);border-radius:12px;overflow:hidden}.ranking-card .empty-state{border:0;height:100%;display:flex;flex-direction:column;align-items:center;justify-content:center}.rules{padding:32px;background:#F7F2EA;border-radius:12px}.rules h3{color:#4A2C3D;font-size:30px}.rules ul{padding-left:17px;font-size:12px;line-height:2.1;color:#4A2C3D}.rules .eyebrow{font-size:9px}.table-scroll{overflow:auto}table{width:100%;border-collapse:collapse;font-size:12px;text-align:left}th{padding:15px 20px;font-size:9px;letter-spacing:1px;text-transform:uppercase;font-weight:500;background:#f5f1ed;color:var(--muted)}td{padding:16px 20px;border-bottom:1px solid var(--line)}tr:last-child td{border-bottom:0}.mine{background:#f2e9ef}.rank-number{display:inline-flex;border:1px solid #ddd2c6;border-radius:50%;width:28px;height:28px;align-items:center;justify-content:center;color:#B89968}td small{display:block;font-size:8px;color:var(--muted)}.closing{text-align:center;padding:62px 25px 75px;border-top:1px solid var(--line)}.closing h2{font-size:34px;color:var(--plum)}.closing p{font-size:12px;margin-top:24px}footer{border-top:1px solid var(--line);padding:35px 5%;display:flex;align-items:center;justify-content:space-between;gap:25px}footer>div{display:flex;flex-direction:column;font-size:9px;letter-spacing:1px;line-height:2.3}dialog{border:1px solid var(--line);border-radius:16px;padding:34px;max-width:480px;width:calc(100% - 30px);max-height:90vh;box-shadow:0 25px 100px #24102133;color:var(--ink);background:var(--paper)}dialog::backdrop{background:#271b2c88;backdrop-filter:blur(5px)}dialog .eyebrow{font-size:8px;margin-right:12px}dialog h2{font-size:30px;margin-bottom:22px}.close{position:absolute;right:13px;top:7px;background:none;border:0;font-size:27px;cursor:pointer}.auth-tabs{margin-bottom:20px}.auth-tabs button{flex:1}label{display:block;font-size:11px;margin:14px 0}input,select{display:block;width:100%;padding:12px 13px;border:1px solid #d9ced0;border-radius:6px;background:white;color:var(--ink);margin-top:6px}label small{color:var(--muted);font-size:10px}.check{display:flex;align-items:start;gap:9px;font-size:10px;line-height:1.8}.check input{width:16px;height:16px;flex-shrink:0;margin-top:2px;accent-color:var(--plum)}.check a{text-decoration:underline}.error{font-size:12px;color:#9b283a;margin:12px 0}.toast{position:fixed;bottom:20px;left:50%;transform:translateX(-50%);max-width:90%;z-index:20;padding:13px 22px;border-radius:8px;background:var(--plum);color:white;box-shadow:0 3px 25px #0002;font-size:12px}.page-head{max-width:1100px;margin:auto;padding:45px 30px 25px}.page-head p{margin-top:15px;font-size:13px}.quiz-shell{max-width:1000px;margin:10px auto 70px;padding:0 30px}.quiz-card{background:white;border:1px solid var(--line);border-radius:16px;padding:35px}.quiz-top{display:flex;justify-content:space-between;gap:15px;font-size:12px;color:var(--muted)}progress{width:100%;height:5px;accent-color:var(--olive);margin:20px 0 28px}.quiz-question{display:grid;grid-template-columns:1fr 1.3fr;gap:35px;align-items:center}.quiz-question.no-image{display:block}.quiz-diagram{height:350px;background:var(--cream);border-radius:12px;display:flex;justify-content:center}.quiz-diagram svg{height:100%;max-width:100%}.quiz-card h2{font-size:25px;line-height:1.5;margin-bottom:20px}.choices{display:grid;gap:10px}.choice{cursor:pointer;padding:15px;border:1px solid var(--line);border-radius:8px;text-align:left;background:var(--paper);font-size:13px}.choice.selected{border-color:var(--plum);background:var(--rose)}.choice strong{display:inline-block;margin-right:13px;font-family:'Lora',serif}.quiz-controls{display:flex;justify-content:space-between;margin-top:30px;gap:15px}.review-item{padding:15px 0;border-bottom:1px solid var(--line);font-size:12px}.review-item p{font-size:12px}.review-item a{text-decoration:underline}.result-score{font-size:70px;color:var(--plum);font-family:'Lora',serif}.result-score small{font-size:22px}.admin-wrap{max-width:1200px;margin:auto;padding:30px}.admin-tools{display:flex;gap:15px;flex-wrap:wrap;align-items:end;margin-bottom:25px}.admin-tools label{margin:0;min-width:160px}.admin-tools input{max-width:240px}.admin-login{max-width:430px;margin:50px auto}.privacy{max-width:780px;margin:auto;padding:55px 25px}.privacy h2{font-size:24px;margin:30px 0 12px}.privacy p{margin:12px 0}.text-link{text-decoration:underline;font-size:12px}.notice{padding:14px 18px;background:#fff4dc;border-radius:7px;font-size:12px;margin:15px 0} [hidden]{display:none!important}
@media(min-width:1500px){.hero{max-width:1500px;margin:24px auto 0}.hero-copy{padding-left:80px}.hero h1{font-size:64px}}
@media(max-width:1000px){.topbar nav{gap:14px;font-size:10px}.brand{font-size:11px}.brand small{font-size:7px}.hero{min-height:530px}.hero-copy{width:55%;padding:55px 5%}.hero h1{font-size:43px;letter-spacing:-1.7px}.hero p{max-width:270px}.course-copy{padding:28px}.course-details{flex-wrap:wrap;gap:10px}.course-details span+span{padding-left:10px}.course-copy h3{font-size:33px}.actions .button{font-size:11px;padding:12px 15px}.section{padding:55px 30px}.dashboard-section{padding:50px 30px}.ranking-layout{grid-template-columns:1.3fr 1fr}.stat{padding:20px 15px}.art-label{font-size:25px;left:22px}.section-heading h2{font-size:29px}}
@media(max-width:700px){.topbar{height:78px;padding:0 20px;gap:10px}.topbar nav{display:none}.brand{font-size:10px;letter-spacing:1px;gap:10px}.brand small{font-size:6px;letter-spacing:.8px}.monogram{font-size:32px;padding-right:12px}.button.small{font-size:10px;padding:10px 12px}.hero{margin:15px 15px 0;min-height:630px;border-radius:12px}.hero>img{object-position:69% bottom;height:60%;bottom:0}.hero:after{background:linear-gradient(#f2eadf 0%,#f2eadf 42%,transparent 72%)}.hero-copy{width:100%;padding:35px 26px}.hero h1{font-size:42px;letter-spacing:-1.8px}.hero .eyebrow{font-size:8px;letter-spacing:1.7px;margin-bottom:16px}.hero p{font-size:12px;max-width:270px;margin:16px 0 20px}.hero-note{display:none}.hero-copy .button{font-size:11px;padding:12px 17px}.intro-strip{padding:20px;gap:10px}.intro-strip>span{font-size:10px;display:flex;flex-direction:column}.intro-strip b{font-size:8px;margin:5px 0 0;letter-spacing:0}.section{padding:45px 20px}.section-heading{align-items:start;flex-direction:column;gap:18px;margin-bottom:25px}.section-heading h2{font-size:28px}.section-heading p{display:none}.eyebrow{font-size:9px}.course-card{grid-template-columns:1fr}.course-art{min-height:230px;height:230px}.course-copy{padding:26px}.course-copy h3{font-size:32px}.course-copy p{font-size:12px}.course-copy .caption{font-size:9px}.course-details{font-size:9px}.art-label{top:25px;left:25px;font-size:28px}.dashboard-section{padding:40px 20px}.stats{grid-template-columns:1fr 1fr;gap:10px}.stat{padding:17px}.stat strong{font-size:30px}.student-welcome{align-items:start;flex-direction:column}.student-welcome h3{font-size:22px}.ranking-layout{grid-template-columns:1fr;gap:20px}.rules{padding:26px}.rules h3{font-size:26px}.closing{padding:45px 23px}.closing h2{font-size:27px}.closing p{font-size:11px}footer{padding:30px 20px;flex-wrap:wrap}footer .brand{width:100%}footer>div{font-size:8px}td,th{padding:13px 12px}dialog{padding:28px 23px}.quiz-question{grid-template-columns:1fr;gap:23px}.quiz-diagram{height:270px}.quiz-shell{padding:0 15px}.quiz-card{padding:23px}.quiz-card h2{font-size:21px}.page-head{padding:30px 22px 20px}.page-head h1{font-size:30px}.quiz-controls .button{padding:12px 15px;font-size:11px}.admin-wrap{padding:20px}.admin-tools{align-items:stretch}.admin-tools label{min-width:100%}.admin-tools input{max-width:100%}.empty-state h3{font-size:21px}}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}

/* Bộ nhận diện Kim */
h1,h2,h3{font-family:"Playfair Display",serif;letter-spacing:-.5px}.hero h1{letter-spacing:-1px}.hero h1 em,.closing h2,blockquote{font-family:"Cormorant Garamond",serif;font-style:italic;font-weight:500}.button{background:#6B4E8C;border-color:#B89968}.button:hover{background:#4A2C3D}.button.light{color:#6B4E8C;border-color:#B89968}.hero-note{color:#F7F2EA}.art-label{font-family:"Playfair Display",serif}.stat strong{font-family:"Playfair Display",serif;font-size:29px}.hero-note strong{font-family:"Cormorant Garamond",serif;font-style:italic}.brand{color:#4A2C3D}.rules{border:1px solid #B89968}.caption{font-family:"Lora",serif}
.hero h1{font-size:clamp(30px,3.3vw,50px);line-height:1.25}.hero-copy{width:54%}.hero-copy>p{max-width:420px;font-size:12px}.course-card+.course-card{margin-top:25px}.course-copy h3{font-size:31px}.future-courses{display:grid;grid-template-columns:1fr 1fr;gap:40px;padding:35px;margin-top:25px;border:1px solid var(--line);border-radius:12px}.future-courses h3{font-size:25px}.future-courses p{font-size:13px;align-self:center}.portal-features{display:grid;grid-template-columns:repeat(3,1fr);gap:25px}.portal-features article{padding:30px;border:1px solid var(--line);border-radius:12px}.portal-features article>span{color:#B89968}.portal-features h3{font-size:26px;margin:20px 0 14px}.portal-features p{font-size:13px}.my-course-grid{display:grid;grid-template-columns:repeat(2,1fr);gap:20px;margin-top:25px}.my-course{padding:25px;background:white;border:1px solid var(--line);border-radius:12px}.my-course h3{font-size:24px}.my-course p{font-size:12px;margin:15px 0}.my-course strong{display:block;font-size:24px;margin-bottom:20px;color:#6B4E8C}.course-page{max-width:1150px;padding:45px 30px;margin:auto}.course-heading{padding:35px 0}.course-heading h1{font-size:44px;max-width:850px}.course-heading p{font-size:18px;margin-top:20px}.course-page .section-heading{margin-top:45px}.lesson-card{display:flex;gap:28px;padding:30px;margin:16px 0;border:1px solid var(--line);background:#fffaf5;border-radius:14px}.day-badge{min-width:75px;font-size:10px;color:#6B4E8C;letter-spacing:1.5px;text-align:center}.day-badge strong{display:block;font-family:'Playfair Display',serif;font-size:50px;line-height:1.6}.lesson-copy{flex:1}.lesson-copy h3{font-size:27px;margin:12px 0}.lesson-copy p{font-size:12px;margin:12px 0}.lesson-copy .actions{margin-top:20px}.course-rank{margin-top:55px}.course-rank .ranking-card{margin-top:25px}.essay{width:100%;min-height:220px;padding:18px;border:1px solid var(--line);border-radius:8px;font:15px/1.8 'Lora',serif;resize:vertical}.manage-grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}.manage-box{padding:25px;background:#fffaf5;border:1px solid var(--line);border-radius:12px;margin:20px 0}.manage-box h3{font-size:25px}.manage-box textarea{width:100%;min-height:130px;font:14px/1.7 'Lora',serif;padding:12px;border:1px solid var(--line);border-radius:8px}.submission-text{white-space:pre-wrap;font-size:14px;padding:20px;background:var(--cream);border-radius:8px}.manage-nav{display:flex;gap:15px;flex-wrap:wrap}.manage-nav a{text-decoration:underline}
@media(max-width:700px){.hero-copy{width:100%}.hero h1{font-size:31px;line-height:1.35}.hero-copy>p{font-size:10px;max-width:280px}.course-copy h3{font-size:27px}.future-courses,.portal-features,.my-course-grid,.manage-grid{grid-template-columns:1fr}.future-courses{padding:26px;gap:20px}.course-page{padding:25px 20px}.course-heading h1{font-size:34px}.course-heading p{font-size:15px}.lesson-card{gap:15px;padding:22px 16px}.day-badge{min-width:40px}.day-badge strong{font-size:37px}.lesson-copy h3{font-size:23px}.lesson-copy .button{font-size:11px;padding:12px}.course-page .stat strong{font-size:25px}}

.course-tools{margin:2rem 0}.course-tools>a{display:block;border:1px solid #4a2c3d22;border-radius:14px;padding:1.5rem;color:var(--plum,#4A2C3D);text-decoration:none}.course-tools>a:hover,.course-tools>a:focus-visible{border-color:#6B4E8C;background:#6b4e8c08}.course-tools>a>span{color:#B89968}.course-tools h3{margin:1rem 0 .5rem}.course-tools p{font-size:1rem;line-height:1.7;margin:0}.art-label{max-width:calc(100% - 3rem);font-size:clamp(1rem,1.5vw,1.25rem);line-height:1.5}#lessonList,#courseRank{scroll-margin-top:2rem}

.art-label{background:rgba(74,44,61,.94);padding:.6rem .8rem;border-radius:8px;max-width:calc(100% - 3rem)}

.closing .kim-message{max-width:780px;margin:24px auto 0;font-size:16px;line-height:1.9}.closing .hk-slogan{max-width:850px;margin:28px auto 0;padding-top:24px;border-top:1px solid #B89968;font-family:'Cormorant Garamond',serif;font-size:clamp(25px,2.3vw,32px);font-style:italic;font-weight:500;line-height:1.45;color:#6B4E8C}