:root{--blue:#004fc5;--bright:#006bff;--ink:#111;--muted:#666;--panel:#f3f3f3;--line:#d6d6d6;--green:#7fe69b;--red:#ff7777}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;min-width:320px;color:var(--ink);font-family:"Noto Sans SC","Microsoft YaHei","PingFang SC",Arial,sans-serif;line-height:1.55}button,input,select,textarea{font:inherit}button,a{touch-action:manipulation}a{color:inherit;font-weight:700;text-underline-offset:3px}svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;stroke-linejoin:round}.sr-only{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.topbar{position:sticky;top:0;z-index:20;display:grid;grid-template-columns:210px 130px minmax(380px,620px) auto;align-items:center;gap:14px;min-height:64px;padding:9px 24px;background:#000;color:#fff}.logo{display:grid;grid-template-columns:58px 112px;width:170px;height:42px;background:#fff;color:#000;font-size:21px;font-weight:900;text-decoration:none}.logo span,.logo strong{display:grid;place-items:center}.logo span{background:var(--bright);color:#fff}.type-toggle{display:flex;align-items:center;gap:8px;border:0;background:none;color:#ddd;cursor:pointer}.type-toggle .small-icon{width:15px}.search{display:grid;grid-template-columns:1fr 1fr}.search label{position:relative}.search label>svg{position:absolute;z-index:1;top:12px;left:18px;color:#777}.search input{width:100%;height:44px;border:0;padding:0 16px 0 47px;background:#eee;outline:0}.search label:first-child input{border-right:1px solid #ccc;border-radius:99px 0 0 99px}.search label:last-child input{border-radius:0 99px 99px 0}.account-nav{display:flex;align-items:center;justify-content:flex-end;gap:10px}.account-nav a{color:#ddd;font-size:14px;text-decoration:none}.outline-pill,.help-pill{display:grid;place-items:center;min-width:70px;height:36px;border-radius:99px}.outline-pill{border:1px solid #666}.help-pill{background:#eee;color:#111!important}
.ad{color:#999;font-size:11px;text-align:center}.ad-top{height:145px;padding-top:18px}.mini-profile{display:flex;align-items:center;gap:15px;max-width:1184px;margin:0 auto 22px;padding:12px 24px;border-bottom:1px solid #eee}.mini-profile strong,.mini-profile span{display:block}.mini-profile span{color:#555;font-size:13px}.circle-icon,.icon-only{display:grid;place-items:center;border:0;background:transparent;cursor:pointer}.circle-icon{width:38px;height:38px;border-radius:50%;background:#eee}.mini-actions{display:flex;gap:8px;margin-left:auto}.mini-link{height:38px;padding:0 22px;border:0;border-radius:99px;background:var(--blue);color:#fff;font-weight:800;cursor:pointer}.mini-link.secondary{border:1px solid #111;background:#fff;color:#111}
.profile-shell,.content-shell{display:grid;grid-template-columns:370px 440px minmax(0,300px);gap:38px;max-width:1200px;margin:auto;padding:0 24px}.profile-main{grid-column:1}.profile-side{grid-column:2}.score-row{margin-top:4px}.big-score{font-size:86px;font-weight:900;line-height:.9}.score-denominator{color:#777;font-size:20px;font-weight:800}.score-row p{margin:12px 0 30px;font-size:14px;font-weight:700}.identity-row{display:grid;grid-template-columns:118px minmax(0,1fr);gap:18px}.teacher-photo{position:relative;display:grid;place-items:center;width:118px;aspect-ratio:1;padding:0;border:1px dashed #999;border-radius:3px;overflow:hidden;background:#eee;color:#555;cursor:pointer}.teacher-photo.has-photo{border:0;background:transparent}.teacher-photo img{display:block;width:100%;height:100%;object-fit:cover;object-position:center}.photo-placeholder{display:grid;place-items:center;gap:4px}.photo-placeholder svg{width:28px;height:28px}.photo-placeholder b{font-size:12px}.photo-placeholder small{font-size:11px}.name-line{display:flex;align-items:flex-start;gap:8px}.name-line h1{flex:1;margin:-5px 0 12px;font-size:38px;font-weight:900;line-height:1.12;overflow-wrap:anywhere}.bookmark{width:34px;height:38px;color:#777}.bookmark svg{width:25px;height:25px}.bookmark.saved svg{fill:var(--blue);color:var(--blue)}.identity-copy p{margin:0;font-size:14px}.stat-pair{display:flex;gap:22px;margin:32px 0 25px}.stat-pair div+div{padding-left:22px;border-left:1px solid #111}.stat-pair strong{display:block;font-size:33px;font-weight:900}.stat-pair span{font-size:13px}.primary-actions{display:grid;grid-template-columns:1fr 1fr;gap:12px}.rate-button,.compare-button,.primary-button,.section-rate{display:flex;align-items:center;justify-content:center;gap:7px;min-height:46px;border-radius:99px;font-weight:800;cursor:pointer}.rate-button,.primary-button{border:0;background:var(--blue);color:#fff}.compare-button{border:1px solid #111;background:#fff;color:var(--blue)}.rate-button svg,.compare-button svg{width:18px}.local-note{display:flex;align-items:center;gap:7px;margin:18px 0 0;color:#777;font-size:12px}.local-note svg{width:16px}.distribution,.similar{background:#f4f4f4}.distribution{margin-top:48px;padding:18px}.distribution h2,.similar h2{margin:0 0 16px;font-size:18px}.distribution ul{display:grid;gap:13px;margin:0;padding:0;list-style:none}.distribution li{display:grid;grid-template-columns:68px 1fr 36px;align-items:center;gap:12px;font-size:14px}.bar-track{height:33px;background:#e2e2e2}.bar-fill{height:100%;min-width:2px;background:var(--blue)}.distribution strong{text-align:right}.similar{margin-top:32px;padding:16px}.similar-list{display:grid;grid-template-columns:repeat(3,1fr);gap:9px}.similar-list a{display:block;text-decoration:none;font-size:12px}.similar-list b{display:grid;place-items:center;height:38px;margin-bottom:7px;background:var(--blue);color:#fff;font-size:16px}.similar-list span{font-weight:700}
.content-shell{grid-template-columns:minmax(300px,810px) minmax(0,300px);margin-top:45px}.ratings-column{grid-column:1}.right-rail{grid-column:2}.section-head{display:flex;align-items:center;justify-content:space-between;border-bottom:1px solid #ccc}.section-head h2{position:relative;margin:0;padding:17px 0 15px;font-size:19px}.section-head h2:after{position:absolute;right:0;bottom:-1px;left:0;height:4px;background:#111;content:""}.section-rate{min-height:36px;padding:0 16px;border:0;background:var(--blue);color:#fff}.section-rate svg{width:16px}.filter-row{display:flex;align-items:center;gap:18px;margin:22px 0 16px}.course-filter{position:relative;display:flex;align-items:center;width:360px;max-width:100%;border-bottom:1px solid #111}.course-filter select{width:100%;height:38px;border:0;padding-right:28px;background:#fff;font-weight:700;appearance:none;outline:0}.course-filter svg{position:absolute;right:2px;width:17px;pointer-events:none}.filter-row>span{color:#777;font-size:13px}.ratings-list{display:grid;gap:18px}.rating-card{display:grid;grid-template-columns:120px minmax(0,1fr);gap:20px;padding:20px;background:var(--panel)}.rating-metrics{display:grid;align-content:start;gap:10px}.metric{min-height:76px;padding:9px;background:var(--red)}.metric.good{background:var(--green)}.metric.mid{background:#ffe27b}.metric span{display:block;font-size:12px;font-weight:900}.metric strong{font-size:32px}.rating-head{display:flex;align-items:baseline;justify-content:space-between;gap:14px}.rating-head a{font-size:15px}.rating-head time{color:#666;font-size:13px}.rating-meta{display:flex;flex-wrap:wrap;gap:5px 17px;margin:10px 0 15px}.rating-meta span{font-size:13px}.rating-meta b{color:#555}.rating-body>p{margin:0 0 16px;font-size:15px}.tags{display:flex;flex-wrap:wrap;gap:7px;margin-bottom:17px}.tags span{padding:6px 9px;background:#e1e1e1;font-size:11px;font-weight:800}.rating-actions{display:flex;align-items:center;gap:9px}.rating-actions button{display:flex;align-items:center;gap:5px;border:0;background:none;color:#666;font-size:12px;cursor:pointer}.rating-actions svg{width:17px}.rating-actions .share-action{margin-left:auto}.empty-state{padding:45px;background:#f5f5f5;text-align:center}.tall-ad{position:sticky;top:88px;min-height:280px;padding-top:16px}.site-footer{max-width:1184px;margin:70px auto 0;padding:35px 24px 50px;color:#666;text-align:center;font-size:12px}.site-footer nav{display:flex;flex-wrap:wrap;justify-content:center;gap:12px 25px}.site-footer .footer-logo{display:block;margin:20px auto 5px;color:#111;font-size:20px;font-weight:900;text-decoration:none}
.modal{width:min(680px,calc(100% - 28px));max-height:90vh;padding:0;border:0;border-radius:6px;box-shadow:0 20px 70px #0006}.modal::backdrop{background:#0009}.modal form>header{position:sticky;top:0;z-index:2;display:flex;align-items:flex-start;justify-content:space-between;padding:24px 26px 18px;border-bottom:1px solid #ddd;background:#fff}.modal h2{margin:2px 0 0;font-size:25px}.modal-kicker{color:var(--blue);font-size:12px;font-weight:900}.close-modal{width:38px;height:38px;border-radius:50%;background:#eee}.form-grid{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding:24px 26px}.form-grid label{position:relative;display:grid;gap:7px;font-size:13px;font-weight:800}.form-grid input,.form-grid select,.form-grid textarea{width:100%;border:1px solid #aaa;border-radius:3px;padding:11px 12px;background:#fff;outline:0}.form-grid input:focus,.form-grid select:focus,.form-grid textarea:focus{border-color:var(--blue);box-shadow:0 0 0 2px #006bff22}.full-field{grid-column:1/-1}.full-field small{position:absolute;right:10px;bottom:8px;color:#777;font-weight:500}.modal form>footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 26px 24px}.text-button{border:0;background:none;font-weight:800;cursor:pointer}.primary-button{min-width:132px;padding:0 24px}.score-inputs{display:grid;grid-template-columns:1fr 1fr;gap:20px;padding:22px 26px 0}.score-inputs fieldset{margin:0;padding:0;border:0}.score-inputs legend{margin-bottom:9px;font-size:13px;font-weight:800}.rating-choice{display:grid;grid-template-columns:repeat(5,1fr);gap:6px}.rating-choice label{cursor:pointer}.rating-choice input{position:absolute;opacity:0}.rating-choice span{display:grid;place-items:center;height:40px;border:1px solid #bbb;background:#fff;font-weight:900}.rating-choice input:checked+span{border-color:var(--blue);background:var(--blue);color:#fff}.toast{position:fixed;right:24px;bottom:24px;z-index:50;padding:12px 18px;border-radius:4px;background:#111;color:#fff;opacity:0;transform:translateY(8px);transition:.2s;pointer-events:none}.toast.show{opacity:1;transform:none}
@media(max-width:1080px){.topbar{grid-template-columns:180px 120px 1fr}.account-nav{display:none}.profile-shell{grid-template-columns:340px minmax(390px,1fr)}.content-shell{grid-template-columns:1fr}.right-rail{display:none}}@media(max-width:780px){.topbar{position:static;grid-template-columns:1fr;padding:12px 16px}.type-toggle{display:none}.search{grid-template-columns:1fr;gap:8px}.search label:first-child input,.search label:last-child input{border:0;border-radius:99px}.ad-top{height:62px}.mini-profile{display:none}.profile-shell{grid-template-columns:1fr;gap:25px}.profile-side{grid-column:1}.distribution{margin-top:0}.content-shell{margin-top:28px}.rating-card{grid-template-columns:1fr}.rating-metrics{grid-template-columns:1fr 1fr}.form-grid,.score-inputs{grid-template-columns:1fr}.full-field{grid-column:auto}}@media(max-width:500px){.profile-shell,.content-shell{padding:0 16px}.identity-row{grid-template-columns:92px 1fr}.teacher-photo{width:92px}.name-line h1{font-size:29px}.stat-pair{gap:14px}.stat-pair div+div{padding-left:14px}.stat-pair strong{font-size:28px}.primary-actions{grid-template-columns:1fr}.similar-list{grid-template-columns:1fr 1fr 1fr}.section-rate{font-size:0;width:38px;padding:0}.section-rate svg{width:18px}.rating-card{padding:16px}.rating-head{align-items:flex-start;flex-direction:column;gap:4px}.modal form>header,.form-grid,.score-inputs,.modal form>footer{padding-left:18px;padding-right:18px}}
.ad{display:none!important}.content-shell{grid-template-columns:minmax(0,1fr)}.right-rail{display:none}.section-head h2{font-size:27px}.section-rate{min-height:44px;font-size:16px}.course-filter select{font-size:17px}.filter-row>span{font-size:15px}.rating-card{grid-template-columns:150px minmax(0,1fr);gap:28px;padding:28px}.metric{min-height:94px;padding:12px}.metric span{font-size:15px}.metric strong{font-size:42px}.rating-head a{font-size:20px}.rating-head time{font-size:16px}.rating-meta{gap:8px 22px;margin:14px 0 20px}.rating-meta span{font-size:17px}.rating-body>p{font-size:19px;line-height:1.75}.tags{gap:9px;margin-bottom:22px}.tags span{padding:8px 11px;font-size:14px}.rating-actions button{font-size:15px}.rating-actions svg{width:20px;height:20px}
.metric{display:grid;place-items:center;align-content:center;gap:8px;text-align:center}.metric strong{font-weight:900;line-height:1}.metric span{width:100%;text-align:center}
.rating-body>p{white-space:pre-line}

/* Shared layout: desktop, tablet and mobile use the same content hierarchy. */
[hidden]{display:none!important}
:focus-visible{outline:3px solid #006bff;outline-offset:3px}
.rating-choice input:focus-visible+span{outline:3px solid #006bff;outline-offset:3px}

.search{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:0}
.search input{min-width:0;font-size:16px}


.template-note,.storage-notice{max-width:1184px;margin:18px auto;padding:0 24px;color:#666;font-size:14px}
.storage-notice{padding:16px 24px;color:#8a2910;background:#fff2e8}
.profile-shell{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:36px;padding-top:24px}
.profile-main,.profile-side,.identity-copy,.rating-body,.ratings-column{min-width:0}
.profile-side{grid-column:2}
.distribution{margin-top:0}
.name-line h1{font-size:clamp(28px,3vw,38px)}
.identity-row{align-items:start}
.teacher-photo{height:auto}
.rating-card{grid-template-columns:120px minmax(0,1fr);gap:24px;padding:24px}
.rating-metrics{grid-template-columns:1fr}
.rating-body{overflow-wrap:anywhere}
.rating-head{flex-wrap:wrap}
.rating-head a{font-size:18px}
.rating-head time{white-space:nowrap;font-size:14px}
.rating-meta span{font-size:14px}
.rating-body>p{font-size:17px;line-height:1.8}
.rating-actions{flex-wrap:wrap}
.rating-actions button{min-height:40px}
.rating-actions button[aria-pressed=true]{color:var(--blue);font-weight:800}
.section-head{gap:16px}
.section-head h2{font-size:24px}
.section-rate{flex-shrink:0}
.modal{overscroll-behavior:contain}
.form-grid input,.form-grid select,.form-grid textarea{min-width:0;font-size:16px}
.form-grid label{min-width:0}
.toast{max-width:min(560px,calc(100vw - 32px));right:16px;bottom:16px}
.help-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;border-bottom:1px solid #ddd}
.help-header h2{font-size:24px}
.help-content{padding:8px 24px 24px;line-height:1.8}
.teacher-manager{flex-wrap:wrap}
.teacher-manager label{flex:1;min-width:0}
.teacher-manager select{width:100%;min-width:0;max-width:100%}
.teacher-manager button{flex-shrink:0}
@media(max-width:1000px){

 .profile-shell{grid-template-columns:1fr;gap:28px}
 .profile-side{grid-column:1;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:24px;align-items:start}
 .similar{margin-top:0}
 .identity-row{grid-template-columns:140px minmax(0,1fr)}.teacher-photo{width:140px}
 .name-line h1{font-size:36px}
 .primary-actions{max-width:560px}
 .mini-profile{display:none}
}
@media(max-width:780px){

 .profile-side{grid-template-columns:1fr}
 .rating-card{grid-template-columns:minmax(0,1fr);padding:20px;gap:18px}
 .rating-metrics{grid-template-columns:1fr 1fr;gap:12px}
 .metric{min-height:80px;padding:10px}.metric strong{font-size:34px}
 .rating-head{flex-direction:row;align-items:baseline}
 .rating-meta{gap:6px 16px;margin:12px 0}
 .section-head h2{font-size:21px}
 .section-rate{font-size:14px;min-height:40px}
 .filter-row{flex-wrap:wrap;gap:8px}
 .form-grid,.score-inputs{grid-template-columns:1fr}
}
@media(max-width:500px){
 .template-note,.storage-notice{padding-left:16px;padding-right:16px}
 .profile-shell,.content-shell{padding-left:16px;padding-right:16px}
 .identity-row{grid-template-columns:92px minmax(0,1fr);gap:16px}
 .teacher-photo{width:92px}.name-line h1{font-size:28px}
 .big-score{font-size:76px}.stat-pair strong{font-size:28px}
 .teacher-manager .manager-button,.teacher-manager .mode-button{width:auto;padding:0 12px;font-size:13px;min-height:44px}
 .teacher-manager label{flex-basis:100%;font-size:13px}
 .teacher-manager .mode-button{margin-left:auto}
 .teacher-manager{gap:8px}
 .primary-actions{grid-template-columns:1fr}
 .section-rate{width:auto;font-size:13px;padding:0 12px}
 .section-head h2{font-size:19px}
 .rating-card{padding:16px}.rating-head{flex-direction:column;gap:4px}
 .rating-body>p{font-size:16px}
 .modal form>footer{flex-wrap:wrap}
}
@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}*{transition:none!important}}
.modal form>footer .text-button{width:auto;min-width:64px;height:auto;min-height:44px;padding:8px 12px;white-space:nowrap;border-radius:4px;background:none}
@media(max-width:500px){body .teacher-manager label{flex:1 0 100%}}

/* Preserve the original navigation design; search submits with Enter. */
.topbar{grid-template-columns:170px 110px minmax(0,1fr) auto}
.search-submit{border:0;padding:0}
@media(max-width:1080px){.topbar{grid-template-columns:170px 110px minmax(0,1fr)}.account-nav{display:none}}
@media(max-width:780px){.topbar{grid-template-columns:1fr}.search{grid-template-columns:1fr;gap:8px}.type-toggle{display:none}}

/* Portrait presentation matches the original 3:4 composition. */
@media(min-width:800px) and (max-aspect-ratio:4/5){
 .template-note{display:none}
 .mini-profile{display:none}
 .teacher-manager{max-width:1600px;padding:0 clamp(32px,4.4vw,64px);margin:30px auto 26px;align-items:end}
 .teacher-manager label{flex:0 1 400px;font-size:14px}
 .teacher-manager select{height:48px;font-size:clamp(15px,1.5vw,21px)}
 .teacher-manager .mode-button{margin-left:auto;height:48px;font-size:clamp(14px,1.4vw,20px)}
 .profile-shell{max-width:1600px;min-height:calc(100svh - 210px);padding:24px clamp(32px,5.55vw,80px) 32px;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr);gap:36px}
 .profile-main{display:grid;grid-template-columns:minmax(0,1.9fr) minmax(0,1fr);grid-template-areas:"score score" "identity stats" "identity actions";column-gap:clamp(24px,5vw,72px);row-gap:18px;align-items:center}
 .score-row{grid-area:score;margin:8px 0 18px}
 .big-score{font-size:clamp(96px,12.5vw,180px)}
 .score-denominator{font-size:clamp(23px,2.8vw,40px)}
 .score-row p{font-size:clamp(17px,1.9vw,27px);margin:18px 0 0}
 .identity-row{grid-area:identity;grid-template-columns:clamp(140px,21.7vw,312px) minmax(0,1fr);gap:clamp(20px,3.4vw,49px);align-items:center}
 .teacher-photo{width:100%}
 .name-line h1{font-size:clamp(32px,5.5vw,79px);line-height:1.08;margin:0 0 16px}
 .identity-copy p{font-size:clamp(17px,2vw,29px);line-height:1.6}
 .bookmark{width:32px;flex-shrink:0}
 .stat-pair{grid-area:stats;margin:0;align-self:end;gap:clamp(14px,2vw,29px)}
 .stat-pair div+div{padding-left:clamp(14px,2vw,29px)}
 .stat-pair strong{font-size:clamp(30px,4.2vw,60px);white-space:nowrap}
 .stat-pair span{font-size:clamp(13px,1.6vw,23px);white-space:nowrap}
 .primary-actions{grid-area:actions;align-self:start;grid-template-columns:1fr;max-width:none;width:100%}
 .rate-button,.compare-button{min-height:clamp(48px,4.8vw,69px);font-size:clamp(16px,1.8vw,26px)}
 .profile-side{grid-column:1;display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:minmax(330px,1.8fr) minmax(210px,1fr);gap:28px}
 .distribution,.similar{margin:0;padding:clamp(24px,2.5vw,36px);display:flex;flex-direction:column}
 .distribution h2,.similar h2{font-size:clamp(26px,2.9vw,42px);margin:0 0 24px}
 .distribution ul{flex:1;align-content:space-between;gap:26px}
 .distribution li{grid-template-columns:clamp(88px,10vw,144px) minmax(0,1fr) 64px;gap:20px;font-size:clamp(18px,2vw,29px)}
 .bar-track{height:clamp(32px,3.2vw,46px)}
 .similar-list{flex:1;align-items:center;gap:18px}
 .similar-list b{height:clamp(46px,4.8vw,69px);font-size:clamp(23px,2.7vw,39px)}
 .similar-list span{font-size:clamp(18px,1.9vw,27px)}
 .content-shell{max-width:1600px;padding:24px clamp(32px,5.55vw,80px)}
}
@media(min-width:1081px) and (max-aspect-ratio:4/5){
 .topbar{grid-template-columns:220px 120px minmax(0,1fr) auto;gap:20px;padding:16px 32px;min-height:95px}
 .logo{grid-template-columns:68px 1fr;width:220px;height:58px;font-size:27px}
 .type-toggle{font-size:21px}
 .search input{height:60px;font-size:23px;padding-left:54px}
 .search label>svg{top:20px;left:20px;width:22px;height:22px}
 .account-nav{display:flex;gap:14px}
 .account-nav a{font-size:20px}
 .outline-pill,.help-pill{min-width:74px;height:44px}
}
.search label:nth-of-type(2) input{border-radius:0 99px 99px 0}
@media(max-width:780px){.search label:nth-of-type(2) input{border-radius:99px}}
@media(min-width:800px) and (max-aspect-ratio:4/5){body .teacher-manager{max-width:1600px;padding:0 clamp(32px,4.4vw,64px);margin:30px auto 26px}}

/* Crop the original image in the viewport; preserve every code pixel. */
.appreciation-code{position:relative;width:260px;max-width:80%;aspect-ratio:1;margin:20px auto 0;overflow:hidden;background:#fff}
.appreciation-code img{position:absolute;display:block;width:192%;max-width:none;height:auto;left:-46%;top:-23.333333%}

.appreciation-card{max-width:380px;margin:28px auto 0;padding:24px 0 0;border-top:1px solid #d6d6d6;color:#111}
.appreciation-card h2{margin:0;font-size:19px;font-weight:800;line-height:1.5}
.appreciation-intro{margin:10px 0 0;color:#666;font-size:14px;line-height:1.7}
.appreciation-card .appreciation-code{width:180px;max-width:100%;margin:18px auto 0}
