:root{font-family:Inter,Arial,sans-serif;color:#11283a;background:#f3f5f8;--page-w:794px;--page-h:1123px}*{box-sizing:border-box}body{margin:0}.topbar{height:86px;background:#fff;border-bottom:1px solid #dce2e8;padding:15px 28px;display:flex;align-items:center;justify-content:space-between}.eyebrow{font-size:11px;letter-spacing:2px;color:#9b1118;font-weight:800}.topbar h1{margin:2px 0;font-size:26px}.connection{padding:9px 14px;border-radius:20px;background:#fff6d8;color:#775600;font-size:13px}.connection.ok{background:#dcfce7;color:#166534}main{padding:20px;max-width:1500px;margin:auto}.panel{background:#fff;border:1px solid #dfe4e9;border-radius:14px;box-shadow:0 5px 20px #1831490c}.controls{padding:14px;display:grid;grid-template-columns:1fr 1.1fr 1fr 90px 90px auto auto;gap:12px;align-items:end;margin-bottom:16px}label{font-size:12px;font-weight:700;color:#536371;display:flex;flex-direction:column;gap:6px}input,select{border:1px solid #ccd4dc;border-radius:8px;padding:10px;font:inherit;background:#fff}button{border:1px solid #ccd4dc;background:#fff;border-radius:9px;padding:10px 13px;font-weight:700;cursor:pointer}.primary{background:#9b1118;color:#fff;border-color:#9b1118}.secondary{color:#9b1118;border-color:#9b1118}.workspace{display:grid;grid-template-columns:330px 1fr;gap:16px}.sidebar{padding:16px;height:calc(100vh - 155px);position:sticky;top:10px;overflow:auto}.section-title{display:flex;justify-content:space-between;align-items:center}.section-title h2,.sidebar h2{font-size:16px;margin:0 0 10px}.students{display:flex;flex-direction:column;gap:6px}.student-row{display:grid;grid-template-columns:22px 32px 1fr;gap:7px;align-items:center;padding:8px;border-radius:8px;border:1px solid transparent;cursor:pointer}.student-row.active{background:#fff1f1;border-color:#e5a7aa}.student-row:hover{background:#f5f7f9}.student-row small{display:block;color:#768491}.pagination{display:flex;justify-content:center;align-items:center;gap:10px;padding:12px}.pagination button{padding:5px 10px}.template-actions{display:flex;gap:8px;margin:10px 0}.hint{font-size:12px;color:#758392;line-height:1.5}.preview-column{min-width:0}.preview-toolbar{display:flex;justify-content:space-between;padding:10px 4px;color:#536371;max-width:var(--page-w);margin:0 auto}.report{width:var(--page-w);height:var(--page-h);position:relative;overflow:hidden;background:white;margin:0 auto;transform-origin:top center;box-shadow:0 12px 45px #23374a24;color:#111}.custom-background{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:.2;display:none}.ornament{position:absolute;width:260px;height:160px;background:linear-gradient(135deg,#830005,#d9160d 55%,#efb429);transform:skew(-25deg);z-index:0}.top-left{left:-110px;top:-100px}.bottom-right{right:-140px;bottom:-100px}.draggable{position:absolute;z-index:1}.editing .draggable{outline:2px dashed #1185db;cursor:move}.report-header{left:34px;top:25px;width:732px;height:135px;display:grid;grid-template-columns:145px 1fr 125px;align-items:center}.brand-mark{width:105px;height:105px;border:7px double #08778b;border-radius:50%;display:grid;place-items:center;color:#08778b;font-weight:900;font-size:37px;background:#fff}.brand{text-align:center;font-weight:900;font-size:25px;line-height:1.25}.brand strong{display:block;color:#a30000;font-size:33px;border-bottom:2px solid #a30000;padding-bottom:4px}.brand span{display:block;font-size:19px;margin-top:7px}.month-badge{height:135px;background:#9c0000;color:#fff;text-align:center;padding:12px 6px;clip-path:polygon(0 0,100% 0,100% 80%,50% 100%,0 80%);font-size:20px;font-weight:900}.month-badge strong{font-size:48px;display:block;line-height:1}.month-badge small{color:#ffd325}.student-card{left:30px;top:180px;width:740px;height:190px;border:3px solid #c49a33;border-radius:30px;padding:14px 22px;display:grid;grid-template-columns:160px 1fr 205px;gap:16px;align-items:center}.avatar{width:145px;height:145px;border-radius:50%;object-fit:cover;border:4px solid #c49a33;background:#e8edf1}.student-card p{margin:13px 0}.student-card b{display:block;color:#a30000;font-size:18px}.student-card strong{display:block;color:#071474;font-size:19px}.attendance{left:42px;top:410px;width:716px;height:220px;border:2px solid #0bae6e;border-radius:28px;padding:18px 18px 10px}.section-pill{position:absolute;left:50%;top:-17px;transform:translateX(-50%);white-space:nowrap;background:#fff;border:2px solid #8bd87a;color:#075a9d;border-radius:20px;padding:4px 28px;font-weight:900;font-size:17px}.attendance-columns{display:grid;grid-template-columns:1fr 1fr;gap:30px;height:160px}.attendance-columns>div+div{border-left:2px solid #222;padding-left:25px}.attendance h3{text-align:center;color:#9f0808;margin:2px 0 8px}.chips{display:grid;grid-template-columns:repeat(4,1fr);gap:9px}.chip,.legend span{border-radius:20px;padding:7px 5px;text-align:center;color:#fff;font-weight:800;font-size:13px;background:#00a340}.chip.leave,.legend .leave{background:#089ddd}.chip.absent,.legend .absent{background:#b64000}.chip.empty{background:#dce2e7;color:#87929b}.legend{display:flex;gap:9px;align-items:center;font-size:13px}.legend span{min-width:95px;padding:6px}.comments{left:48px;top:665px;width:704px;height:350px;display:grid;grid-template-columns:1fr 1fr;gap:28px}.comments article{position:relative;border:2px solid #11ad72;border-radius:25px;padding:26px 17px 14px;overflow:hidden}.comments article:first-child{border-left-color:#8151ff}.comment-text{font-size:15px;line-height:1.42}.comment-text h3{font-size:18px;margin:4px 0}.comment-text p{margin:4px 0 12px;white-space:pre-wrap}.report-footer{left:0;bottom:0;width:100%;height:78px;display:grid;grid-template-columns:1fr 1fr 1fr;gap:8px;padding:12px;background:linear-gradient(90deg,#0e77c8,#0ead65,#f4ad12);color:white;font-weight:900;font-size:18px;text-align:center;align-items:center}.report-footer div{background:#ffffff2b;border-radius:13px;padding:15px 5px}.progress{max-width:var(--page-w);margin:14px auto;font-size:13px;line-height:1.5}.progress .ok{color:#15803d}.progress .error{color:#b91c1c}@media(max-width:1150px){.controls{grid-template-columns:1fr 1fr 90px 90px}.workspace{grid-template-columns:280px 1fr}.report{transform:scale(.8);margin-bottom:-225px}}@media(max-width:850px){.workspace{display:block}.sidebar{position:static;height:auto;margin-bottom:15px}.controls{grid-template-columns:1fr 1fr}.report{transform:scale(.65);margin-left:calc((100% - 794px*.65)/2);margin-bottom:-393px}}