:root{font-family:Segoe UI,Tahoma,Arial,sans-serif;color:#17352f;background:#eef5f2;font-synthesis:none}*{box-sizing:border-box}body{margin:0;min-width:320px;min-height:100vh;background:linear-gradient(155deg,#eef5f2,#f8f5ec)}button,input,select,textarea{font:inherit}button{cursor:pointer}button:disabled{cursor:not-allowed;opacity:.55}.mobile-shell{min-height:100vh;padding-bottom:130px}.mobile-header{position:sticky;top:0;z-index:10;display:flex;align-items:center;justify-content:space-between;gap:16px;padding:max(16px,env(safe-area-inset-top)) 18px 14px;color:#fff;background:#126b5a;box-shadow:0 8px 24px #17352f28}.mobile-header small{opacity:.8}.mobile-header h1{margin:2px 0 0;font-size:1.25rem}.connection{padding:7px 10px;border-radius:999px;font-size:.8rem;font-weight:700;white-space:nowrap}.connection.online{background:#d8f3e6;color:#0d5949}.connection.offline{background:#fff0c9;color:#7d5411}.notice{margin:14px 16px 0;padding:11px 14px;border:1px solid #b9d7cd;border-radius:12px;background:#f5fffb;color:#165c4e;font-size:.9rem}.channel-main{max-width:680px;margin:0 auto;padding:16px}.class-picker{display:flex;align-items:end;gap:10px;padding:14px;border:1px solid #d2e2dc;border-radius:17px;background:#fff;box-shadow:0 8px 22px #183d3310}.class-picker label{flex:1}label{display:grid;gap:7px;color:#426059;font-size:.86rem;font-weight:650}input,select,textarea{width:100%;border:1px solid #bdd1ca;border-radius:11px;padding:11px 12px;color:#17352f;background:#fff;outline:none}input:focus,select:focus,textarea:focus{border-color:#17816d;box-shadow:0 0 0 3px #17816d1e}textarea{min-height:105px;resize:vertical}button{border:0;border-radius:12px;padding:11px 15px;background:#126b5a;color:#fff;font-weight:750}button.ghost,button.back,.select-all{background:#e6f1ed;color:#126b5a}.section-title{margin:22px 2px 12px;font-size:1.05rem}.tool-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:11px}.tool-grid button{min-height:92px;display:grid;align-content:center;gap:7px;text-align:right;color:#17352f;background:#fff;border:1px solid #d2e2dc;box-shadow:0 7px 20px #17352f0c}.tool-grid button:hover{border-color:#58a593;transform:translateY(-1px)}.tool-grid span{font-size:.98rem}.tool-grid small{color:#6b837d;font-weight:500}.tool-form{display:grid;gap:14px;margin-top:16px;padding:16px;border:1px solid #d2e2dc;border-radius:18px;background:#fff}.tool-title{display:flex;align-items:center;gap:12px}.tool-title h2{margin:0;font-size:1.15rem}.hint{margin:0;padding:11px;border-radius:10px;background:#fff7df;color:#76551c}.student-selector,.grade-list{max-height:430px;overflow:auto;display:grid;gap:7px;padding:3px}.student-selector label,.grade-list label{display:flex;align-items:center;gap:10px;min-height:50px;padding:9px 11px;border:1px solid #deebe6;border-radius:12px;color:#24463f;background:#fafdfc}.student-selector label.chosen{border-color:#49a18c;background:#eaf8f3}.student-selector input{width:20px;height:20px;accent-color:#126b5a}.select-all{justify-self:start;margin-bottom:3px}.grade-list label span{flex:1;min-width:0;overflow-wrap:anywhere}.grade-list input{width:85px;text-align:center;font-size:1.05rem}.follow-check{display:flex;align-items:center;grid-template-columns:auto 1fr}.follow-check input{width:20px;height:20px;accent-color:#126b5a}.sticky-save{position:sticky;bottom:112px;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:12px;border-radius:14px;background:#17352f;color:#fff;box-shadow:0 8px 25px #17352f38}.queue-panel{position:fixed;right:12px;bottom:max(12px,env(safe-area-inset-bottom));left:12px;z-index:12;max-width:656px;margin:auto;display:flex;align-items:center;gap:8px;overflow-x:auto;padding:12px 14px;border:1px solid #c5d7d0;border-radius:17px;background:#fff;box-shadow:0 12px 35px #17352f2c}.queue-panel>div{display:grid;gap:2px;min-width:145px}.queue-panel small{color:#667f78}.queue-state{padding:7px 9px;border-radius:999px;font-size:.75rem;white-space:nowrap}.queue-state.saved{background:#fff4cc}.queue-state.uploading{background:#e1efff}.queue-state.uploaded{background:#dcf4e8}.queue-state.failed{background:#ffe3df}.queue-panel button{margin-inline-start:auto;white-space:nowrap}.pairing-page,.center-card{min-height:100vh;display:grid;place-items:center;padding:22px}.pairing-card,.center-card{width:min(100%,440px);padding:26px;border:1px solid #d2e2dc;border-radius:24px;background:#fff;box-shadow:0 18px 55px #17352f1c;text-align:center}.pairing-card{display:grid;gap:16px}.pairing-card h1,.pairing-card p{margin:0}.pairing-card label{text-align:right}.brand-mark{width:58px;height:58px;display:grid;place-items:center;justify-self:center;border-radius:18px;color:#fff;background:#126b5a;font-size:1.7rem;font-weight:800}.verification-code{direction:ltr;padding:14px;border-radius:12px;letter-spacing:2px;color:#126b5a;background:#eaf6f2;font-size:1.25rem}.error-text{color:#9f3f36}.pairing-card.danger{border-color:#e5b6b0}.empty-mobile{padding:35px 18px;text-align:center}.empty-mobile h2{margin-bottom:7px}.empty-mobile p{color:#687f79}.loader{width:20px;height:20px;border:3px solid #cbdcd6;border-top-color:#126b5a;border-radius:50%;animation:spin .8s linear infinite}@keyframes spin{to{transform:rotate(360deg)}}@media(max-width:390px){.tool-grid{grid-template-columns:1fr}.class-picker{align-items:stretch;flex-direction:column}.queue-panel{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:6px 8px;overflow:hidden}.queue-panel>div{min-width:0}.queue-panel .queue-state{grid-column:1 / -1;justify-self:start}.queue-panel .queue-state:nth-of-type(n+2){display:none}.queue-panel button{grid-column:2;grid-row:1;margin-inline-start:0;padding-inline:10px}}