.comp-hero{display:flex;align-items:center;justify-content:space-between;gap:24px;background:#fff3f8;border-bottom:3px solid #ed007b;padding:28px;overflow:hidden}.comp-hero h2{font-size:clamp(24px,3vw,36px);letter-spacing:-.04em;margin:8px 0}.comp-hero p{line-height:1.7}.comp-hero img{width:180px;height:210px;object-fit:contain}.comp-hero select{display:block;margin-top:8px;max-width:100%;padding:12px;border:1px solid #c8b9c3;background:white;border-radius:8px}.comp-stats{display:grid;grid-template-columns:repeat(4,1fr);gap:16px;margin:24px 0}.comp-stat{border-bottom:1px solid #ddd2dc;padding:18px 10px;display:flex;flex-direction:column;gap:8px}.comp-stat strong{font-size:30px;font-variant-numeric:tabular-nums;color:#16121b}.comp-stat span{font-size:14px;color:#605765}.comp-chart{padding:20px 0}.comp-bar{display:grid;grid-template-columns:minmax(110px,1fr) minmax(80px,2fr) 48px;align-items:center;gap:12px;margin:12px 0;font-size:14px}.comp-bar progress{width:100%;height:12px;accent-color:#ec007b}.comp-lessons{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}.comp-lessons article{padding:24px;border:1px solid #e3dbe4;background:white;border-radius:12px}.comp-lessons h3{margin:10px 0}.comp-lessons p{font-size:14px;line-height:1.7}.comp-lessons .pink-button{display:block;text-align:center;margin-top:18px}.comp-comment{padding:20px 0;border-bottom:1px solid #e1dce4}.comp-comment header{display:flex;align-items:center;gap:12px;flex-wrap:wrap}.comp-comment small{color:#655d6c}.comp-comment p{white-space:pre-wrap;overflow-wrap:anywhere;line-height:1.7}.comp-reply{border-left:3px solid #ed007b;padding:14px 20px;background:#fff3f8;margin-top:12px}.comp-feedback{margin:32px 0;padding:28px;background:#fff;border:1px solid #ded5e2;border-radius:12px}.comp-emotions{border:0;padding:0;display:grid;grid-template-columns:repeat(5,1fr);gap:10px}.comp-emotions legend{margin-bottom:12px;font-weight:700}.comp-emotions label{position:relative;display:flex;align-items:center;flex-direction:column;gap:8px;padding:14px 5px;background:#faf8fb;border:1px solid #e0d8e3;border-radius:12px;text-align:center;font-size:12px;cursor:pointer}.comp-emotions input{position:absolute;top:8px;left:8px;accent-color:#ed007b}.comp-emoji{font-size:32px;display:inline-block;transform-origin:50% 70%}.comp-emotions label:has(input:checked){border:2px solid #df006d;background:#fff0f7}.comp-emotions input:checked~.comp-emoji{animation:comp-cheer .7s ease-in-out 2}.comp-emotions label:focus-within{outline:2px solid #16121b;outline-offset:3px}.comp-form-row{display:grid;grid-template-columns:1fr 1fr;gap:16px}.comp-admin-tabs{display:flex;flex-wrap:wrap;gap:8px;margin:20px 0}.comp-mapping{max-height:60vh;overflow:auto}.comp-mapping article{padding:16px 0;border-bottom:1px solid #ddd}.comp-mapping .comp-form-row{grid-template-columns:repeat(3,1fr)}.comp-mapping input[type=datetime-local]{max-width:100%;font-size:13px}.comp-school{margin:14px 0}.comp-signal{padding:18px;border-bottom:1px solid #ddd}.comp-signal p{white-space:pre-wrap;overflow-wrap:anywhere}.comp-report-controls{display:flex;gap:12px;flex-wrap:wrap}.comp-report-controls select{max-width:100%;padding:10px}.comp-filters{display:flex;gap:12px;margin:16px 0;flex-wrap:wrap}.comp-notice{padding:16px;background:#fff3f8;border-left:3px solid #ed007b}.comp-mapping .check-line{display:flex;gap:8px;align-items:center}.comp-class-list article{display:flex;gap:16px;justify-content:space-between;padding:20px 0;border-bottom:1px solid #ddd}.comp-hero label{font-weight:700}.comp-feedback h2{font-size:25px}.comp-feedback textarea{width:100%}@keyframes comp-cheer{0%,100%{transform:rotate(0) scale(1)}30%{transform:rotate(-12deg) scale(1.2)}65%{transform:rotate(10deg) scale(1.12)}}@media(max-width:680px){.comp-hero{padding:20px;gap:8px}.comp-hero img{width:96px;height:150px;align-self:flex-end}.comp-stats{grid-template-columns:repeat(2,1fr);gap:8px}.comp-lessons{grid-template-columns:1fr}.comp-emotions{grid-template-columns:repeat(2,1fr)}.comp-feedback{padding:18px}.comp-form-row,.comp-mapping .comp-form-row{grid-template-columns:1fr}.comp-bar{grid-template-columns:100px minmax(60px,1fr) 40px}.comp-class-list article{flex-wrap:wrap}.comp-stat strong{font-size:25px}}@media(prefers-reduced-motion:reduce){.comp-emotions input:checked~.comp-emoji{animation:none}}
