@font-face{font-display:block;font-family:KaTeX_AMS;font-style:normal;font-weight:400;src:url(/assets/KaTeX_AMS-Regular-5085d14c.woff2) format("woff2"),url(/assets/KaTeX_AMS-Regular-cc9bd60e.woff) format("woff"),url(/assets/KaTeX_AMS-Regular-d1820025.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Caligraphic;font-style:normal;font-weight:700;src:url(/assets/KaTeX_Caligraphic-Bold-eafc847d.woff2) format("woff2"),url(/assets/KaTeX_Caligraphic-Bold-4489718b.woff) format("woff"),url(/assets/KaTeX_Caligraphic-Bold-04d7c5db.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Caligraphic;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Caligraphic-Regular-e2ea347e.woff2) format("woff2"),url(/assets/KaTeX_Caligraphic-Regular-93440fab.woff) format("woff"),url(/assets/KaTeX_Caligraphic-Regular-305fded4.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Fraktur;font-style:normal;font-weight:700;src:url(/assets/KaTeX_Fraktur-Bold-8bea0fdb.woff2) format("woff2"),url(/assets/KaTeX_Fraktur-Bold-6c0cfe75.woff) format("woff"),url(/assets/KaTeX_Fraktur-Bold-5d9c444d.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Fraktur;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Fraktur-Regular-9362217a.woff2) format("woff2"),url(/assets/KaTeX_Fraktur-Regular-f175ce1c.woff) format("woff"),url(/assets/KaTeX_Fraktur-Regular-81ff0bab.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:normal;font-weight:700;src:url(/assets/KaTeX_Main-Bold-b1f7ce88.woff2) format("woff2"),url(/assets/KaTeX_Main-Bold-99b7008c.woff) format("woff"),url(/assets/KaTeX_Main-Bold-306a8395.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:italic;font-weight:700;src:url(/assets/KaTeX_Main-BoldItalic-f10c9dc0.woff2) format("woff2"),url(/assets/KaTeX_Main-BoldItalic-12a522d1.woff) format("woff"),url(/assets/KaTeX_Main-BoldItalic-f3c4f326.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:italic;font-weight:400;src:url(/assets/KaTeX_Main-Italic-d580edee.woff2) format("woff2"),url(/assets/KaTeX_Main-Italic-4c2ce066.woff) format("woff"),url(/assets/KaTeX_Main-Italic-3759e9c6.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Main;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Main-Regular-76d8dbe2.woff2) format("woff2"),url(/assets/KaTeX_Main-Regular-ebf7825a.woff) format("woff"),url(/assets/KaTeX_Main-Regular-32a59bcd.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Math;font-style:italic;font-weight:700;src:url(/assets/KaTeX_Math-BoldItalic-999ef36c.woff2) format("woff2"),url(/assets/KaTeX_Math-BoldItalic-2263edb0.woff) format("woff"),url(/assets/KaTeX_Math-BoldItalic-775d28df.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Math;font-style:italic;font-weight:400;src:url(/assets/KaTeX_Math-Italic-2de77004.woff2) format("woff2"),url(/assets/KaTeX_Math-Italic-c0d3ffcf.woff) format("woff"),url(/assets/KaTeX_Math-Italic-1f94eaff.ttf) format("truetype")}@font-face{font-display:block;font-family:"KaTeX_SansSerif";font-style:normal;font-weight:700;src:url(/assets/KaTeX_SansSerif-Bold-f5b144b4.woff2) format("woff2"),url(/assets/KaTeX_SansSerif-Bold-db22128e.woff) format("woff"),url(/assets/KaTeX_SansSerif-Bold-8531ea67.ttf) format("truetype")}@font-face{font-display:block;font-family:"KaTeX_SansSerif";font-style:italic;font-weight:400;src:url(/assets/KaTeX_SansSerif-Italic-b71f456a.woff2) format("woff2"),url(/assets/KaTeX_SansSerif-Italic-33768fb7.woff) format("woff"),url(/assets/KaTeX_SansSerif-Italic-18623275.ttf) format("truetype")}@font-face{font-display:block;font-family:"KaTeX_SansSerif";font-style:normal;font-weight:400;src:url(/assets/KaTeX_SansSerif-Regular-c30429e5.woff2) format("woff2"),url(/assets/KaTeX_SansSerif-Regular-92e9fa94.woff) format("woff"),url(/assets/KaTeX_SansSerif-Regular-4da3b851.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Script;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Script-Regular-f7c0859f.woff2) format("woff2"),url(/assets/KaTeX_Script-Regular-f9c90562.woff) format("woff"),url(/assets/KaTeX_Script-Regular-b9264196.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size1;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Size1-Regular-26083f26.woff2) format("woff2"),url(/assets/KaTeX_Size1-Regular-b5f79b67.woff) format("woff"),url(/assets/KaTeX_Size1-Regular-dbb27b9e.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size2;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Size2-Regular-f2e1dc7d.woff2) format("woff2"),url(/assets/KaTeX_Size2-Regular-280f5b5c.woff) format("woff"),url(/assets/KaTeX_Size2-Regular-7b80a516.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size3;font-style:normal;font-weight:400;src:url(data:font/woff2;base64,d09GMgABAAAAAA4oAA4AAAAAHbQAAA3TAAEAAAAAAAAAAAAAAAAAAAAAAAAAAAAABmAAgRQIDgmcDBEICo1oijYBNgIkA14LMgAEIAWJAAeBHAyBHBvbGiMRdnO0IkRRkiYDgr9KsJ1NUAf2kILNxgUmgqIgq1P89vcbIcmsQbRps3vCcXdYOKSWEPEKgZgQkprQQsxIXUgq0DqpGKmIvrgkeVGtEQD9DzAO29fM9jYhxZEsL2FeURH2JN4MIcTdO049NCVdxQ/w9NrSYFEBKTDKpLKfNkCGDc1RwjZLQcm3vqJ2UW9Xfa3tgAHz6ivp6vgC2yD4/6352ndnN0X0TL7seypkjZlMsjmZnf0Mm5Q+JykRWQBKCVCVPbARPXWyQtb5VgLB6Biq7/Uixcj2WGqdI8tGSgkuRG+t910GKP2D7AQH0DB9FMDW/obJZ8giFI3Wg8Cvevz0M+5m0rTh7XDBlvo9Y4vm13EXmfttwI4mBo1EG15fxJhUiCLbiiyCf/ZA6MFAhg3pGIZGdGIVjtPn6UcMk9A/UUr9PhoNsCENw1APAq0gpH73e+M+0ueyHbabc3vkbcdtzcf/fiy+NxQEjf9ud/ELBHAXJ0nk4z+MXH2Ev/kWyV4k7SkvpPc9Qr38F6RPWnM9cN6DJ0AdD1BhtgABtmoRoFCvPsBAumNm6soZG2Gk5GyVTo2sJncSyp0jQTYoR6WDvTwaaEcHsxHfvuWhHA3a6bN7twRKtcGok6NsCi7jYRrM2jExsUFMxMQYuJbMhuWNOumEJy9hi29Dmg5zMp/A5+hhPG19j1vBrq8JTLr8ki5VLPmG/PynJHVul440bxg5xuymHUFPBshC+nA9I1FmwbRBTNHAcik3Oae0cxKoI3MOriM42UrPe51nsaGxJ+WfXubAsP84aabUlQSJ1IiE0iPETLUU4CATgfXSCSpuRFRmCGbO+wSpAnzaeaCYW1VNEysRtuXCEL1kUFUbbtMv3Tilt/1c11jt3Q5bbMa84cpWipp8Elw3MZhOHsOlwwVUQM3lAR35JiFQbaYCRnMF2lxAWoOg2gyoIV4PouX8HytNIfLhqpJtXB4vjiViUI8IJ7bkC4ikkQvKksnOTKICwnqWSZ9YS5f0WCxmpgjbIq7EJcM4aI2nmhLNY2JIUgOjXZFWBHb+x5oh6cwb0Tv1ackHdKi0I9OO2wE9aogIOn540CCCziyhN+IaejtgAONKznHlHyutPrHGwCx9S6B8kfS4Mfi4Eyv7OU730bT1SCBjt834cXsf43zVjPUqqJjgrjeGnBxSG4aYAKFuVbeCfkDIjAqMb6yLNIbCuvXhMH2/+k2vkNpkORhR59N1CkzoOENvneIosjYmuTxlhUzaGEJQ/iWqx4dmwpmKjrwTiTGTCVozNAYqk/zXOndWxuWSmJkQpJw3pK5KX6QrLt5LATMqpmPAQhkhK6PUjzHUn7E0gHE0kPE0iKkolgkUx9SZmVAdDgpffdyJKg3k7VmzYGCwVXGz/tXmkOIp+vcWs+EMuhhvN0h9uhfzWJziBQmCREGSIFmQIkgVpAnSBRmC//6hkLZwaVhwxlrJSOdqlFtOYxlau9F2QN5Y98xmIAsiM1HVp2VFX+DHHGg6Ecjh3vmqtidX3qHI2qycTk/iwxSt5UzTmEP92ZBnEWTk4Mx8Mpl78ZDokxg/KWb+Q0QkvdKVmq3TMW+RXEgrsziSAfNXFMhDc60N5N9jQzjfO0kBKpUZl0ZmwJ41j/B9Hz6wmRaJB84niNmQrzp9eSlQCDDzazGDdVi3P36VZQ+Jy4f9UBNp+3zTjqI4abaFAm+GShVaXlsGdF3FYzZcDI6cori4kMxUECl9IjJZpzkvitAoxKue+90pDMvcKRxLl53TmOKCmV/xRolNKSqqUxc6LStOETmFOiLZZptlZepcKiAzteG8PEdpnQpbOMNcMsR4RR2Bs0cKFEvSmIjAFcnarqwUL4lDhHmnVkwu1IwshbiCcgvOheZuYyOteufZZwlcTlLgnZ3o/WcYdzZHW/WGaqaVfmTZ1aWCceJjkbZqsfbkOtcFlUZM/jy+hXHDbaUobWqqXaeWobbLO99yG5N3U4wxco0rQGGcOLASFMXeJoham8M+/x6O2WywK2l4HGbq1CoUyC/IZikQhdq3SiuNrvAEj0AVu9x2x3lp/xWzahaxidezFVtdcb5uEnzyl0ZmYiuKI0exvCd4Xc9CV1KB0db00z92wDPde0kukbvZIWN6jUWFTmPIC/Y4UPCm8UfDTFZpZNon1qLFTkBhxzB+FjQRA2Q/YRJT8pQigslMaUpFyAG8TMlXigiqmAZX4xgijKjRlGpLE0GdplRfCaJo0JQaSxNBk6ZmMzcya0FmrcisDdn0Q3HI2sWSppYigmlM1XT/kLQZSNpMJG0WkjYbSZuDpM1F0uYhFc1HxU4m1QJjDK6iL0S5uSj5rgXc3RejEigtcRBtqYPQsiTskmO5vosV+q4VGIKbOkDg0jtRrq+Em1YloaTFar3EGr1EUC8R0kus1Uus00usL97ABr2BjXoDm/QGNhuWtMVBKOwg/i78lT7hBsAvDmwHc/ao3vmUbBmhjeYySZNWvGkfZAgISDSaDo1SVpzGDsAEkF8B+gEapViUoZgUWXcRIGFZNm6gWbAKk0bp0k1MHG9fLYtV4iS2SmLEQFARzRcnf9PUS0LVn05/J9MiRRBU3v2IrvW974v4N00L7ZMk0wXP1409CHo/an8zTRHD3eSJ6m8D4YMkZNl3M79sqeuAsr/m3f+8/yl7A50aiAEJgeBeMWzu7ui9UfUBCe2TIqZIoOd/3/udRBOQidQZUERzb2/VwZN1H/Sju82ew2H2Wfr6qvfVf3hqwDvAIpkQVFy4B9Pe9e4/XvPeceu7h3dvO56iJPf0+A6cqA2ip18ER+iFgggiuOkvj24bby0N9j2UHIkgqIt+sVgfodC4YghLSMjSZbH0VR/6dMDrYJeKHilKTemt6v6kvzvn3/RrdWtr0GoN/xL+Sex/cPYLUpepx9cz/D46UPU5KXgAQa+NDps1v6J3xP1i2HtaDB0M9aX2deA7SYff//+gUCovMmIK/qfsFcOk+4Y5ZN97XlG6zebqtMbKgeRFi51vnxTQYBUik2rS/Cn6PC8ADR8FGxsRPB82dzfND90gIcshOcYUkfjherBz53odpm6TP8txlwOZ71xmfHHOvq053qFF/MRlS3jP0ELudrf2OeN8DHvp6ZceLe8qKYvWz/7yp0u4dKPfli3CYq0O13Ih71mylJ80tOi10On8wi+F4+LWgDPeJ30msSQt9/vkmHq9/Lvo2b461mP801v3W4xTcs6CbvF9UDdrSt+A8OUbpSh55qAUFXWznBBfdeJ8a4d7ugT5tvxUza3h9m4H7ptTqiG4z0g5dc0X29OcGlhpGFMpQo9ytTS+NViZpNdvU4kWx+LKxNY10kQ1yqGXrhe4/1nvP7E+nd5A92TtaRplbHSqoIdOqtRWti+fkB5/n1+/VvCmz12pG1kpQWsfi1ftlBobm0bpngs16CHkbIwdLnParxtTV3QYRlfJ0KFskH7pdN/YDn+yRuSd7sNH3aO0DYPggk6uWuXrfOc+fa3VTxFVvKaNxHsiHmsXyCLIE5yuOeN3/Jdf8HBL/5M6shjyhxHx9BjB1O0+4NLOnjLLSxwO7ukN4jMbOIcD879KLSi6Pk61Oqm2377n8079PXEEQ7cy7OKEC9nbpet118fxweTafpt69x/Bt8UqGzNQt7aelpc44dn5cqhwf71+qKp/Zf/+a0zcizOUWpl/iBcSXip0pplkatCchoH5c5aUM8I7/dWxAej8WicPL1URFZ9BDJelUwEwTkGqUhgSlydVes95YdXvhh9Gfz/aeFWvgVb4tuLbcv4+wLdutVZv/cUonwBD/6eDlE0aSiKK/uoH3+J1wDE/jMVqY2ysGufN84oIXB0sPzy8ollX/LegY74DgJXJR57sn+VGza0x3DnuIgABFM15LmajjjsNlYj+JEZGbuRYcAMOWxFkPN2w6Wd46xo4gVWQR/X4lyI/R6K/YK0110GzudPRW7Y+UOBGTfNNzHeYT0fiH0taunBpq9HEW8OKSaBGj21L0MqenEmNRWBAWDWAk4CpNoEZJ2tTaPFgbQYj8HxtFilErs3BTRwT8uO1NXQaWfIotchmPkAF5mMBAliEmZiOGVgCG9LgRzpscMAOOwowlT3JhusdazXGSC/hxR3UlmWVwWHpOIKheqONvjyhSiTHIkVUco5bnji8m//zL7PKaT1Vl5I6UE609f+gkr6MZKVyKc7zJRmCahLsdlyA5fdQkRSan9LgnnLEyGSkaKJCJog0wAgvepWBt80+1yKln1bMVtCljfNWDueKLsWwaEbBSfSPTEmVRsUcYYMnEjcjeyCZzBXK9E9BYBXLKjOSpUDR+nEV3TFSUdQaz+ot98QxgXwx0GQ+EEUAKB2qZPkQQ0GqFD8UPFMqyaCHM24BZmSGic9EYMagKizOw9Hz50DMrDLrqqLkTAhplMictiCAx5S3BIUQdeJeLnBy2CNtMfz6cV4u8XKoFZQesbf9YZiIERiHjaNodDW6LgcirX/mPnJIkBGDUpTBhSa0EIr38D5hCIszhCM8URGBqImoWjpvpt1ebu/v3Gl3qJfMnNM+9V+kiRFyROTPHQWOcs1dNW94/ukKMPZBvDi55i5CttdeJz84DLngLqjcdwEZ87bFFR8CIG35OAkDVN6VRDZ7aq67NteYqZ2lpT8oYB2CytoBd6VuAx4WgiAsnuj3WohG+LugzXiQRDeM3XYXlULv4dp5VFYC) format("woff2"),url(/assets/KaTeX_Size3-Regular-93ab932a.woff) format("woff"),url(/assets/KaTeX_Size3-Regular-e0a57b34.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Size4;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Size4-Regular-e5e65c59.woff2) format("woff2"),url(/assets/KaTeX_Size4-Regular-45fb8824.woff) format("woff"),url(/assets/KaTeX_Size4-Regular-d6141bf4.ttf) format("truetype")}@font-face{font-display:block;font-family:KaTeX_Typewriter;font-style:normal;font-weight:400;src:url(/assets/KaTeX_Typewriter-Regular-8eeabe21.woff2) format("woff2"),url(/assets/KaTeX_Typewriter-Regular-b4c52f66.woff) format("woff"),url(/assets/KaTeX_Typewriter-Regular-f721beff.ttf) format("truetype")}.katex{font:normal 1.21em KaTeX_Main,Times New Roman,serif;line-height:1.2;text-indent:0;text-rendering:auto}.katex *{-ms-high-contrast-adjust:none!important;border-color:currentColor}.katex .katex-version:after{content:"0.16.25"}.katex .katex-mathml{clip:rect(1px,1px,1px,1px);border:0;height:1px;overflow:hidden;padding:0;position:absolute;width:1px}.katex .katex-html>.newline{display:block}.katex .base{position:relative;white-space:nowrap;width:-webkit-min-content;width:-moz-min-content;width:min-content}.katex .base,.katex .strut{display:inline-block}.katex .textbf{font-weight:700}.katex .textit{font-style:italic}.katex .textrm{font-family:KaTeX_Main}.katex .textsf{font-family:KaTeX_SansSerif}.katex .texttt{font-family:KaTeX_Typewriter}.katex .mathnormal{font-family:KaTeX_Math;font-style:italic}.katex .mathit{font-family:KaTeX_Main;font-style:italic}.katex .mathrm{font-style:normal}.katex .mathbf{font-family:KaTeX_Main;font-weight:700}.katex .boldsymbol{font-family:KaTeX_Math;font-style:italic;font-weight:700}.katex .amsrm,.katex .mathbb,.katex .textbb{font-family:KaTeX_AMS}.katex .mathcal{font-family:KaTeX_Caligraphic}.katex .mathfrak,.katex .textfrak{font-family:KaTeX_Fraktur}.katex .mathboldfrak,.katex .textboldfrak{font-family:KaTeX_Fraktur;font-weight:700}.katex .mathtt{font-family:KaTeX_Typewriter}.katex .mathscr,.katex .textscr{font-family:KaTeX_Script}.katex .mathsf,.katex .textsf{font-family:KaTeX_SansSerif}.katex .mathboldsf,.katex .textboldsf{font-family:KaTeX_SansSerif;font-weight:700}.katex .mathitsf,.katex .mathsfit,.katex .textitsf{font-family:KaTeX_SansSerif;font-style:italic}.katex .mainrm{font-family:KaTeX_Main;font-style:normal}.katex .vlist-t{border-collapse:collapse;display:inline-table;table-layout:fixed}.katex .vlist-r{display:table-row}.katex .vlist{display:table-cell;position:relative;vertical-align:bottom}.katex .vlist>span{display:block;height:0;position:relative}.katex .vlist>span>span{display:inline-block}.katex .vlist>span>.pstrut{overflow:hidden;width:0}.katex .vlist-t2{margin-right:-2px}.katex .vlist-s{display:table-cell;font-size:1px;min-width:2px;vertical-align:bottom;width:2px}.katex .vbox{align-items:baseline;display:inline-flex;flex-direction:column}.katex .hbox{width:100%}.katex .hbox,.katex .thinbox{display:inline-flex;flex-direction:row}.katex .thinbox{max-width:0;width:0}.katex .msupsub{text-align:left}.katex .mfrac>span>span{text-align:center}.katex .mfrac .frac-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline,.katex .hline,.katex .mfrac .frac-line,.katex .overline .overline-line,.katex .rule,.katex .underline .underline-line{min-height:1px}.katex .mspace{display:inline-block}.katex .clap,.katex .llap,.katex .rlap{position:relative;width:0}.katex .clap>.inner,.katex .llap>.inner,.katex .rlap>.inner{position:absolute}.katex .clap>.fix,.katex .llap>.fix,.katex .rlap>.fix{display:inline-block}.katex .llap>.inner{right:0}.katex .clap>.inner,.katex .rlap>.inner{left:0}.katex .clap>.inner>span{margin-left:-50%;margin-right:50%}.katex .rule{border:0 solid;display:inline-block;position:relative}.katex .hline,.katex .overline .overline-line,.katex .underline .underline-line{border-bottom-style:solid;display:inline-block;width:100%}.katex .hdashline{border-bottom-style:dashed;display:inline-block;width:100%}.katex .sqrt>.root{margin-left:.2777777778em;margin-right:-.5555555556em}.katex .fontsize-ensurer.reset-size1.size1,.katex .sizing.reset-size1.size1{font-size:1em}.katex .fontsize-ensurer.reset-size1.size2,.katex .sizing.reset-size1.size2{font-size:1.2em}.katex .fontsize-ensurer.reset-size1.size3,.katex .sizing.reset-size1.size3{font-size:1.4em}.katex .fontsize-ensurer.reset-size1.size4,.katex .sizing.reset-size1.size4{font-size:1.6em}.katex .fontsize-ensurer.reset-size1.size5,.katex .sizing.reset-size1.size5{font-size:1.8em}.katex .fontsize-ensurer.reset-size1.size6,.katex .sizing.reset-size1.size6{font-size:2em}.katex .fontsize-ensurer.reset-size1.size7,.katex .sizing.reset-size1.size7{font-size:2.4em}.katex .fontsize-ensurer.reset-size1.size8,.katex .sizing.reset-size1.size8{font-size:2.88em}.katex .fontsize-ensurer.reset-size1.size9,.katex .sizing.reset-size1.size9{font-size:3.456em}.katex .fontsize-ensurer.reset-size1.size10,.katex .sizing.reset-size1.size10{font-size:4.148em}.katex .fontsize-ensurer.reset-size1.size11,.katex .sizing.reset-size1.size11{font-size:4.976em}.katex .fontsize-ensurer.reset-size2.size1,.katex .sizing.reset-size2.size1{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size2.size2,.katex .sizing.reset-size2.size2{font-size:1em}.katex .fontsize-ensurer.reset-size2.size3,.katex .sizing.reset-size2.size3{font-size:1.1666666667em}.katex .fontsize-ensurer.reset-size2.size4,.katex .sizing.reset-size2.size4{font-size:1.3333333333em}.katex .fontsize-ensurer.reset-size2.size5,.katex .sizing.reset-size2.size5{font-size:1.5em}.katex .fontsize-ensurer.reset-size2.size6,.katex .sizing.reset-size2.size6{font-size:1.6666666667em}.katex .fontsize-ensurer.reset-size2.size7,.katex .sizing.reset-size2.size7{font-size:2em}.katex .fontsize-ensurer.reset-size2.size8,.katex .sizing.reset-size2.size8{font-size:2.4em}.katex .fontsize-ensurer.reset-size2.size9,.katex .sizing.reset-size2.size9{font-size:2.88em}.katex .fontsize-ensurer.reset-size2.size10,.katex .sizing.reset-size2.size10{font-size:3.4566666667em}.katex .fontsize-ensurer.reset-size2.size11,.katex .sizing.reset-size2.size11{font-size:4.1466666667em}.katex .fontsize-ensurer.reset-size3.size1,.katex .sizing.reset-size3.size1{font-size:.7142857143em}.katex .fontsize-ensurer.reset-size3.size2,.katex .sizing.reset-size3.size2{font-size:.8571428571em}.katex .fontsize-ensurer.reset-size3.size3,.katex .sizing.reset-size3.size3{font-size:1em}.katex .fontsize-ensurer.reset-size3.size4,.katex .sizing.reset-size3.size4{font-size:1.1428571429em}.katex .fontsize-ensurer.reset-size3.size5,.katex .sizing.reset-size3.size5{font-size:1.2857142857em}.katex .fontsize-ensurer.reset-size3.size6,.katex .sizing.reset-size3.size6{font-size:1.4285714286em}.katex .fontsize-ensurer.reset-size3.size7,.katex .sizing.reset-size3.size7{font-size:1.7142857143em}.katex .fontsize-ensurer.reset-size3.size8,.katex .sizing.reset-size3.size8{font-size:2.0571428571em}.katex .fontsize-ensurer.reset-size3.size9,.katex .sizing.reset-size3.size9{font-size:2.4685714286em}.katex .fontsize-ensurer.reset-size3.size10,.katex .sizing.reset-size3.size10{font-size:2.9628571429em}.katex .fontsize-ensurer.reset-size3.size11,.katex .sizing.reset-size3.size11{font-size:3.5542857143em}.katex .fontsize-ensurer.reset-size4.size1,.katex .sizing.reset-size4.size1{font-size:.625em}.katex .fontsize-ensurer.reset-size4.size2,.katex .sizing.reset-size4.size2{font-size:.75em}.katex .fontsize-ensurer.reset-size4.size3,.katex .sizing.reset-size4.size3{font-size:.875em}.katex .fontsize-ensurer.reset-size4.size4,.katex .sizing.reset-size4.size4{font-size:1em}.katex .fontsize-ensurer.reset-size4.size5,.katex .sizing.reset-size4.size5{font-size:1.125em}.katex .fontsize-ensurer.reset-size4.size6,.katex .sizing.reset-size4.size6{font-size:1.25em}.katex .fontsize-ensurer.reset-size4.size7,.katex .sizing.reset-size4.size7{font-size:1.5em}.katex .fontsize-ensurer.reset-size4.size8,.katex .sizing.reset-size4.size8{font-size:1.8em}.katex .fontsize-ensurer.reset-size4.size9,.katex .sizing.reset-size4.size9{font-size:2.16em}.katex .fontsize-ensurer.reset-size4.size10,.katex .sizing.reset-size4.size10{font-size:2.5925em}.katex .fontsize-ensurer.reset-size4.size11,.katex .sizing.reset-size4.size11{font-size:3.11em}.katex .fontsize-ensurer.reset-size5.size1,.katex .sizing.reset-size5.size1{font-size:.5555555556em}.katex .fontsize-ensurer.reset-size5.size2,.katex .sizing.reset-size5.size2{font-size:.6666666667em}.katex .fontsize-ensurer.reset-size5.size3,.katex .sizing.reset-size5.size3{font-size:.7777777778em}.katex .fontsize-ensurer.reset-size5.size4,.katex .sizing.reset-size5.size4{font-size:.8888888889em}.katex .fontsize-ensurer.reset-size5.size5,.katex .sizing.reset-size5.size5{font-size:1em}.katex .fontsize-ensurer.reset-size5.size6,.katex .sizing.reset-size5.size6{font-size:1.1111111111em}.katex .fontsize-ensurer.reset-size5.size7,.katex .sizing.reset-size5.size7{font-size:1.3333333333em}.katex .fontsize-ensurer.reset-size5.size8,.katex .sizing.reset-size5.size8{font-size:1.6em}.katex .fontsize-ensurer.reset-size5.size9,.katex .sizing.reset-size5.size9{font-size:1.92em}.katex .fontsize-ensurer.reset-size5.size10,.katex .sizing.reset-size5.size10{font-size:2.3044444444em}.katex .fontsize-ensurer.reset-size5.size11,.katex .sizing.reset-size5.size11{font-size:2.7644444444em}.katex .fontsize-ensurer.reset-size6.size1,.katex .sizing.reset-size6.size1{font-size:.5em}.katex .fontsize-ensurer.reset-size6.size2,.katex .sizing.reset-size6.size2{font-size:.6em}.katex .fontsize-ensurer.reset-size6.size3,.katex .sizing.reset-size6.size3{font-size:.7em}.katex .fontsize-ensurer.reset-size6.size4,.katex .sizing.reset-size6.size4{font-size:.8em}.katex .fontsize-ensurer.reset-size6.size5,.katex .sizing.reset-size6.size5{font-size:.9em}.katex .fontsize-ensurer.reset-size6.size6,.katex .sizing.reset-size6.size6{font-size:1em}.katex .fontsize-ensurer.reset-size6.size7,.katex .sizing.reset-size6.size7{font-size:1.2em}.katex .fontsize-ensurer.reset-size6.size8,.katex .sizing.reset-size6.size8{font-size:1.44em}.katex .fontsize-ensurer.reset-size6.size9,.katex .sizing.reset-size6.size9{font-size:1.728em}.katex .fontsize-ensurer.reset-size6.size10,.katex .sizing.reset-size6.size10{font-size:2.074em}.katex .fontsize-ensurer.reset-size6.size11,.katex .sizing.reset-size6.size11{font-size:2.488em}.katex .fontsize-ensurer.reset-size7.size1,.katex .sizing.reset-size7.size1{font-size:.4166666667em}.katex .fontsize-ensurer.reset-size7.size2,.katex .sizing.reset-size7.size2{font-size:.5em}.katex .fontsize-ensurer.reset-size7.size3,.katex .sizing.reset-size7.size3{font-size:.5833333333em}.katex .fontsize-ensurer.reset-size7.size4,.katex .sizing.reset-size7.size4{font-size:.6666666667em}.katex .fontsize-ensurer.reset-size7.size5,.katex .sizing.reset-size7.size5{font-size:.75em}.katex .fontsize-ensurer.reset-size7.size6,.katex .sizing.reset-size7.size6{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size7.size7,.katex .sizing.reset-size7.size7{font-size:1em}.katex .fontsize-ensurer.reset-size7.size8,.katex .sizing.reset-size7.size8{font-size:1.2em}.katex .fontsize-ensurer.reset-size7.size9,.katex .sizing.reset-size7.size9{font-size:1.44em}.katex .fontsize-ensurer.reset-size7.size10,.katex .sizing.reset-size7.size10{font-size:1.7283333333em}.katex .fontsize-ensurer.reset-size7.size11,.katex .sizing.reset-size7.size11{font-size:2.0733333333em}.katex .fontsize-ensurer.reset-size8.size1,.katex .sizing.reset-size8.size1{font-size:.3472222222em}.katex .fontsize-ensurer.reset-size8.size2,.katex .sizing.reset-size8.size2{font-size:.4166666667em}.katex .fontsize-ensurer.reset-size8.size3,.katex .sizing.reset-size8.size3{font-size:.4861111111em}.katex .fontsize-ensurer.reset-size8.size4,.katex .sizing.reset-size8.size4{font-size:.5555555556em}.katex .fontsize-ensurer.reset-size8.size5,.katex .sizing.reset-size8.size5{font-size:.625em}.katex .fontsize-ensurer.reset-size8.size6,.katex .sizing.reset-size8.size6{font-size:.6944444444em}.katex .fontsize-ensurer.reset-size8.size7,.katex .sizing.reset-size8.size7{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size8.size8,.katex .sizing.reset-size8.size8{font-size:1em}.katex .fontsize-ensurer.reset-size8.size9,.katex .sizing.reset-size8.size9{font-size:1.2em}.katex .fontsize-ensurer.reset-size8.size10,.katex .sizing.reset-size8.size10{font-size:1.4402777778em}.katex .fontsize-ensurer.reset-size8.size11,.katex .sizing.reset-size8.size11{font-size:1.7277777778em}.katex .fontsize-ensurer.reset-size9.size1,.katex .sizing.reset-size9.size1{font-size:.2893518519em}.katex .fontsize-ensurer.reset-size9.size2,.katex .sizing.reset-size9.size2{font-size:.3472222222em}.katex .fontsize-ensurer.reset-size9.size3,.katex .sizing.reset-size9.size3{font-size:.4050925926em}.katex .fontsize-ensurer.reset-size9.size4,.katex .sizing.reset-size9.size4{font-size:.462962963em}.katex .fontsize-ensurer.reset-size9.size5,.katex .sizing.reset-size9.size5{font-size:.5208333333em}.katex .fontsize-ensurer.reset-size9.size6,.katex .sizing.reset-size9.size6{font-size:.5787037037em}.katex .fontsize-ensurer.reset-size9.size7,.katex .sizing.reset-size9.size7{font-size:.6944444444em}.katex .fontsize-ensurer.reset-size9.size8,.katex .sizing.reset-size9.size8{font-size:.8333333333em}.katex .fontsize-ensurer.reset-size9.size9,.katex .sizing.reset-size9.size9{font-size:1em}.katex .fontsize-ensurer.reset-size9.size10,.katex .sizing.reset-size9.size10{font-size:1.2002314815em}.katex .fontsize-ensurer.reset-size9.size11,.katex .sizing.reset-size9.size11{font-size:1.4398148148em}.katex .fontsize-ensurer.reset-size10.size1,.katex .sizing.reset-size10.size1{font-size:.2410800386em}.katex .fontsize-ensurer.reset-size10.size2,.katex .sizing.reset-size10.size2{font-size:.2892960463em}.katex .fontsize-ensurer.reset-size10.size3,.katex .sizing.reset-size10.size3{font-size:.337512054em}.katex .fontsize-ensurer.reset-size10.size4,.katex .sizing.reset-size10.size4{font-size:.3857280617em}.katex .fontsize-ensurer.reset-size10.size5,.katex .sizing.reset-size10.size5{font-size:.4339440694em}.katex .fontsize-ensurer.reset-size10.size6,.katex .sizing.reset-size10.size6{font-size:.4821600771em}.katex .fontsize-ensurer.reset-size10.size7,.katex .sizing.reset-size10.size7{font-size:.5785920926em}.katex .fontsize-ensurer.reset-size10.size8,.katex .sizing.reset-size10.size8{font-size:.6943105111em}.katex .fontsize-ensurer.reset-size10.size9,.katex .sizing.reset-size10.size9{font-size:.8331726133em}.katex .fontsize-ensurer.reset-size10.size10,.katex .sizing.reset-size10.size10{font-size:1em}.katex .fontsize-ensurer.reset-size10.size11,.katex .sizing.reset-size10.size11{font-size:1.1996142719em}.katex .fontsize-ensurer.reset-size11.size1,.katex .sizing.reset-size11.size1{font-size:.2009646302em}.katex .fontsize-ensurer.reset-size11.size2,.katex .sizing.reset-size11.size2{font-size:.2411575563em}.katex .fontsize-ensurer.reset-size11.size3,.katex .sizing.reset-size11.size3{font-size:.2813504823em}.katex .fontsize-ensurer.reset-size11.size4,.katex .sizing.reset-size11.size4{font-size:.3215434084em}.katex .fontsize-ensurer.reset-size11.size5,.katex .sizing.reset-size11.size5{font-size:.3617363344em}.katex .fontsize-ensurer.reset-size11.size6,.katex .sizing.reset-size11.size6{font-size:.4019292605em}.katex .fontsize-ensurer.reset-size11.size7,.katex .sizing.reset-size11.size7{font-size:.4823151125em}.katex .fontsize-ensurer.reset-size11.size8,.katex .sizing.reset-size11.size8{font-size:.578778135em}.katex .fontsize-ensurer.reset-size11.size9,.katex .sizing.reset-size11.size9{font-size:.6945337621em}.katex .fontsize-ensurer.reset-size11.size10,.katex .sizing.reset-size11.size10{font-size:.8336012862em}.katex .fontsize-ensurer.reset-size11.size11,.katex .sizing.reset-size11.size11{font-size:1em}.katex .delimsizing.size1{font-family:KaTeX_Size1}.katex .delimsizing.size2{font-family:KaTeX_Size2}.katex .delimsizing.size3{font-family:KaTeX_Size3}.katex .delimsizing.size4{font-family:KaTeX_Size4}.katex .delimsizing.mult .delim-size1>span{font-family:KaTeX_Size1}.katex .delimsizing.mult .delim-size4>span{font-family:KaTeX_Size4}.katex .nulldelimiter{display:inline-block;width:.12em}.katex .delimcenter,.katex .op-symbol{position:relative}.katex .op-symbol.small-op{font-family:KaTeX_Size1}.katex .op-symbol.large-op{font-family:KaTeX_Size2}.katex .accent>.vlist-t,.katex .op-limits>.vlist-t{text-align:center}.katex .accent .accent-body{position:relative}.katex .accent .accent-body:not(.accent-full){width:0}.katex .overlay{display:block}.katex .mtable .vertical-separator{display:inline-block;min-width:1px}.katex .mtable .arraycolsep{display:inline-block}.katex .mtable .col-align-c>.vlist-t{text-align:center}.katex .mtable .col-align-l>.vlist-t{text-align:left}.katex .mtable .col-align-r>.vlist-t{text-align:right}.katex .svg-align{text-align:left}.katex svg{fill:currentColor;stroke:currentColor;fill-rule:nonzero;fill-opacity:1;stroke-width:1;stroke-linecap:butt;stroke-linejoin:miter;stroke-miterlimit:4;stroke-dasharray:none;stroke-dashoffset:0;stroke-opacity:1;display:block;height:inherit;position:absolute;width:100%}.katex svg path{stroke:none}.katex img{border-style:none;max-height:none;max-width:none;min-height:0;min-width:0}.katex .stretchy{display:block;overflow:hidden;position:relative;width:100%}.katex .stretchy:after,.katex .stretchy:before{content:""}.katex .hide-tail{overflow:hidden;position:relative;width:100%}.katex .halfarrow-left{left:0;overflow:hidden;position:absolute;width:50.2%}.katex .halfarrow-right{overflow:hidden;position:absolute;right:0;width:50.2%}.katex .brace-left{left:0;overflow:hidden;position:absolute;width:25.1%}.katex .brace-center{left:25%;overflow:hidden;position:absolute;width:50%}.katex .brace-right{overflow:hidden;position:absolute;right:0;width:25.1%}.katex .x-arrow-pad{padding:0 .5em}.katex .cd-arrow-pad{padding:0 .55556em 0 .27778em}.katex .mover,.katex .munder,.katex .x-arrow{text-align:center}.katex .boxpad{padding:0 .3em}.katex .fbox,.katex .fcolorbox{border:.04em solid;box-sizing:border-box}.katex .cancel-pad{padding:0 .2em}.katex .cancel-lap{margin-left:-.2em;margin-right:-.2em}.katex .sout{border-bottom-style:solid;border-bottom-width:.08em}.katex .angl{border-right:.049em solid;border-top:.049em solid;box-sizing:border-box;margin-right:.03889em}.katex .anglpad{padding:0 .03889em}.katex .eqn-num:before{content:"(" counter(katexEqnNo) ")";counter-increment:katexEqnNo}.katex .mml-eqn-num:before{content:"(" counter(mmlEqnNo) ")";counter-increment:mmlEqnNo}.katex .mtr-glue{width:50%}.katex .cd-vert-arrow{display:inline-block;position:relative}.katex .cd-label-left{display:inline-block;position:absolute;right:calc(50% + .3em);text-align:left}.katex .cd-label-right{display:inline-block;left:calc(50% + .3em);position:absolute;text-align:right}.katex-display{display:block;margin:1em 0;text-align:center}.katex-display>.katex{display:block;text-align:center;white-space:nowrap}.katex-display>.katex>.katex-html{display:block;position:relative}.katex-display>.katex>.katex-html>.tag{position:absolute;right:0}.katex-display.leqno>.katex>.katex-html>.tag{left:0;right:auto}.katex-display.fleqn>.katex{padding-left:2em;text-align:left}body{counter-reset:katexEqnNo mmlEqnNo}
/**
 * 简单对话 /chat：ASL 玻璃卡片风格（Chrome 80：无 color-mix / :has / conic-gradient）
 * 横屏：左会话栏 + 右主卡；竖屏：主区全宽，会话栏为左侧抽屉 + 遮罩。
 */

.modular-chat {
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 20px 44px rgba(160, 48, 18, 0.22);
  --asl-radius: 26px;
  --asl-radius-sm: 18px;
  --mc-glass: rgba(255, 255, 255, 0.86);
  --mc-glass-border: rgba(255, 255, 255, 0.65);
  --mc-panel-bg: rgba(255, 255, 255, 0.78);
  --mc-pad: 12px;
  --mc-gap: 10px;

  box-sizing: border-box;
  position: relative;
  /* 优先吃满父级（学生壳 main）；无父级高度时再回退视口 */
  height: 100%;
  min-height: 100%;
  max-height: 100%;
  width: 100%;
  overflow: hidden;
  overscroll-behavior: none;
  color: var(--asl-ink);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  background:
    radial-gradient(ellipse 80% 60% at 8% 12%, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 55%),
    radial-gradient(ellipse 70% 55% at 92% 78%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 58%),
    linear-gradient(148deg, var(--asl-accent-soft) 0%, var(--asl-accent) 46%, var(--asl-accent-deep) 100%);
  -webkit-tap-highlight-color: transparent;
}

.modular-chat *,
.modular-chat *::before,
.modular-chat *::after {
  box-sizing: border-box;
}

.modular-chat__backdrop {
  position: absolute;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
  z-index: 35;
  margin: 0;
  padding: 0;
  border: none;
  /* 旧 WebView 上 backdrop-filter 易留幽灵遮罩挡点击，仅用实色半透明 */
  background: rgba(28, 18, 12, 0.42);
  cursor: pointer;
  animation: mc-fade-in 0.2s ease both;
  -webkit-tap-highlight-color: transparent;
}

/* 抽屉打开时侧栏高于遮罩；关闭按钮在侧栏顶栏 */

.modular-chat__layout.ant-layout {
  display: flex;
  /* 覆盖全局 .ant-layout 默认 column；无 has-sider 时也会把主区挤出 overflow */
  flex-direction: row !important;
  height: 100%;
  min-height: 0 !important; /* 覆盖全局 ant-layout min-height:100vh，避免高出一截 */
  width: 100%;
  max-width: 100%;
  background: transparent;
  overflow: hidden;
}

/* 单独打开 /chat（无产品壳、作为 #root 直接子级）时铺满视口。
 * 禁止写成 `body > #root .modular-chat`：那会匹配教师/学生壳内嵌套，
 * 按 100vh 计算后被顶栏裁掉底部输入框。 */
#root > .modular-chat {
  height: 100vh;
  height: 100dvh;
  max-height: 100vh;
  max-height: 100dvh;
}

/* 壳内：吃满内容区剩余高度，不要再按视口 100vh 计算 */
.teacher-app-shell__content .modular-chat,
.student-app-shell__main .modular-chat {
  height: 100%;
  min-height: 0;
  max-height: 100%;
}

.modular-chat__sider.ant-layout-sider {
  background: transparent !important;
  border-right: none !important;
  padding: var(--mc-pad) 0 var(--mc-pad) var(--mc-pad);
  z-index: 40;
  /* 覆盖全局 .ant-layout-sider { max-width:100vw }，避免侧栏抢满宽 */
  max-width: 320px;
  flex-shrink: 0;
}

.modular-chat__sider .ant-layout-sider-children {
  height: 100%;
  border-radius: var(--asl-radius);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--mc-glass-border);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.08);
  overflow: hidden;
}

.modular-chat__content.ant-layout-content {
  display: flex;
  flex-direction: column;
  /* 覆盖全局 .ant-layout-content { width:100%; max-width:100vw } —— 横屏双栏时否则主区被挤出屏幕 */
  flex: 1 1 auto !important;
  width: auto !important;
  max-width: none !important;
  min-width: 0 !important;
  height: 100%;
  padding: var(--mc-pad) var(--mc-pad) var(--mc-pad) var(--mc-gap);
  background: transparent;
  position: relative;
  z-index: 1;
  overflow: hidden;
}

.modular-chat__main-card {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  border-radius: var(--asl-radius);
  background: rgba(255, 255, 255, 0.94);
  border: 1px solid var(--mc-glass-border);
  box-shadow: var(--asl-shadow);
  overflow: hidden;
  animation: mc-card-in 0.35s ease both;
}

.modular-chat__messages {
  flex: 1 1 auto;
  min-height: 0;
  max-height: 100%;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  overscroll-behavior-y: contain;
  padding: 18px 20px;
  background:
    radial-gradient(ellipse 60% 40% at 50% 0%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 70%),
    var(--asl-card-surface);
}

@keyframes mc-fade-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes mc-card-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes mc-drawer-in {
  from {
    opacity: 0.6;
    transform: translateX(-12px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes mc-bubble-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* —— 侧栏 —— */
.modular-chat .chat-sidebar {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: transparent;
}

.modular-chat .chat-sidebar__top {
  padding: 14px 14px 12px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.55);
}

.modular-chat .chat-sidebar__top-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
}

.modular-chat .chat-sidebar__brand {
  display: inline-flex !important;
  align-items: center;
  margin: 0 !important;
  padding: 4px 12px;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em;
  color: #fff !important;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to));
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
}

.modular-chat .chat-sidebar__close.ant-btn {
  height: 36px;
  padding: 0 14px;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  color: var(--asl-ink) !important;
  background: rgba(255, 255, 255, 0.96) !important;
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
}

.modular-chat .chat-sidebar__close.ant-btn:hover,
.modular-chat .chat-sidebar__close.ant-btn:focus {
  color: var(--asl-accent-deep) !important;
  border-color: var(--asl-accent) !important;
  background: #fff !important;
}

.modular-chat .chat-sidebar__new-btn.ant-btn-primary {
  width: 100%;
  height: 48px;
  border: none !important;
  border-radius: 999px;
  font-weight: 700;
  font-size: 15px;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

.modular-chat .chat-sidebar__new-btn.ant-btn-primary:hover,
.modular-chat .chat-sidebar__new-btn.ant-btn-primary:focus {
  background: linear-gradient(90deg, var(--asl-accent-soft), var(--asl-accent-deep)) !important;
  opacity: 0.96;
}

.modular-chat .chat-sidebar__list {
  flex: 1;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 12px 0 8px;
}

.modular-chat .chat-sidebar .ant-list,
.modular-chat .chat-sidebar .ant-list-items {
  background: transparent;
}

.modular-chat .chat-sidebar .ant-list-empty-text {
  display: none;
}

.modular-chat .chat-sidebar .ant-list-item {
  display: block;
  padding: 0 !important;
  -webkit-border-after: none !important;
          border-block-end: none !important;
  border: none !important;
}

.modular-chat .chat-sidebar__list-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 0 16px 10px;
}

.modular-chat .chat-sidebar__list-title {
  color: var(--asl-ink-soft) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
}

.modular-chat .chat-sidebar__list-count {
  min-width: 24px;
  height: 22px;
  padding: 0 8px;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 700;
  color: var(--asl-accent-deep);
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.06);
}

.modular-chat .chat-sidebar__item {
  padding: 12px 12px 12px 14px;
  margin: 0 10px 8px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.65);
  background: rgba(255, 255, 255, 0.72);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.04);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  transition: background 0.2s ease, transform 0.15s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}

.modular-chat .chat-sidebar__item:hover,
.modular-chat .chat-sidebar__item:focus {
  outline: none;
  background: rgba(255, 255, 255, 0.92);
  transform: translateY(-1px);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
}

.modular-chat .chat-sidebar__item--active {
  background: rgba(255, 255, 255, 0.98);
  border-color: transparent;
  box-shadow:
    0 8px 18px rgba(0, 0, 0, 0.08),
    inset 0 0 0 2px var(--asl-accent);
}

.modular-chat .chat-sidebar__item-row {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
}

.modular-chat .chat-sidebar__item-body {
  flex: 1;
  min-width: 0;
}

.modular-chat .chat-sidebar__item-title {
  display: block;
  margin-bottom: 4px;
  font-size: 14px !important;
  font-weight: 700 !important;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--asl-ink) !important;
}

.modular-chat .chat-sidebar__item-preview {
  display: block;
  margin-bottom: 8px;
  font-size: 12px !important;
  line-height: 1.45;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  color: var(--asl-ink-soft) !important;
}

.modular-chat .chat-sidebar__item-tags {
  display: flex;
  gap: 6px;
  flex-wrap: wrap;
}

.modular-chat .chat-sidebar__item-tags .ant-tag,
.modular-chat .chat-sidebar__tag.ant-tag {
  -webkit-margin-end: 0;
          margin-inline-end: 0;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.05);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.4;
  padding: 2px 10px;
}

.modular-chat .chat-sidebar__tag--role.ant-tag {
  background: linear-gradient(165deg, #ffffff 0%, var(--asl-card, #fff8f3) 100%);
  color: var(--asl-accent-deep);
}

/* 删除：平板无 hover，需始终可见且可点 */
.modular-chat .chat-sidebar__item-delete.ant-btn {
  width: 36px;
  height: 36px;
  min-width: 36px;
  padding: 0 !important;
  flex-shrink: 0;
  border-radius: 12px !important;
  border: 1px solid rgba(207, 19, 34, 0.14) !important;
  opacity: 1;
  color: #cf1322 !important;
  background: rgba(255, 255, 255, 0.95) !important;
  box-shadow: 0 2px 8px rgba(207, 19, 34, 0.08);
}

.modular-chat .chat-sidebar__item-delete.ant-btn:hover,
.modular-chat .chat-sidebar__item-delete.ant-btn:focus {
  color: #fff !important;
  border-color: transparent !important;
  background: linear-gradient(145deg, #ff7875, #cf1322) !important;
}

.modular-chat .chat-sidebar__empty {
  text-align: center;
  padding: 28px 16px;
  color: var(--asl-ink-soft);
}

.modular-chat .chat-sidebar__empty-card {
  padding: 18px 14px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px dashed rgba(0, 0, 0, 0.1);
}

.modular-chat .chat-sidebar__empty-title {
  display: block;
  font-size: 14px !important;
  font-weight: 700 !important;
  color: var(--asl-ink) !important;
  margin-bottom: 4px;
}

.modular-chat .chat-sidebar__empty-hint {
  display: block;
  font-size: 12px !important;
  color: var(--asl-ink-soft) !important;
}

.modular-chat .chat-sidebar__user {
  padding: 12px 14px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.72);
}

.modular-chat .chat-sidebar__user-trigger {
  width: 100%;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 8px 10px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  text-align: left;
  font: inherit;
  cursor: pointer;
  transition: background 0.2s ease, border-color 0.2s ease;
}

.modular-chat .chat-sidebar__user-trigger:hover {
  background: #fff;
  border-color: var(--asl-accent);
}

.modular-chat .chat-sidebar__user-avatar.ant-avatar,
.modular-chat .chat-sidebar__user .ant-avatar {
  margin-right: 0;
  background: linear-gradient(
    160deg,
    var(--asl-avatar-from, #ffe8d8) 0%,
    var(--asl-avatar-to, #ffc39a) 100%
  ) !important;
  color: var(--asl-avatar-ink, #9a3412) !important;
  border: 2px solid #fff;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.1);
}

.modular-chat .chat-sidebar__user-meta {
  flex: 1;
  min-width: 0;
}

.modular-chat .chat-sidebar__user-name {
  font-weight: 700;
  font-size: 14px;
  color: var(--asl-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.modular-chat .chat-sidebar__user-role,
.modular-chat .chat-sidebar__user-caret,
.modular-chat .chat-sidebar__user-tip,
.modular-chat .chat-sidebar__home-link {
  font-size: 12px;
  color: var(--asl-ink-soft);
}

.modular-chat .chat-sidebar__user-caret {
  color: var(--asl-accent-deep);
  font-size: 11px;
}

.modular-chat .chat-sidebar__user-tip {
  margin-top: 8px;
  text-align: center;
}

.modular-chat .chat-sidebar__home-link {
  margin-top: 4px;
}

.modular-chat .chat-sidebar__home-link a {
  color: var(--asl-accent-deep);
  text-decoration: none;
  font-weight: 600;
}

/* —— 顶栏：两行 —— ①会话/标题横排 ②知识库|角色横排 —— */
.modular-chat .chat-header {
  padding: 10px 14px 12px;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 10px;
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.94);
  flex-shrink: 0;
}

.modular-chat .chat-header__row {
  display: flex;
  align-items: center;
  min-width: 0;
  width: 100%;
}

.modular-chat .chat-header__row--primary {
  gap: 10px;
}

.modular-chat .chat-header__row--tools {
  justify-content: space-between;
  gap: 10px;
}

.modular-chat .chat-header__titles-inline {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  flex: 1;
  overflow: hidden;
}

.modular-chat .chat-header__title {
  display: inline-flex !important;
  align-items: center;
  flex-shrink: 0;
  margin: 0 !important;
  padding: 5px 12px;
  font-size: 14px !important;
  font-weight: 800 !important;
  letter-spacing: 0.03em;
  line-height: 1.2;
  color: #fff !important;
  border-radius: 999px;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to));
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
  white-space: nowrap;
}

.modular-chat .chat-header__titles-sep {
  flex-shrink: 0;
  color: var(--asl-ink-soft);
  font-weight: 700;
}

.modular-chat .chat-header__conv-title,
.modular-chat .chat-header__subtitle {
  min-width: 0;
  font-size: 13px;
  font-weight: 600;
  color: var(--asl-ink);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.modular-chat .chat-header__subtitle {
  color: var(--asl-ink-soft);
  font-weight: 500;
}

.modular-chat .chat-header__menu-btn.ant-btn {
  height: 38px;
  padding: 0 12px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  flex-shrink: 0;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.96);
  color: var(--asl-accent-deep);
  font-weight: 700;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.06);
}

.modular-chat .chat-header__menu-btn.ant-btn:hover {
  border-color: var(--asl-accent) !important;
  color: var(--asl-accent-deep) !important;
}

.modular-chat .chat-header__menu-btn--open.ant-btn,
.modular-chat--sider-open .chat-header__menu-btn.ant-btn {
  background: linear-gradient(145deg, var(--asl-pill-from), var(--asl-pill-to));
  border-color: transparent;
  color: #fff;
}

.modular-chat .chat-header__menu-text {
  font-size: 14px;
  line-height: 1;
}

.modular-chat .chat-header__kb {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin: 0;
  padding: 7px 12px 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: linear-gradient(165deg, #ffffff 0%, var(--asl-card, #fff8f3) 100%);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  font: inherit;
  color: inherit;
  flex-shrink: 0;
}

.modular-chat .chat-header__kb--on {
  border-color: transparent;
  box-shadow:
    0 4px 12px rgba(0, 0, 0, 0.08),
    inset 0 0 0 1.5px var(--asl-accent);
}

.modular-chat .chat-header__kb-icon {
  color: var(--asl-accent-deep);
  font-size: 15px;
}

.modular-chat .chat-header__kb-label {
  font-size: 13px;
  font-weight: 700;
  color: var(--asl-ink);
  white-space: nowrap;
}

.modular-chat .chat-header__kb-switch {
  position: relative;
  width: 38px;
  height: 22px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.14);
  flex-shrink: 0;
  transition: background 0.2s ease;
}

.modular-chat .chat-header__kb--on .chat-header__kb-switch {
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to));
}

.modular-chat .chat-header__kb-knob {
  position: absolute;
  top: 2px;
  left: 2px;
  width: 18px;
  height: 18px;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.18);
  transition: left 0.2s ease;
}

.modular-chat .chat-header__kb--on .chat-header__kb-knob {
  left: 18px;
}

.modular-chat .chat-header__kb-state {
  font-size: 12px;
  font-weight: 700;
  color: var(--asl-ink-soft);
  min-width: 1em;
}

.modular-chat .chat-header__kb--on .chat-header__kb-state {
  color: var(--asl-accent-deep);
}

.modular-chat .chat-header__role-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  max-width: min(220px, 52vw);
  margin: 0;
  padding: 7px 12px 7px 10px;
  border-radius: 999px;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: linear-gradient(165deg, #ffffff 0%, var(--asl-card, #fff8f3) 100%);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  font: inherit;
  color: var(--asl-ink);
  flex-shrink: 1;
  min-width: 0;
}

.modular-chat .chat-header__role-btn.is-open,
.modular-chat .chat-header__role-btn:hover {
  border-color: var(--asl-accent);
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.08);
}

.modular-chat .chat-header__role-btn-label {
  flex-shrink: 0;
  font-size: 12px;
  font-weight: 700;
  color: var(--asl-ink-soft);
}

.modular-chat .chat-header__role-btn-value {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
  overflow: hidden;
}

.modular-chat .chat-header__role-btn-icon {
  flex-shrink: 0;
  font-size: 15px;
  line-height: 1;
}

.modular-chat .chat-header__role-btn-name {
  font-size: 13px;
  font-weight: 700;
  color: var(--asl-ink);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.modular-chat .chat-header__role-btn-caret {
  flex-shrink: 0;
  font-size: 10px;
  color: var(--asl-accent-deep);
}

/* —— 底部输入 —— */
.modular-chat .chat-input,
.modular-chat .enhanced-chat-input {
  padding: 14px 16px 16px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.96);
  flex-shrink: 0;
  position: relative;
  z-index: 2;
}

.modular-chat .chat-input__row,
.modular-chat .enhanced-chat-input__row {
  display: flex;
  gap: 10px;
  align-items: flex-end;
  max-width: 860px;
  margin: 0 auto;
}

.modular-chat .chat-input__textarea,
.modular-chat .chat-input .ant-input,
.modular-chat .enhanced-chat-input .ant-input {
  flex: 1;
  min-height: 56px !important;
  padding: 14px 16px !important;
  border-radius: 18px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.95) !important;
  font-size: 16px !important;
  line-height: 1.55 !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.modular-chat .chat-input .ant-input:focus,
.modular-chat .enhanced-chat-input .ant-input:focus {
  border-color: var(--asl-accent) !important;
  box-shadow: 0 0 0 2px var(--asl-glow);
}

.modular-chat .chat-input__send.ant-btn-primary,
.modular-chat .chat-input .ant-btn-primary,
.modular-chat .enhanced-chat-input .ant-btn-primary:not(.ant-btn-dangerous) {
  height: 56px;
  min-width: 56px;
  border: none !important;
  border-radius: 999px;
  font-weight: 700;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
}

.modular-chat .enhanced-chat-input .ant-btn-default {
  height: 42px;
  min-width: 44px;
  border-radius: 14px;
  border-color: rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.92);
  color: var(--asl-ink);
}

.modular-chat .chat-input--gate {
  padding: 14px 16px 16px;
}

.modular-chat .chat-input__gate-card {
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
  padding: 14px 12px;
  border-radius: 18px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px dashed rgba(0, 0, 0, 0.1);
}

.modular-chat .chat-input__gate-title {
  display: block;
  font-size: 15px;
  font-weight: 700;
  color: var(--asl-ink) !important;
  margin-bottom: 4px;
}

.modular-chat .chat-input__gate-desc {
  display: block;
  font-size: 13px;
  color: var(--asl-ink-soft) !important;
  margin-bottom: 12px;
}

.modular-chat .chat-input__gate-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
}

.modular-chat .chat-input__gate-btn.ant-btn-primary {
  min-width: 168px;
  height: 44px;
  border: none !important;
  border-radius: 999px;
  font-weight: 700;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
}

.modular-chat .chat-input__gate-secondary.ant-btn {
  min-width: 132px;
  height: 44px;
  border-radius: 999px;
  font-weight: 600;
  color: var(--asl-ink);
  border-color: rgba(0, 0, 0, 0.1);
  background: #fff;
}

/* 主区空态欢迎 */
.modular-chat__welcome {
  min-height: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 28px 20px;
  gap: 8px;
}

.modular-chat__welcome-icon {
  width: 76px;
  height: 76px;
  border-radius: 24px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 34px;
  color: #fff;
  background: linear-gradient(145deg, var(--asl-pill-from), var(--asl-pill-to));
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.14);
  margin-bottom: 8px;
}

.modular-chat__welcome-title {
  font-size: 22px !important;
  font-weight: 800 !important;
  color: var(--asl-ink) !important;
}

.modular-chat__welcome-desc {
  max-width: 22em;
  font-size: 14px !important;
  line-height: 1.55;
  color: var(--asl-ink-soft) !important;
  margin-bottom: 8px;
}

.modular-chat__welcome-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 6px;
}

.modular-chat__welcome-btn.ant-btn-primary {
  min-width: 180px;
  height: 48px;
  border: none !important;
  border-radius: 999px;
  font-weight: 700;
  font-size: 16px;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.14);
}

.modular-chat__welcome-secondary.ant-btn {
  min-width: 140px;
  height: 48px;
  border-radius: 999px;
  font-weight: 700;
  color: var(--asl-ink);
  border-color: rgba(0, 0, 0, 0.1);
  background: rgba(255, 255, 255, 0.95);
}

.modular-chat__welcome-link.ant-btn-link {
  color: var(--asl-accent-deep);
  font-weight: 600;
}

/* —— EnhancedChatMessages（仅 .modular-chat 内） —— */
.modular-chat .enhanced-chat-messages {
  max-width: 880px;
  margin: 0 auto;
  /* 高度随内容增长，滚动交给外层 .modular-chat__messages */
  height: auto;
  min-height: 0;
}

.modular-chat .enhanced-chat-messages__end {
  height: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: hidden;
  line-height: 0;
  font-size: 0;
}

.modular-chat .enhanced-chat-messages__empty {
  text-align: center;
  color: var(--asl-ink-soft) !important;
  padding: 56px 20px;
  min-height: 240px;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}

.modular-chat .enhanced-chat-messages__empty-icon {
  width: 72px;
  height: 72px;
  margin-bottom: 14px;
  border-radius: 22px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 36px !important;
  background: linear-gradient(145deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  background-clip: border-box !important;
  -webkit-background-clip: border-box !important;
  -webkit-text-fill-color: #fff !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.14);
  color: #fff !important;
}

.modular-chat .enhanced-chat-messages__empty .ant-typography {
  color: var(--asl-ink) !important;
}

.modular-chat .enhanced-chat-row {
  display: flex;
  margin-bottom: 18px;
  animation: mc-bubble-in 0.28s ease both;
}

.modular-chat .enhanced-chat-row--user {
  justify-content: flex-end;
}

.modular-chat .enhanced-chat-row--ai {
  justify-content: flex-start;
}

.modular-chat .enhanced-chat-bubble-wrap {
  max-width: 82%;
  display: flex;
  align-items: flex-start;
  gap: 12px;
}

.modular-chat .enhanced-chat-row--user .enhanced-chat-bubble-wrap {
  flex-direction: row-reverse;
}

.modular-chat .enhanced-chat-avatar.ant-avatar {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  line-height: 46px !important;
  border-radius: 16px !important;
  border: 2px solid #fff !important;
  flex-shrink: 0;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  font-weight: 700 !important;
  font-size: 18px !important;
  box-shadow:
    0 6px 14px rgba(20, 24, 32, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.5) inset !important;
}

.modular-chat .enhanced-chat-avatar--user.ant-avatar {
  background: linear-gradient(
    160deg,
    var(--asl-avatar-from, #ffe8d8) 0%,
    var(--asl-avatar-to, #ffc39a) 100%
  ) !important;
  color: var(--asl-avatar-ink, #9a3412) !important;
}

.modular-chat .enhanced-chat-avatar--user.ant-avatar .anticon {
  color: var(--asl-avatar-ink, #9a3412) !important;
  font-size: 20px !important;
}

.modular-chat .enhanced-chat-avatar--ai.ant-avatar {
  background: linear-gradient(
    150deg,
    #fff1e4 0%,
    #ffb07a 42%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  color: #fff !important;
  border-radius: 50% !important;
}

.modular-chat .enhanced-chat-avatar--ai.ant-avatar .anticon {
  color: #fff !important;
  font-size: 22px !important;
}

.modular-chat .enhanced-chat-bubble--user {
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  color: #fff !important;
  padding: 12px 16px !important;
  border-radius: 18px 18px 6px 18px !important;
  font-size: 15px !important;
  line-height: 1.65;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

.modular-chat .enhanced-chat-think {
  background: rgba(255, 255, 255, 0.72) !important;
  border: 1px solid rgba(255, 255, 255, 0.9) !important;
  border-radius: 16px !important;
  padding: 12px 14px !important;
  margin-bottom: 8px;
  font-size: 13px !important;
  line-height: 1.55;
  color: var(--asl-ink) !important;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", sans-serif !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
}

.modular-chat .enhanced-chat-think__label {
  color: var(--asl-accent-deep) !important;
}

.modular-chat .enhanced-chat-answer {
  background: rgba(255, 255, 255, 0.94) !important;
  border: 1px solid rgba(255, 255, 255, 0.95) !important;
  border-radius: 18px 18px 18px 6px !important;
  padding: 16px 18px !important;
  font-size: 15px !important;
  line-height: 1.7;
  color: var(--asl-ink) !important;
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.07) !important;
  margin-top: 6px;
}

.modular-chat .enhanced-chat-meta {
  margin-top: 8px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 8px;
  color: var(--asl-ink-soft);
  font-size: 12px;
}

.modular-chat .enhanced-chat-audio {
  display: inline-flex;
  align-items: center;
  gap: 8px;
}

.modular-chat .enhanced-chat-audio__controls {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 4px 6px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.08);
  box-shadow: 0 4px 12px rgba(20, 24, 32, 0.06);
}

.modular-chat .enhanced-chat-audio__btn.ant-btn {
  height: 34px !important;
  padding: 0 12px 0 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(232, 79, 40, 0.22) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  color: var(--asl-accent-deep) !important;
  background: linear-gradient(165deg, #ffffff 0%, #ffe8d8 100%) !important;
  box-shadow: 0 4px 12px rgba(232, 79, 40, 0.12) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.modular-chat .enhanced-chat-audio__btn.ant-btn .anticon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px !important;
  color: #fff !important;
  background: linear-gradient(
    145deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  box-shadow: 0 2px 6px rgba(232, 79, 40, 0.28);
}

.modular-chat .enhanced-chat-audio__btn--primary.ant-btn {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
}

.modular-chat .enhanced-chat-audio__btn--primary.ant-btn .anticon {
  background: rgba(255, 255, 255, 0.28) !important;
  box-shadow: none;
}

.modular-chat .enhanced-chat-audio__btn.ant-btn:hover {
  color: var(--asl-accent-deep) !important;
  border-color: var(--asl-accent) !important;
}

.modular-chat .enhanced-chat-audio__btn--primary.ant-btn:hover {
  color: #fff !important;
  opacity: 0.95;
}

.modular-chat .enhanced-chat-audio__btn.ant-btn-loading,
.modular-chat .enhanced-chat-audio__btn.ant-btn[disabled] {
  opacity: 0.7 !important;
}

.modular-chat .enhanced-chat-audio__slider {
  width: 88px !important;
  margin: 0 4px 0 0 !important;
}

.modular-chat .enhanced-chat-audio__slider .ant-slider-track {
  background: var(--asl-accent) !important;
}

.modular-chat .enhanced-chat-audio__slider .ant-slider-handle {
  border-color: var(--asl-accent-deep) !important;
}

.modular-chat .enhanced-chat-audio__slider .ant-slider-handle::after {
  box-shadow: 0 0 0 2px var(--asl-accent) !important;
}

.modular-chat .enhanced-chat-answer--pending {
  display: flex;
  align-items: center;
  min-height: 48px;
}

.modular-chat .enhanced-chat-stream-caret {
  display: inline-block;
  margin-left: 2px;
  color: var(--asl-accent-deep);
  font-weight: 700;
  animation: modular-chat-caret-blink 1s step-end infinite;
}

@keyframes modular-chat-caret-blink {
  50% { opacity: 0; }
}

.modular-chat .enhanced-chat-input__recording {
  margin-bottom: 12px;
  padding: 8px 12px;
  background: rgba(255, 77, 79, 0.1);
  border: 1px solid rgba(255, 77, 79, 0.35);
  border-radius: 14px;
}

/*
 * 安卓软键盘：KeyboardResize.None + 仅抬升底部输入条（不再 Body 整体 resize，
 * 避免「整页被顶起」并压扁对话/输入区）。
 */
body.native-keyboard-open .modular-chat {
  /* 不强制改回 100vh，避免在学生壳内再次高出一截 */
  max-height: 100%;
}

body.native-keyboard-open .modular-chat .native-keyboard-compose {
  padding-bottom: calc(10px + var(--native-keyboard-inset, 0px)) !important;
  box-shadow: 0 -6px 18px rgba(0, 0, 0, 0.06) !important;
  background: rgba(255, 255, 255, 0.98) !important;
  position: relative;
  z-index: 5;
}

body.native-keyboard-open .modular-chat__messages {
  padding-bottom: 8px;
}

/* —— 角色下拉面板（createPortal 挂 body，避开 overflow / Ant Dropdown） —— */
.chat-header__role-panel,
.modular-chat-role-panel {
  max-height: min(360px, 55vh);
  display: flex;
  flex-direction: column;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.75);
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 16px 36px rgba(0, 0, 0, 0.16);
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}

.chat-header__role-panel-scroll {
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  padding: 8px;
  max-height: min(300px, 48vh);
}

.chat-header__role-section {
  margin-bottom: 6px;
}

.chat-header__role-section-label {
  padding: 6px 10px 4px;
  font-size: 12px;
  font-weight: 700;
  color: var(--asl-ink-soft, #8a6452);
}

.chat-header__role-option {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 2px 0;
  padding: 10px 12px;
  border: none;
  border-radius: 12px;
  background: transparent;
  color: var(--asl-ink, #5c3a2a);
  font: inherit;
  text-align: left;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.chat-header__role-option:hover,
.chat-header__role-option.is-active {
  background: rgba(255, 255, 255, 0.95);
  box-shadow: inset 0 0 0 1.5px var(--asl-accent, #ff6b3d);
}

.chat-header__role-option-main {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.chat-header__role-option-icon {
  flex-shrink: 0;
  font-size: 16px;
}

.chat-header__role-option-name {
  font-size: 14px;
  font-weight: 700;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.chat-header__role-option-check {
  color: var(--asl-accent-deep, #e84f28);
  font-size: 12px;
}

.chat-header__role-empty {
  padding: 16px 12px;
  text-align: center;
  color: var(--asl-ink-soft, #8a6452);
  font-size: 13px;
}

.chat-header__role-manage {
  padding: 6px;
  border-top: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.96);
}

.chat-header__role-manage .ant-btn {
  border-radius: 12px;
  color: var(--asl-ink, #5c3a2a);
  font-weight: 600;
}

.chat-header__role-manage .ant-btn:hover {
  color: var(--asl-accent-deep, #e84f28) !important;
  background: rgba(0, 0, 0, 0.04) !important;
}

/* —— 侧栏用户 Dropdown —— */
.modular-chat-user-dropdown.ant-dropdown .ant-dropdown-menu,
.modular-chat .modular-chat-user-dropdown.ant-dropdown .ant-dropdown-menu {
  padding: 8px;
  border-radius: 18px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: rgba(255, 255, 255, 0.96);
  box-shadow: 0 14px 32px rgba(0, 0, 0, 0.14);
}

.modular-chat-user-dropdown .ant-dropdown-menu-item {
  border-radius: 12px;
  color: var(--asl-ink, #5c3a2a);
  margin: 2px 0;
}

.modular-chat-user-dropdown .ant-dropdown-menu-item:hover {
  background: rgba(0, 0, 0, 0.04) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
}

.modular-chat-user-dropdown .ant-dropdown-menu-item-divider {
  margin: 6px 4px;
  background: rgba(0, 0, 0, 0.06);
}

.modular-chat-user-dropdown .ant-dropdown-menu-item .anticon {
  color: var(--asl-accent-deep, #e84f28);
}

/* —— 删除确认 / 角色管理 Modal —— */
.modular-chat-confirm-wrap .ant-modal-content,
.modular-chat-role-modal .ant-modal-content {
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: var(--asl-shadow, 0 20px 44px rgba(160, 48, 18, 0.22));
  background: #fffaf6;
}

.modular-chat-confirm-wrap .ant-modal-confirm-title,
.modular-chat-role-modal .ant-modal-title {
  color: var(--asl-ink, #5c3a2a);
  font-weight: 700;
}

.modular-chat-confirm-wrap .ant-modal-confirm-content,
.modular-chat-role-modal .ant-modal-body {
  color: var(--asl-ink-soft, #8a6452);
}

.modular-chat-confirm-wrap .ant-btn,
.modular-chat-role-modal .ant-btn {
  border-radius: 999px;
}

.modular-chat-confirm-wrap .ant-btn-primary,
.modular-chat-role-modal .ant-btn-primary {
  border: none;
  background: linear-gradient(90deg, var(--asl-pill-from, #ff7d4a), var(--asl-pill-to, #f24a1c));
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
}

.modular-chat-confirm-wrap .ant-btn-dangerous.ant-btn-primary,
.modular-chat-role-modal .ant-btn-dangerous {
  background: #ff4d4f;
  box-shadow: none;
}

.modular-chat-role-modal .ant-input,
.modular-chat-role-modal .ant-input-affix-wrapper,
.modular-chat-role-modal textarea.ant-input {
  border-radius: 14px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
}

.modular-chat-role-modal .ant-input:focus,
.modular-chat-role-modal .ant-input-focused,
.modular-chat-role-modal textarea.ant-input:focus {
  border-color: var(--asl-accent, #ff6b3d) !important;
  box-shadow: 0 0 0 2px var(--asl-glow, rgba(255, 200, 90, 0.16));
}

.modular-chat-role-modal .ant-form-item-label > label {
  color: var(--asl-ink, #5c3a2a);
  font-weight: 600;
}

.modular-chat-role-modal__list {
  max-height: 60vh;
  overflow-y: auto;
  padding-right: 2px;
}

.modular-chat-role-modal__item {
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 12px;
  padding: 14px;
  margin-bottom: 10px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
}

.modular-chat-role-modal__item-body {
  flex: 1;
  min-width: 0;
}

.modular-chat-role-modal__item-head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.modular-chat-role-modal__item-icon {
  font-size: 20px;
}

.modular-chat-role-modal__item-name {
  color: var(--asl-ink, #5c3a2a);
}

.modular-chat-role-modal__item-badge {
  font-size: 12px;
  color: var(--asl-ink-soft, #8a6452);
}

.modular-chat-role-modal__item-desc {
  font-size: 12px;
  color: var(--asl-ink-soft, #8a6452);
  margin-bottom: 4px;
}

.modular-chat-role-modal__item-prompt {
  font-size: 11px;
  color: #999;
  max-height: 60px;
  overflow: hidden;
}

.modular-chat-popconfirm .ant-popover-inner {
  border-radius: 16px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.12);
}

.modular-chat-popconfirm .ant-btn-primary {
  border: none;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--asl-pill-from, #ff7d4a), var(--asl-pill-to, #f24a1c));
}

/* =========================================================
 * 横屏双栏（宽屏 .modular-chat--split）：左会话 + 右主对话
 * ========================================================= */
@media screen and (orientation: landscape) {
  .modular-chat {
    --asl-radius: 26px;
    --mc-pad: 12px;
    --mc-gap: 10px;
    padding: 0;
  }

  .modular-chat--split .modular-chat__layout.ant-layout {
    flex-direction: row !important;
  }

  .modular-chat--split .modular-chat__sider.ant-layout-sider {
    position: relative !important;
    flex: 0 0 280px !important;
    max-width: 280px !important;
    min-width: 280px !important;
    width: 280px !important;
    height: 100% !important;
    max-height: 100% !important;
    left: auto !important;
    pointer-events: auto !important;
  }

  .modular-chat--split .modular-chat__sider.ant-layout-sider-collapsed {
    flex: 0 0 0 !important;
    max-width: 0 !important;
    min-width: 0 !important;
    width: 0 !important;
    padding: 0 !important;
    overflow: hidden !important;
  }

  .modular-chat--split .modular-chat__sider .ant-layout-sider-children {
    display: block;
    animation: mc-drawer-in 0.3s ease both;
  }

  .modular-chat--split .modular-chat__content.ant-layout-content {
    flex: 1 1 auto !important;
    width: auto !important;
    max-width: none !important;
    min-width: 0 !important;
    padding: var(--mc-pad) var(--mc-pad) var(--mc-pad) var(--mc-gap);
  }

  .modular-chat .chat-header {
    min-height: 56px;
  }

  .modular-chat .enhanced-chat-bubble-wrap {
    max-width: 78%;
  }

  .modular-chat .chat-input__row {
    max-width: 860px;
  }
}

/* 窄横屏宽度提示（抽屉模式下侧栏仍可略窄） */
@media screen and (orientation: landscape) and (max-width: 900px) {
  .modular-chat--drawer {
    --mc-pad: 8px;
    --mc-gap: 8px;
  }
}

/* 矮横屏：压缩内边距，保证输入区可见 */
@media screen and (orientation: landscape) and (max-height: 520px) {
  .modular-chat {
    --asl-radius: 18px;
    --mc-pad: 6px;
    --mc-gap: 6px;
  }

  .modular-chat .chat-header {
    padding: 8px 12px;
    min-height: 0;
  }

  .modular-chat__messages {
    padding: 10px 12px;
  }

  .modular-chat .chat-input,
  .modular-chat .enhanced-chat-input {
    padding: 8px 10px 10px;
  }

  .modular-chat .chat-input__hint {
    display: none;
  }

  .modular-chat .chat-sidebar__user-tip {
    display: none;
  }

  .modular-chat .enhanced-chat-messages__empty {
    padding: 24px 12px;
    min-height: 120px;
  }
}

/* 宽横屏：会话栏略宽、消息区更舒展 */
@media screen and (orientation: landscape) and (min-width: 1100px) {
  .modular-chat__sider.ant-layout-sider:not(.ant-layout-sider-collapsed) {
    flex: 0 0 300px !important;
    max-width: 300px !important;
    min-width: 300px !important;
    width: 300px !important;
  }

  .modular-chat .enhanced-chat-messages {
    max-width: 920px;
  }
}

/* =========================================================
 * 抽屉模式（竖屏 + 窄横屏 .modular-chat--drawer）
 * 会话栏盖在主区上，不挤压对话/输入
 * ========================================================= */
.modular-chat--drawer .modular-chat__layout.ant-layout {
  position: relative;
}

.modular-chat--drawer .modular-chat__sider.ant-layout-sider {
  position: absolute !important;
  left: 0;
  top: 0;
  bottom: 0;
  z-index: 40;
  height: 100% !important;
  padding: 10px 0 10px 10px;
  flex: 0 0 0 !important;
  max-width: 0 !important;
  min-width: 0 !important;
  width: 0 !important;
  overflow: hidden !important;
  pointer-events: none !important;
}

.modular-chat--drawer.modular-chat--sider-open .modular-chat__sider.ant-layout-sider:not(.ant-layout-sider-collapsed) {
  width: min(86vw, 300px) !important;
  max-width: min(86vw, 300px) !important;
  min-width: 0 !important;
  flex: 0 0 0 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
}

.modular-chat--drawer.modular-chat--sider-closed .modular-chat__sider.ant-layout-sider,
.modular-chat--drawer .modular-chat__sider.ant-layout-sider-collapsed {
  left: -9999px !important;
  pointer-events: none !important;
}

.modular-chat--drawer .modular-chat__sider .ant-layout-sider-children {
  width: 100%;
  height: 100%;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.18);
}

.modular-chat--drawer.modular-chat--sider-open .modular-chat__sider:not(.ant-layout-sider-collapsed) .ant-layout-sider-children {
  display: block;
  animation: mc-drawer-in 0.28s ease both;
}

.modular-chat--drawer.modular-chat--sider-closed .modular-chat__sider .ant-layout-sider-children,
.modular-chat--drawer .modular-chat__sider.ant-layout-sider-collapsed .ant-layout-sider-children {
  display: none;
}

.modular-chat--drawer .modular-chat__content.ant-layout-content {
  width: 100% !important;
  max-width: 100% !important;
  margin: 0 !important;
  flex: 1 1 auto !important;
  min-width: 0 !important;
  padding: 8px 8px 0;
  padding-top: max(8px, env(safe-area-inset-top, 0px));
}

/* =========================================================
 * 竖屏：触控与字号微调（抽屉结构见上 .modular-chat--drawer）
 * ========================================================= */
@media screen and (orientation: portrait) {
  .modular-chat {
    --asl-radius: 22px;
    --mc-pad: 8px;
    --mc-gap: 8px;
  }

  .modular-chat__main-card {
    border-radius: 22px 22px 0 0;
  }

  .modular-chat__messages {
    padding: 12px 12px 14px;
  }

  .modular-chat .chat-header {
    padding: 10px 12px 12px;
    gap: 10px;
  }

  .modular-chat .chat-header__menu-btn.ant-btn {
    height: 40px;
    min-width: 78px;
    padding: 0 12px;
  }

  .modular-chat .chat-header__title {
    font-size: 13px !important;
    padding: 5px 10px;
  }

  .modular-chat .chat-header__role-btn {
    max-width: min(200px, 48vw);
  }

  .modular-chat .chat-header__kb {
    padding: 7px 10px 7px 8px;
  }

  /* 气泡更宽，便于竖屏阅读 */
  .modular-chat .enhanced-chat-bubble-wrap {
    max-width: 92%;
  }

  .modular-chat .enhanced-chat-messages {
    max-width: none;
  }

  .modular-chat .enhanced-chat-answer {
    padding: 14px 14px !important;
    font-size: 15px !important;
  }

  .modular-chat .enhanced-chat-bubble--user {
    font-size: 15px !important;
  }

  .modular-chat .enhanced-chat-messages__empty {
    padding: 36px 16px;
    min-height: 200px;
  }

  .modular-chat .enhanced-chat-messages__empty-icon {
    width: 64px;
    height: 64px;
    border-radius: 20px;
    font-size: 32px !important;
  }

  /* 输入区加大触控；仅此处保留底部安全区（白色区域内，不上拉露底） */
  .modular-chat .chat-input,
  .modular-chat .enhanced-chat-input {
    padding: 12px 12px max(12px, env(safe-area-inset-bottom, 0px));
  }

  .modular-chat .chat-input__row,
  .modular-chat .enhanced-chat-input__row {
    max-width: none;
    gap: 8px;
  }

  .modular-chat .chat-input__send.ant-btn-primary,
  .modular-chat .chat-input .ant-btn-primary {
    height: 44px;
    min-width: 72px;
    padding: 0 16px;
  }

  .modular-chat .chat-input__textarea,
  .modular-chat .chat-input .ant-input {
    font-size: 16px; /* 减少 iOS 缩放 */
  }

  .modular-chat .chat-sidebar__new-btn.ant-btn-primary {
    height: 48px;
  }

  .modular-chat .chat-sidebar__close.ant-btn {
    height: 38px;
    min-width: 84px;
  }

  .modular-chat .chat-sidebar__item {
    padding: 14px 12px 14px 14px;
    margin-bottom: 10px;
  }

  .modular-chat .chat-sidebar__item-delete.ant-btn {
    width: 40px;
    height: 40px;
    min-width: 40px;
    border-radius: 14px !important;
  }

  .modular-chat .chat-sidebar__user-tip {
    display: none;
  }
}

/* 矮竖屏：再压缩顶栏/空态，保证对话区高度 */
@media screen and (orientation: portrait) and (max-height: 720px) {
  .modular-chat {
    --asl-radius: 18px;
    --mc-pad: 6px;
  }

  .modular-chat__content.ant-layout-content {
    padding: 6px;
  }

  .modular-chat .chat-header {
    padding: 8px 10px;
  }

  .modular-chat .chat-header__title {
    font-size: 14px !important;
  }

  .modular-chat__messages {
    padding: 10px;
  }

  .modular-chat .chat-input__hint {
    display: none;
  }

  .modular-chat .enhanced-chat-messages__empty {
    padding: 20px 12px;
    min-height: 140px;
  }

  .modular-chat .enhanced-chat-messages__empty-icon {
    width: 56px;
    height: 56px;
    margin-bottom: 10px;
  }

  .modular-chat .enhanced-chat-row {
    margin-bottom: 12px;
  }
}

/* PC 产品壳：对齐侧栏 Token，去掉学生平板 ASL 暖橙 */
.modular-chat--product {
  --asl-accent: var(--product-primary, #2563eb);
  --asl-accent-deep: var(--product-primary-hover, #1d4ed8);
  --asl-accent-soft: var(--product-accent, #0ea5e9);
  --asl-ink: var(--product-text, #1e293b);
  --asl-ink-soft: var(--product-text-secondary, #64748b);
  --asl-card: var(--product-surface, #f0f4f8);
  --asl-card-surface: var(--product-surface-card, #ffffff);
  --asl-pill-from: var(--product-primary, #2563eb);
  --asl-pill-to: var(--product-primary-hover, #1d4ed8);
  --asl-avatar-from: var(--product-primary-light, #dbeafe);
  --asl-avatar-to: #93c5fd;
  --asl-avatar-ink: var(--product-primary-hover, #1d4ed8);
  --asl-glow: rgba(37, 99, 235, 0.12);
  --asl-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  --asl-radius: 14px;
  --asl-radius-sm: 12px;
  color: var(--product-text, #1e293b);
  background:
    radial-gradient(ellipse 70% 40% at 0% 0%, rgba(37, 99, 235, 0.08) 0%, transparent 55%),
    var(--product-surface, #f0f4f8);
}

.modular-chat--product .modular-chat__main-card {
  border-radius: 14px;
  background: var(--product-surface-card, #fff);
  box-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.modular-chat--product .enhanced-chat-avatar.ant-avatar {
  width: 58px !important;
  height: 58px !important;
  min-width: 58px !important;
  line-height: 58px !important;
  font-size: 22px !important;
}

.modular-chat--product .enhanced-chat-avatar--user.ant-avatar .anticon {
  font-size: 24px !important;
}

.modular-chat--product .enhanced-chat-avatar--ai.ant-avatar {
  background: linear-gradient(
    150deg,
    var(--product-primary-light, #dbeafe) 0%,
    var(--product-accent, #0ea5e9) 46%,
    var(--product-primary, #2563eb) 100%
  ) !important;
}

.modular-chat--product .enhanced-chat-avatar--ai.ant-avatar .anticon {
  font-size: 26px !important;
}

.modular-chat--product .enhanced-chat-bubble--user {
  padding: 14px 18px !important;
  min-height: 48px;
  font-size: 16px !important;
  line-height: 1.7;
}

.modular-chat--product .enhanced-chat-answer {
  padding: 16px 18px !important;
  font-size: 16px !important;
  line-height: 1.7;
}

.modular-chat--product .enhanced-chat-row {
  margin-bottom: 18px;
}

.modular-chat--product .enhanced-chat-messages__empty-icon {
  width: 72px;
  height: 72px;
}

.modular-chat--product .chat-sidebar__user-avatar.ant-avatar,
.modular-chat--product .chat-sidebar__user .ant-avatar {
  width: 48px !important;
  height: 48px !important;
  line-height: 48px !important;
}
[data-lk-theme]{font-size:var(--lk-font-size);font-family:var(--lk-font-family);color:var(--lk-fg)}[data-lk-theme] .lk-list{list-style:none;margin:0;padding:0}[data-lk-theme] .lk-form-control{font-family:var(--lk-font-family);padding:.625rem 1rem;background-color:var(--lk-control-bg);border:1px solid var(--lk-border-color);border-radius:var(--lk-border-radius)}[data-lk-theme=default]{color-scheme:dark;--lk-bg: #111;--lk-bg2: rgb(29.75, 29.75, 29.75);--lk-bg3: rgb(42.5, 42.5, 42.5);--lk-bg4: rgb(55.25, 55.25, 55.25);--lk-bg5: #444444;--lk-fg: #fff;--lk-fg2: rgb(244.8, 244.8, 244.8);--lk-fg3: rgb(234.6, 234.6, 234.6);--lk-fg4: rgb(224.4, 224.4, 224.4);--lk-fg5: rgb(214.2, 214.2, 214.2);--lk-border-color: rgba(255, 255, 255, 0.1);--lk-accent-fg: #fff;--lk-accent-bg: #1f8cf9;--lk-accent2: rgb(50.867826087, 150.2, 249.532173913);--lk-accent3: rgb(70.7356521739, 160.4, 250.0643478261);--lk-accent4: rgb(90.6034782609, 170.6, 250.5965217391);--lk-danger-fg: #fff;--lk-danger: #f91f31;--lk-danger2: rgb(249.532173913, 50.867826087, 67.2713043478);--lk-danger3: rgb(250.0643478261, 70.7356521739, 85.5426086957);--lk-danger4: rgb(250.5965217391, 90.6034782609, 103.8139130435);--lk-success-fg: #fff;--lk-success: #1ff968;--lk-success2: rgb(50.867826087, 249.532173913, 117.3930434783);--lk-success3: rgb(70.7356521739, 250.0643478261, 130.7860869565);--lk-success4: rgb(90.6034782609, 250.5965217391, 144.1791304348);--lk-control-fg: var(--lk-fg);--lk-control-bg: var(--lk-bg2);--lk-control-hover-bg: var(--lk-bg3);--lk-control-active-bg: var(--lk-bg4);--lk-control-active-hover-bg: var(--lk-bg5);--lk-connection-excellent: #06db4d;--lk-connection-good: #f9b11f;--lk-connection-poor: #f91f31;--lk-font-family: system-ui, -apple-system, "Segoe UI", Roboto, Helvetica, Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji";--lk-font-size: 16px;--lk-line-height: 1.5;--lk-border-radius: 0.5rem;--lk-box-shadow: 0 0.5rem 1.5rem rgba(0, 0, 0, 0.15);--lk-drop-shadow: rgba(255, 255, 255, 0.2) 0px 0px 24px;--lk-grid-gap: 0.5rem;--lk-control-bar-height: 69px;--lk-chat-header-height: 69px}.lk-button,.lk-start-audio-button,.lk-chat-toggle,.lk-disconnect-button{position:relative;display:inline-flex;align-items:center;justify-content:center;gap:.5rem;padding:.625rem 1rem;color:var(--lk-control-fg);background-image:none;background-color:var(--lk-control-bg);border:0;border-radius:var(--lk-border-radius);cursor:pointer;white-space:nowrap;font-size:inherit;line-height:inherit;-webkit-user-select:none;-moz-user-select:none;user-select:none}.lk-button:not(:disabled):hover,.lk-start-audio-button:not(:disabled):hover,.lk-chat-toggle:not(:disabled):hover,.lk-disconnect-button:not(:disabled):hover{background-color:var(--lk-control-hover-bg)}.lk-button>svg,.lk-start-audio-button>svg,.lk-chat-toggle>svg,.lk-disconnect-button>svg{overflow:visible}.lk-button[aria-pressed=true],[aria-pressed=true].lk-start-audio-button,[aria-pressed=true].lk-chat-toggle,[aria-pressed=true].lk-disconnect-button{background-color:var(--lk-control-active-bg)}.lk-button[aria-pressed=true]:hover,[aria-pressed=true].lk-start-audio-button:hover,[aria-pressed=true].lk-chat-toggle:hover,[aria-pressed=true].lk-disconnect-button:hover{background-color:var(--lk-control-active-hover-bg)}.lk-button[data-lk-source=screen_share][data-lk-enabled=true],[data-lk-source=screen_share][data-lk-enabled=true].lk-start-audio-button,[data-lk-source=screen_share][data-lk-enabled=true].lk-chat-toggle,[data-lk-source=screen_share][data-lk-enabled=true].lk-disconnect-button{background-color:var(--lk-accent-bg)}.lk-button[data-lk-source=screen_share][data-lk-enabled=true]:hover,[data-lk-source=screen_share][data-lk-enabled=true].lk-start-audio-button:hover,[data-lk-source=screen_share][data-lk-enabled=true].lk-chat-toggle:hover,[data-lk-source=screen_share][data-lk-enabled=true].lk-disconnect-button:hover{background-color:var(--lk-accent2)}.lk-button:disabled,.lk-start-audio-button:disabled,.lk-chat-toggle:disabled,.lk-disconnect-button:disabled{opacity:.5}.lk-button-group{display:inline-flex;align-items:stretch;height:100%}.lk-button-group>.lk-button:first-child,.lk-button-group>.lk-start-audio-button:first-child,.lk-button-group>.lk-chat-toggle:first-child,.lk-button-group>.lk-disconnect-button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.lk-button-group-menu{position:relative;flex-shrink:0}.lk-button-group-menu>.lk-button,.lk-button-group-menu>.lk-start-audio-button,.lk-button-group-menu>.lk-chat-toggle,.lk-button-group-menu>.lk-disconnect-button{height:100%;border-top-left-radius:0;border-bottom-left-radius:0}.lk-button-group-menu>.lk-button::after,.lk-button-group-menu>.lk-start-audio-button::after,.lk-button-group-menu>.lk-chat-toggle::after,.lk-button-group-menu>.lk-disconnect-button::after{margin-left:0}.lk-button-menu::after{display:inline-block;content:"";width:.5em;height:.5em;margin-top:-0.25rem;margin-left:.5rem;border-left:.125em solid;border-bottom:.125em solid;transform:rotate(-45deg);transform-origin:center center}.lk-disconnect-button{font-weight:600;color:var(--lk-danger);border:1px solid var(--lk-danger)}.lk-disconnect-button:not(:disabled):hover{--lk-control-hover-bg: var(--lk-danger2);color:var(--lk-danger-fg)}.lk-disconnect-button:not(:disabled):active{--lk-control-hover-bg: var(--lk-danger3);color:var(--lk-danger-fg)}.lk-chat-toggle{position:relative}.lk-chat-toggle[data-lk-unread-msgs]:not([data-lk-unread-msgs="0"]):after{content:attr(data-lk-unread-msgs);position:absolute;top:0;left:0;padding:.25rem;margin-left:.25rem;margin-top:.25rem;border-radius:50%;font-size:.5rem;line-height:.75;background:var(--lk-accent-bg)}.lk-media-device-select:not(:last-child){padding-bottom:.5rem;margin-bottom:.75rem;border-bottom:1px solid var(--lk-border-color)}.lk-media-device-select li:not(:last-child){margin-bottom:.25rem}.lk-media-device-select li>.lk-button{width:100%;justify-content:start;padding-block:.5rem}.lk-media-device-select li:not([data-lk-active=true])>.lk-button:not(:disabled):hover{background-color:var(--lk-bg3)}.lk-media-device-select [data-lk-active=false]>.lk-button:hover{cursor:pointer;background-color:rgba(0,0,0,.05)}.lk-media-device-select [data-lk-active=true]>.lk-button{color:var(--lk-accent-fg);background-color:var(--lk-accent-bg)}.lk-device-menu{width:-webkit-max-content;width:-moz-max-content;width:max-content;position:absolute;top:0;left:0;z-index:5;min-width:10rem;padding:.5rem;margin-bottom:.25rem;white-space:nowrap;background-color:var(--lk-bg2);border:1px solid var(--lk-border-color);border-radius:.75rem;box-shadow:var(--lk-box-shadow)}.lk-device-menu-heading{padding:.25rem .5rem;font-weight:bold;opacity:.65}.lk-start-audio-button{color:var(--lk-accent-fg);background-color:var(--lk-accent-bg)}@media screen and (max-width: 600px){.lk-start-audio-button{position:fixed;top:50%;left:50%;transform:translate(-50%, -50%)}}.lk-pagination-control{position:absolute;bottom:1rem;left:50%;transform:translateX(-50%);display:flex;align-items:stretch;background-color:var(--lk-control-bg);border-radius:var(--lk-border-radius);transition:opacity ease-in-out .15s;opacity:0}.lk-pagination-control:hover{opacity:1}.lk-pagination-control>.lk-button:first-child{border-top-right-radius:0;border-bottom-right-radius:0}.lk-pagination-control>.lk-button:first-child>svg{transform:rotate(180deg)}.lk-pagination-control>.lk-button:last-child{border-top-left-radius:0;border-bottom-left-radius:0}.lk-pagination-count{padding:.5rem .875rem;border-inline:1px solid var(--lk-bg)}[data-lk-user-interaction=true].lk-pagination-control{opacity:1}.lk-pagination-indicator{position:absolute;height:var(--lk-grid-gap);background-color:var(--lk-bg2);width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;padding:.2rem .5rem;bottom:calc(var(--lk-grid-gap)/2);left:50%;transform:translateX(-50%);border-radius:2rem;opacity:1;display:flex;gap:.2rem;align-items:center}.lk-pagination-indicator span{display:inline-block;width:.4rem;height:.4rem;border-radius:9999999px;background-color:var(--lk-fg);opacity:.35;transition:opacity linear .2s}.lk-pagination-indicator span[data-lk-active]{opacity:.9}.lk-grid-layout{--lk-col-count: 1;--lk-row-count: 1;display:grid;grid-template-columns:repeat(var(--lk-col-count), minmax(0, 1fr));grid-auto-rows:minmax(0, 1fr);grid-gap:var(--lk-grid-gap);width:100%;height:100%;max-width:100%;max-height:100%;padding:var(--lk-grid-gap)}.lk-grid-layout[data-lk-pagination=true]{padding-bottom:calc(var(--lk-grid-gap)*2)}.lk-focus-layout{display:grid;grid-template-columns:1fr 5fr;gap:var(--lk-grid-gap);width:100%;max-height:100%;padding:var(--lk-grid-gap)}.lk-focused-participant{position:relative}.lk-focused-participant .lk-pip-track{position:absolute;top:10px;right:10px;width:20%;height:auto}@media(max-width: 600px){.lk-focus-layout{grid-template-columns:1fr;grid-template-rows:5fr 1fr}.lk-carousel{order:1}}.lk-carousel{max-height:100%;display:flex;gap:var(--lk-grid-gap)}.lk-carousel>*{flex-shrink:0;aspect-ratio:16/10;scroll-snap-align:start}.lk-carousel[data-lk-orientation=vertical]{flex-direction:column;-webkit-scroll-snap-type:y mandatory;scroll-snap-type:y mandatory;overflow-y:auto;overflow-x:hidden}.lk-carousel[data-lk-orientation=vertical]>*{--lk-height-minus-gaps: calc(100% - calc(var(--lk-grid-gap) * calc(var(--lk-max-visible-tiles) - 1)));height:calc(var(--lk-height-minus-gaps)/var(--lk-max-visible-tiles))}.lk-carousel[data-lk-orientation=horizontal]{-webkit-scroll-snap-type:x mandatory;scroll-snap-type:x mandatory;overflow-y:hidden;overflow-x:auto}.lk-carousel[data-lk-orientation=horizontal]>*{--lk-width-minus-gaps: calc(100% - var(--lk-grid-gap) * (var(--lk-max-visible-tiles) - 1));width:calc(var(--lk-width-minus-gaps)/var(--lk-max-visible-tiles))}.lk-connection-quality{width:1.5rem;height:1.5rem}.lk-track-muted-indicator-camera,.lk-track-muted-indicator-microphone{position:relative;width:var(--lk-indicator-size, 1rem);height:var(--lk-indicator-size, 1rem);-webkit-margin-end:.25rem;margin-inline-end:.25rem;transition:opacity .25s ease-in-out}.lk-track-muted-indicator-camera[data-lk-muted=true]{opacity:.5}.lk-track-muted-indicator-microphone{--lk-bg: var(--lk-icon-mic)}.lk-track-muted-indicator-microphone[data-lk-muted=true]{opacity:.5}.lk-participant-name{font-size:.875rem}.lk-participant-media-video{width:100%;height:100%;-o-object-fit:cover;object-fit:cover;-o-object-position:center;object-position:center;background-color:#000}.lk-participant-media-video[data-lk-orientation=landscape]{-o-object-fit:cover;object-fit:cover}.lk-participant-media-video[data-lk-orientation=portrait],.lk-participant-media-video[data-lk-source=screen_share]{-o-object-fit:contain;object-fit:contain;background-color:var(--lk-bg2)}.lk-participant-media-audio{width:auto}[data-lk-facing-mode=user] .lk-participant-media-video[data-lk-local-participant=true][data-lk-source=camera]{transform:rotateY(180deg)}.lk-audio-visualizer{width:100%;height:100%;min-height:160px;background:var(--lk-bg-control);aspect-ratio:16/9;border-radius:.5rem;display:flex;justify-content:space-around;align-items:center}.lk-audio-visualizer>rect{fill:var(--lk-accent-bg);transition:transform 100ms cubic-bezier(0.19, 0.02, 0.09, 1)}.lk-audio-visualizer>path{stroke:var(--lk-accent-bg);transition:100ms cubic-bezier(0.19, 0.02, 0.09, 1)}.lk-audio-bar-visualizer{display:flex;align-items:center;justify-content:center;width:100%;height:100%;background:var(--lk-bg);gap:var(--lk-va-bar-gap, 24px)}.lk-audio-bar-visualizer>.lk-audio-bar{transform-origin:"center";height:100%;width:var(--lk-va-bar-width, 12px);border-radius:var(--lk-va-bar-border-radius, 32px);background-color:var(--lk-va-bar-bg, rgba(136, 136, 136, 0.2));transition:background-color .25s ease-out}.lk-audio-bar-visualizer[data-lk-va-state=speaking]>.lk-audio-bar,.lk-audio-bar-visualizer>.lk-audio-bar.lk-highlighted,.lk-audio-bar-visualizer>[data-lk-highlighted=true]{background-color:var(--lk-fg, rgb(136, 136, 136));transition:none}.lk-audio-bar-visualizer[data-lk-va-state=thinking]{transition:background-color .15s ease-out}.lk-participant-tile{--lk-speaking-indicator-width: 2.5px;position:relative;display:flex;flex-direction:column;gap:.375rem;overflow:hidden;border-radius:var(--lk-border-radius)}.lk-participant-tile::after{content:"";position:absolute;top:0;bottom:0;left:0;right:0;border-radius:var(--lk-border-radius);border:0px solid var(--lk-accent-bg);transition-property:border opacity;transition-delay:.5s;transition-duration:.4s;pointer-events:none}.lk-participant-tile[data-lk-speaking=true]:not([data-lk-source=screen_share])::after{transition-delay:0s;transition-duration:.2s;border-width:var(--lk-speaking-indicator-width)}.lk-participant-tile .lk-focus-toggle-button{position:absolute;top:.25rem;right:.25rem;padding:.25rem;background-color:rgba(0,0,0,.5);border-radius:calc(var(--lk-border-radius)/2);opacity:0;transition:opacity .2s ease-in-out;transition-delay:.2s}.lk-participant-tile:hover .lk-focus-toggle-button,.lk-participant-tile:focus .lk-focus-toggle-button{opacity:1;transition-delay:0}.lk-participant-tile .lk-connection-quality{opacity:0;transition:opacity .2s ease-in-out;transition-delay:.2s}.lk-participant-tile .lk-connection-quality[data-lk-quality=poor]{opacity:1;transition-delay:0}.lk-participant-tile:hover .lk-connection-quality,.lk-participant-tile:focus .lk-connection-quality{opacity:1;transition-delay:0}.lk-participant-tile .lk-participant-placeholder{position:absolute;inset:0;display:flex;align-items:center;justify-content:center;background-color:var(--lk-bg2);opacity:0;transition:opacity .2s ease-in-out;pointer-events:none;border-radius:var(--lk-border-radius)}.lk-participant-tile .lk-participant-placeholder svg{height:100%;width:auto;padding:10%}.lk-participant-tile[data-lk-video-muted=true][data-lk-source=camera] .lk-participant-placeholder{opacity:1}.lk-participant-metadata{position:absolute;right:.25rem;bottom:.25rem;left:.25rem;display:flex;flex-direction:row;align-items:center;justify-content:space-between;gap:.5rem;line-height:1}.lk-participant-metadata-item{display:flex;align-items:center;padding:.25rem;background-color:rgba(0,0,0,.5);border-radius:calc(var(--lk-border-radius)/2)}.lk-toast{position:fixed;top:.75rem;left:50%;transform:translateX(-50%);display:flex;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background-color:var(--lk-bg);border:1px solid var(--lk-border-color);border-radius:var(--lk-border-radius);box-shadow:var(--lk-box-shadow)}.lk-spinner{animation:lk-rotate 2s infinite linear}@keyframes lk-rotate{from{transform:rotate(0deg)}to{transform:rotate(359deg)}}.lk-room-container{background-color:var(--lk-bg);line-height:var(--lk-line-height)}[data-lk-theme]{font-size:var(--lk-font-size);font-family:var(--lk-font-family);color:var(--lk-fg)}[data-lk-theme] .lk-list{list-style:none;margin:0;padding:0}[data-lk-theme] .lk-form-control{font-family:var(--lk-font-family);padding:.625rem 1rem;background-color:var(--lk-control-bg);border:1px solid var(--lk-border-color);border-radius:var(--lk-border-radius)}.lk-room-container{position:relative;width:100%;height:100%;--lk-has-imported-styles: "true"}.lk-room-container *[class^=lk-],.lk-room-container *[class*=" lk-"]{box-sizing:border-box}.lk-audio-conference{position:relative;width:100%;height:100%}.lk-audio-conference-stage{width:100%;height:100%;display:grid;grid-template-columns:repeat(3, 1fr);gap:10px}.lk-chat{display:grid;grid-template-rows:var(--lk-chat-header-height) 1fr var(--lk-control-bar-height);width:clamp(200px,55ch,60ch);background-color:var(--lk-bg2);border-left:1px solid var(--lk-border-color);align-items:end}.lk-chat-header{height:var(--lk-chat-header-height);padding:.75rem;position:relative;display:flex;align-items:center;justify-content:center}.lk-chat-header .lk-close-button{position:absolute;right:0;transform:translateX(-50%);background-color:rgba(0,0,0,0)}.lk-chat-header .lk-close-button:hover{background-color:var(--lk-control-active-hover-bg)}.lk-chat-messages{display:flex;width:100%;max-height:100%;flex-direction:column;gap:.25rem;overflow:auto}.lk-chat-entry{display:flex;flex-direction:column;gap:.25rem;margin:0 .25rem}.lk-chat-entry .lk-meta-data{font-size:.75rem;color:var(--lk-fg5);white-space:nowrap;padding:0 .3rem;display:flex}.lk-chat-entry .lk-meta-data .lk-participant-name{margin-top:1rem}.lk-chat-entry .lk-meta-data .lk-timestamp{margin-left:auto;align-self:flex-end}.lk-chat-entry .lk-edit-button{background:none;float:right;margin:0;padding:0 .25rem;border-radius:0;font-size:12px}.lk-chat-entry .lk-message-body{display:inline-block;border-radius:15px;padding:.25rem .75rem;word-break:break-word;width:-webkit-fit-content;width:-moz-fit-content;width:fit-content;max-width:calc(100% - 32px)}.lk-chat-entry[data-lk-message-origin=local] .lk-message-body{background-color:var(--lk-bg5)}.lk-chat-entry[data-lk-message-origin=remote] .lk-message-body{background-color:var(--lk-accent4)}.lk-chat-entry a{text-decoration:underline;color:inherit}.lk-chat-entry *{-webkit-margin-before:.25em;margin-block-start:.25em;-webkit-margin-after:.25em;margin-block-end:.25em}.lk-chat-entry:last-child{margin-bottom:.25rem}.lk-chat-form{display:flex;gap:.75rem;padding:.75rem;border-top:1px solid var(--lk-border-color);max-height:var(--lk-control-bar-height)}.lk-chat-form-input{font-size:inherit;line-height:inherit;width:100%}@media(max-width: 600px){.lk-chat{position:fixed;top:0;right:0;max-width:100%;bottom:var(--lk-control-bar-height)}}.lk-control-bar,.lk-agent-control-bar{display:flex;gap:.5rem;align-items:center;justify-content:center;padding:.75rem;border-top:1px solid var(--lk-border-color);max-height:var(--lk-control-bar-height)}.lk-agent-control-bar{height:var(--lk-control-bar-height);--lk-bg: transparent;--lk-va-bar-width: 2px;--lk-va-bar-gap: 4px;--lk-va-bar-border-radius: 1px}.lk-agent-control-bar .lk-audio-bar-visualizer .lk-audio-bar.lk-highlighted{-webkit-filter:none;filter:none}.lk-prejoin{background-color:var(--lk-bg);line-height:var(--lk-line-height)}[data-lk-theme]{font-size:var(--lk-font-size);font-family:var(--lk-font-family);color:var(--lk-fg)}[data-lk-theme] .lk-list{list-style:none;margin:0;padding:0}[data-lk-theme] .lk-form-control{font-family:var(--lk-font-family);padding:.625rem 1rem;background-color:var(--lk-control-bg);border:1px solid var(--lk-border-color);border-radius:var(--lk-border-radius)}.lk-prejoin{box-sizing:border-box;display:flex;flex-direction:column;align-items:center;padding:1rem;gap:1rem;margin-inline:auto;background-color:var(--lk-bg);width:min(100%,480px);align-items:stretch}.lk-prejoin .lk-video-container{position:relative;width:100%;height:auto;aspect-ratio:16/10;background-color:#000;border-radius:var(--lk-border-radius);overflow:hidden}.lk-prejoin .lk-video-container video,.lk-prejoin .lk-video-container .lk-camera-off-note{display:block;width:100%;height:100%;-o-object-fit:cover;object-fit:cover}.lk-prejoin .lk-video-container video[data-lk-facing-mode=user]{transform:rotateY(180deg)}.lk-prejoin .lk-video-container .lk-camera-off-note{position:absolute;top:0px;left:0px;width:100%;aspect-ratio:16/10;background-color:#000;display:grid;place-items:center}.lk-prejoin .lk-video-container .lk-camera-off-note>*{height:70%;max-width:100%}.lk-prejoin .lk-audio-container{display:none}.lk-prejoin .lk-audio-container audio{width:100%;height:auto}.lk-prejoin .lk-button-group-container{display:flex;flex-wrap:nowrap;gap:1rem}.lk-prejoin .lk-button-group-container>.lk-button-group{width:50%}.lk-prejoin .lk-button-group-container>.lk-button-group>.lk-button{justify-content:left}.lk-prejoin .lk-button-group-container>.lk-button-group>.lk-button:first-child{width:100%}@media(max-width: 400px){.lk-prejoin .lk-button-group-container{flex-wrap:wrap}.lk-prejoin .lk-button-group-container>.lk-button-group{width:100%}}.lk-prejoin .lk-username-container{display:flex;flex-direction:column;gap:1rem;width:100%;max-width:100%}.lk-prejoin .lk-join-button{--lk-control-fg: var(--lk-accent-fg);--lk-control-bg: var(--lk-accent-bg);--lk-control-hover-bg: var(--lk-accent2);--lk-control-active-bg: var(--lk-accent3);--lk-control-active-hover-bg: var(--lk-accent4);background-color:var(--lk-control-bg)}.lk-prejoin .lk-join-button:hover{background-color:var(--lk-control-hover-bg)}.lk-focus-layout-wrapper,.lk-grid-layout-wrapper{position:relative;display:flex;justify-content:center;width:100%;height:calc(100% - var(--lk-control-bar-height))}.lk-grid-layout-wrapper{flex-direction:column;align-items:center}.lk-focus-layout-wrapper{align-items:stretch}.lk-video-conference{position:relative;display:flex;align-items:stretch;height:100%}.lk-video-conference-inner{display:flex;flex-direction:column;align-items:stretch;width:100%}.lk-settings-menu-modal{position:fixed;top:50%;left:50%;transform:translate(-50%, -50%);background:var(--lk-bg);padding:1rem;border-radius:var(--lk-border-radius);display:flex;flex-direction:column;align-items:center;gap:.5rem;padding:.75rem 1.25rem;background-color:var(--lk-bg);border:1px solid var(--lk-border-color);border-radius:var(--lk-border-radius);box-shadow:var(--lk-box-shadow);min-width:50vw;min-height:50vh;max-width:100%;max-height:100%;overflow-y:auto}
/*# sourceMappingURL=index.css.map *//* 议课 LiveKit 弹窗：视频区可伸缩，底部控制栏始终可见 */
.debrief-livekit-modal .ant-modal-body {
  display: flex;
  flex-direction: column;
  overflow: hidden;
  padding: 12px !important;
  min-height: 520px;
  max-height: min(86vh, 720px);
}

.debrief-livekit-modal .debrief-livekit-room-root {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.debrief-livekit-modal .debrief-livekit-room-root > div:last-child {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.debrief-livekit-modal .lk-video-conference {
  height: 100% !important;
  max-height: 100% !important;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.debrief-livekit-modal .lk-video-conference-inner {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.debrief-livekit-modal .lk-grid-layout-wrapper,
.debrief-livekit-modal .lk-focus-layout-wrapper {
  flex: 1;
  min-height: 160px;
  overflow: hidden;
}

.debrief-livekit-modal .lk-control-bar,
.debrief-livekit-modal .lk-control-bar.lk-control-bar {
  flex-shrink: 0;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px 4px;
  min-height: 48px;
  box-sizing: border-box;
}

/* 手机：全屏视频会议，留足底部控制栏 */
.debrief-livekit-modal--compact.ant-modal {
  top: 0 !important;
  max-width: 100vw !important;
  width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
}

.debrief-livekit-modal--compact .ant-modal-content {
  height: 100dvh;
  max-height: 100dvh;
  border-radius: 0;
  display: flex;
  flex-direction: column;
}

.debrief-livekit-modal--compact .ant-modal-header {
  flex-shrink: 0;
  padding: 10px 12px;
}

.debrief-livekit-modal--compact .ant-modal-body {
  flex: 1;
  min-height: 0 !important;
  max-height: none !important;
  padding: 8px !important;
}

.debrief-livekit-modal--compact .debrief-livekit-modal-tip {
  display: none;
}

.debrief-livekit-modal--compact .lk-control-bar,
.debrief-livekit-modal--compact .lk-control-bar.lk-control-bar {
  padding-bottom: max(8px, env(safe-area-inset-bottom));
}

/* 弹窗：视频 + 右侧实时字幕 */
.debrief-livekit-modal-layout {
  display: flex;
  flex-direction: row;
  gap: 12px;
  height: min(72vh, 620px);
  min-height: 460px;
  overflow: hidden;
}

.debrief-livekit-modal-video {
  flex: 1;
  min-width: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.debrief-livekit-modal-video .debrief-livekit-room-root {
  flex: 1;
  min-height: 0;
}

.debrief-livekit-modal-transcript {
  width: 280px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  border-left: 1px solid #f0f0f0;
  padding-left: 12px;
}

.debrief-meeting-transcript--embedded {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
}

.debrief-livekit-modal-layout--compact {
  flex-direction: column;
  height: auto;
  min-height: 0;
}

.debrief-livekit-modal-layout--compact .debrief-livekit-modal-transcript {
  width: 100%;
  border-left: none;
  border-top: 1px solid #f0f0f0;
  padding-left: 0;
  padding-top: 8px;
  max-height: 32vh;
  flex-shrink: 0;
}

.debrief-rtasr-status {
  padding: 8px 10px;
  margin-bottom: 8px;
  background: rgba(0, 0, 0, 0.02);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 6px;
}

.debrief-rtasr-status--compact {
  padding: 6px 8px;
  margin-bottom: 6px;
}

.debrief-rtasr-status-row {
  display: flex;
  align-items: center;
  gap: 4px;
}

.debrief-rtasr-status-debug {
  display: flex;
  flex-direction: column;
  gap: 2px;
  word-break: break-all;
}

.debrief-livekit-modal-title {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding-right: 24px;
}

.debrief-livekit-minimized-bar {
  position: fixed;
  right: 16px;
  bottom: max(16px, env(safe-area-inset-bottom));
  z-index: 1050;
  padding: 10px 14px;
  background: #fff;
  border: 1px solid #d9d9d9;
  border-radius: 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

@media (max-width: 767px) {
  .debrief-livekit-minimized-bar {
    left: 12px;
    right: 12px;
    bottom: max(12px, env(safe-area-inset-bottom));
  }

  .debrief-livekit-minimized-bar .ant-space {
    width: 100%;
    justify-content: space-between;
    flex-wrap: wrap;
  }
}
/* 教研协作：手机/窄屏布局补丁 */

/* 课题详情 · 研究轮次列表（避免 List.Item actions 挤压标题竖排） */
.tr-cycle-list .ant-list-item {
  display: block;
  padding: 12px 0;
}

.tr-cycle-list-item .tr-cycle-list-body {
  display: flex;
  flex-direction: column;
  gap: 10px;
  width: 100%;
}

.tr-cycle-list-item .ant-list-item-meta-title {
  white-space: normal;
  word-break: break-word;
  line-height: 1.45;
  margin-bottom: 4px !important;
}

.tr-cycle-list-actions {
  width: 100%;
}

.tr-cycle-list-actions .ant-btn {
  flex: 1 1 auto;
  min-width: 120px;
}

@media (min-width: 768px) {
  .tr-cycle-list-item .tr-cycle-list-body {
    flex-direction: row;
    align-items: flex-start;
    justify-content: space-between;
    gap: 16px;
  }

  .tr-cycle-list-actions {
    width: auto;
    flex-shrink: 0;
    justify-content: flex-end;
  }

  .tr-cycle-list-actions .ant-btn {
    flex: none;
    min-width: unset;
  }
}

/* 议课视频会议面板 */
.debrief-video-meeting-panel__main-grid {
  min-height: 0;
}

@media (max-width: 767px) {
  .debrief-video-meeting-panel .debrief-toolbar .ant-space {
    width: 100%;
  }

  .debrief-video-meeting-panel .debrief-toolbar .ant-btn {
    width: 100%;
  }

  .debrief-video-meeting-panel .debrief-transcript-item {
    display: block;
  }

  .debrief-video-meeting-panel .debrief-transcript-item .ant-list-item-action {
    margin-top: 8px;
    margin-left: 0 !important;
  }
}
.openmaic-panel {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  gap: 8px;
}

.openmaic-panel__toolbar {
  flex-shrink: 0;
}

.openmaic-panel__toolbar .ant-form-item {
  margin-bottom: 0;
}

.openmaic-panel__stage {
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  overflow: hidden;
  border: 1px solid #e5e7eb;
  border-radius: 10px;
  background: #fff;
}

.openmaic-panel__stage iframe {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.openmaic-panel__hint {
  padding: 16px;
}
/* 平板学生包 · 个人中心（/profile）
 * 色板由 aslThemes 经内联 --asl-* 注入；此处仅布局与组件样式。
 * Chrome 80：无 color-mix / :has / conic-gradient
 */

.asl-profile {
  /* 暖橙回退（与 aslThemes.sunset 一致；运行时由内联变量覆盖） */
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-avatar-from: #ffe8d8;
  --asl-avatar-to: #ffc39a;
  --asl-avatar-ink: #9a3412;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 18px 36px rgba(160, 48, 18, 0.16);
  --asl-radius: 28px;
  --asl-radius-sm: 22px;
  --asl-glass: rgba(255, 255, 255, 0.82);
  --asl-glass-border: rgba(255, 255, 255, 0.9);

  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  max-width: 920px;
  margin: 0 auto;
  /* 默认按竖屏：底栏 Dock 留白；横屏在 media 里改右侧留白 */
  padding: 18px 16px 96px;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  padding-bottom: max(96px, calc(84px + env(safe-area-inset-bottom, 12px)));
  color: var(--asl-ink);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  background:
    radial-gradient(ellipse 70% 48% at 10% 0%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 55%),
    radial-gradient(ellipse 55% 40% at 92% 100%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 58%),
    linear-gradient(168deg, var(--asl-card-surface) 0%, var(--asl-card) 46%, #ffffff 100%);
  -webkit-tap-highlight-color: transparent;
}

.asl-profile__body {
  min-width: 0;
  width: 100%;
}

.asl-profile__form {
  width: 100%;
}

.asl-profile *,
.asl-profile *::before,
.asl-profile *::after {
  box-sizing: border-box;
}

/* —— 顶栏英雄区 —— */
.asl-profile__hero {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 18px 18px 16px;
  margin-bottom: 16px;
  border-radius: var(--asl-radius);
  background: var(--asl-glass);
  border: 1px solid var(--asl-glass-border);
  box-shadow: var(--asl-shadow);
  overflow: hidden;
  animation: asl-profile-in 0.35s ease both;
}

.asl-profile__hero::before {
  content: "";
  position: absolute;
  left: 16px;
  right: 16px;
  top: 0;
  height: 4px;
  border-radius: 0 0 8px 8px;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to));
  transform-origin: left center;
  animation: asl-profile-bar 0.45s ease both;
  z-index: 1;
}

.asl-profile__hero-left {
  display: flex;
  align-items: center;
  min-width: 0;
  position: relative;
  z-index: 2;
}

.asl-profile__hero-left > * + * {
  margin-left: 14px;
}

.asl-profile__avatar {
  position: relative;
  width: 56px;
  height: 56px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.95);
  background: linear-gradient(160deg, var(--asl-avatar-from), var(--asl-avatar-to));
  color: var(--asl-avatar-ink);
  font-weight: 800;
  font-size: 22px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
  flex-shrink: 0;
  overflow: hidden;
  padding: 0;
  cursor: pointer;
  animation: asl-profile-pop 0.4s ease both;
}

.asl-profile__avatar--photo {
  background: #fff;
}

.asl-profile__avatar-img {
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  border-radius: 50%;
}

.asl-profile__avatar-badge {
  position: absolute;
  right: -2px;
  bottom: -2px;
  width: 20px;
  height: 20px;
  border-radius: 50%;
  background: var(--asl-accent, #ff6b3d);
  color: #fff;
  font-size: 11px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border: 2px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 2px 6px rgba(0, 0, 0, 0.16);
}

.asl-profile__avatar-hint {
  margin-top: 4px;
  font-size: 12px;
  color: var(--asl-ink-soft, #8a6452);
  line-height: 1.3;
}

.asl-profile__hero-text {
  min-width: 0;
}

.asl-profile__title {
  margin: 0 !important;
  color: var(--asl-ink) !important;
  font-size: 22px !important;
  font-weight: 800 !important;
  line-height: 1.25 !important;
}

.asl-profile__subtitle {
  margin-top: 4px;
  color: var(--asl-ink-soft);
  font-size: 14px;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 42vw;
}

.asl-profile__actions {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  flex-shrink: 0;
}

.asl-profile__actions > * + * {
  margin-left: 8px;
}

/* —— 主按钮 / 次按钮 —— */
.asl-profile .asl-profile__btn-primary.ant-btn {
  height: 40px !important;
  padding: 0 18px !important;
  border: none !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 10px 20px rgba(0, 0, 0, 0.14) !important;
  transition: opacity 0.15s ease, transform 0.15s ease;
}

.asl-profile .asl-profile__btn-primary.ant-btn:hover,
.asl-profile .asl-profile__btn-primary.ant-btn:focus {
  color: #fff !important;
  opacity: 0.96;
  transform: translateY(-1px);
}

.asl-profile .asl-profile__btn-ghost.ant-btn {
  height: 40px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.75) !important;
  color: var(--asl-ink) !important;
  font-weight: 600 !important;
}

/* —— 加载态 —— */
.asl-profile__loading {
  text-align: center;
  padding: 72px 16px;
  border-radius: var(--asl-radius);
  background: var(--asl-glass);
  border: 1px solid var(--asl-glass-border);
  box-shadow: var(--asl-shadow);
  color: var(--asl-ink-soft);
  animation: asl-profile-in 0.35s ease both;
}

.asl-profile__loading .ant-spin-dot-item {
  background-color: var(--asl-accent);
}

.asl-profile__loading-text {
  margin-top: 14px;
  font-weight: 600;
  color: var(--asl-ink-soft);
}

/* —— Collapse 玻璃卡片 —— */
.asl-profile .asl-profile__collapse.ant-collapse {
  background: transparent !important;
  border: none !important;
}

.asl-profile .asl-profile__collapse > .ant-collapse-item {
  margin-bottom: 12px;
  border: 1px solid var(--asl-glass-border) !important;
  border-radius: var(--asl-radius-sm) !important;
  background: var(--asl-glass) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.06);
  overflow: hidden;
  animation: asl-profile-in 0.4s ease both;
}

.asl-profile .asl-profile__collapse > .ant-collapse-item:nth-child(2) {
  animation-delay: 0.04s;
}

.asl-profile .asl-profile__collapse > .ant-collapse-item:nth-child(3) {
  animation-delay: 0.08s;
}

.asl-profile .asl-profile__collapse > .ant-collapse-item:nth-child(4) {
  animation-delay: 0.12s;
}

.asl-profile .asl-profile__collapse > .ant-collapse-item > .ant-collapse-header {
  padding: 14px 16px !important;
  color: var(--asl-ink) !important;
  font-weight: 700 !important;
  font-size: 15px !important;
  align-items: center !important;
}

.asl-profile .asl-profile__collapse .ant-collapse-expand-icon {
  color: var(--asl-accent) !important;
  padding-right: 10px !important;
}

.asl-profile .asl-profile__panel-label {
  display: inline-flex;
  align-items: center;
  color: var(--asl-ink);
}

.asl-profile .asl-profile__panel-label .anticon {
  color: var(--asl-accent);
  font-size: 16px;
  margin-right: 8px;
}

.asl-profile .asl-profile__collapse > .ant-collapse-item > .ant-collapse-content {
  border-top: 1px solid rgba(0, 0, 0, 0.05) !important;
  background: rgba(255, 255, 255, 0.55) !important;
}

.asl-profile .asl-profile__collapse .ant-collapse-content-box {
  padding: 14px 16px 6px !important;
}

/* —— 表单控件 —— */
.asl-profile .ant-form-item-label > label {
  color: var(--asl-ink-soft) !important;
  font-weight: 600 !important;
}

.asl-profile .ant-input,
.asl-profile .ant-input-affix-wrapper,
.asl-profile .ant-select-selector,
.asl-profile .ant-input-textarea textarea,
.asl-profile textarea.ant-input {
  border-radius: 14px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: #fff !important;
  min-height: 42px;
  color: var(--asl-ink) !important;
}

.asl-profile .ant-input:focus,
.asl-profile .ant-input-focused,
.asl-profile .ant-input-affix-wrapper-focused,
.asl-profile .ant-input-affix-wrapper:focus,
.asl-profile .ant-select-focused .ant-select-selector {
  border-color: var(--asl-accent) !important;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.04) !important;
}

.asl-profile .ant-input[disabled],
.asl-profile .ant-input-disabled,
.asl-profile .ant-select-disabled .ant-select-selector,
.asl-profile textarea.ant-input[disabled] {
  color: var(--asl-ink) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  opacity: 1 !important;
}

.asl-profile .asl-profile__readonly.ant-input {
  background: rgba(0, 0, 0, 0.04) !important;
  color: var(--asl-ink-soft) !important;
}

.asl-profile .ant-select-arrow {
  color: var(--asl-accent) !important;
}

.asl-profile .ant-tag {
  border-radius: 999px !important;
  border: none !important;
  font-weight: 700;
  padding: 2px 12px;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  color: #fff !important;
}

.asl-profile .ant-input-data-count {
  color: var(--asl-ink-soft) !important;
}

/* —— 未登录卡片 —— */
.asl-profile--guest {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.asl-profile__guest-card.ant-card {
  width: 100%;
  max-width: 420px;
  border-radius: var(--asl-radius) !important;
  border: 1px solid var(--asl-glass-border) !important;
  background: var(--asl-glass) !important;
  box-shadow: var(--asl-shadow) !important;
  animation: asl-profile-in 0.35s ease both;
}

.asl-profile__guest-card .ant-typography {
  color: var(--asl-ink) !important;
}

/* —— 横屏：左侧资料头 + 右侧可滚动表单（对齐 ASL 双栏习惯） —— */
@media (orientation: landscape) {
  .asl-profile {
    display: flex;
    flex-direction: row;
    align-items: stretch;
    max-width: 1180px;
    height: 100vh;
    height: 100dvh;
    min-height: 100vh;
    min-height: 100dvh;
    padding-top: 12px;
    padding-bottom: max(12px, env(safe-area-inset-bottom, 8px));
    /* 右侧 Dock ≈76px，避免内容贴边/被挡 */
    padding-right: max(20px, calc(88px + env(safe-area-inset-right, 0px)));
    padding-left: max(16px, env(safe-area-inset-left, 0px));
    overflow: hidden;
  }

  .asl-profile__hero {
    flex-direction: column;
    align-items: stretch;
    justify-content: flex-start;
    flex: 0 0 248px;
    width: 248px;
    max-width: 30vw;
    margin-bottom: 0;
    margin-right: 14px;
    padding: 18px 16px 16px;
    align-self: flex-start;
    max-height: calc(100vh - 24px);
    max-height: calc(100dvh - 24px);
  }

  .asl-profile__hero-left {
    flex-direction: column;
    align-items: flex-start;
  }

  .asl-profile__hero-left > * + * {
    margin-left: 0;
    margin-top: 12px;
  }

  .asl-profile__subtitle {
    white-space: normal;
    max-width: 100%;
    line-height: 1.4;
  }

  .asl-profile__actions {
    margin-top: 16px;
    width: 100%;
    flex-direction: column;
    align-items: stretch;
  }

  .asl-profile__actions > * + * {
    margin-left: 0;
    margin-top: 8px;
  }

  .asl-profile__actions .ant-btn {
    width: 100%;
  }

  .asl-profile__body {
    flex: 1 1 auto;
    min-width: 0;
    min-height: 0;
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 4px;
  }

  .asl-profile__loading {
    min-height: 220px;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
  }

  .asl-profile--guest {
    flex-direction: column;
    padding-right: max(24px, env(safe-area-inset-right, 0px));
  }
}

/* 宽横屏：侧栏略宽，表单三列更舒展 */
@media (orientation: landscape) and (min-width: 1000px) {
  .asl-profile__hero {
    flex-basis: 280px;
    width: 280px;
  }

  .asl-profile__title {
    font-size: 24px !important;
  }
}

/* 矮横屏：压缩侧栏与表单项间距 */
@media (orientation: landscape) and (max-height: 520px) {
  .asl-profile {
    padding-top: 8px;
    padding-bottom: 8px;
  }

  .asl-profile__hero {
    padding: 12px 12px 10px;
  }

  .asl-profile__avatar {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }

  .asl-profile__title {
    font-size: 18px !important;
  }

  .asl-profile .ant-form-item {
    margin-bottom: 10px !important;
  }

  .asl-profile .asl-profile__collapse > .ant-collapse-item > .ant-collapse-header {
    padding: 10px 12px !important;
  }
}

/* —— 竖屏：单列 + 底栏 Dock 留白 —— */
@media (orientation: portrait) {
  .asl-profile {
    display: block;
    max-width: 720px;
    height: auto;
    overflow: visible;
    padding-top: max(14px, env(safe-area-inset-top, 0px));
    padding-bottom: max(104px, calc(92px + env(safe-area-inset-bottom, 12px)));
    padding-left: max(14px, env(safe-area-inset-left, 0px));
    padding-right: max(14px, env(safe-area-inset-right, 0px));
  }

  .asl-profile__hero {
    flex-wrap: wrap;
    padding: 16px 14px 14px;
  }

  .asl-profile__hero-left {
    flex: 1 1 auto;
    min-width: 0;
  }

  .asl-profile__title {
    font-size: 20px !important;
  }

  .asl-profile__avatar {
    width: 50px;
    height: 50px;
    font-size: 20px;
  }

  .asl-profile__subtitle {
    max-width: 56vw;
  }

  .asl-profile__actions {
    flex-wrap: wrap;
    justify-content: flex-end;
    margin-top: 4px;
  }

  .asl-profile__actions .ant-btn {
    min-height: 40px;
  }

  /* 编辑态双按钮时整行右对齐，避免顶栏挤爆 */
  .asl-profile__hero .asl-profile__actions {
    flex-basis: auto;
  }

  .asl-profile__body {
    overflow: visible;
  }

  /* 竖屏默认单列字段，宽竖屏再开双列（不依赖 ant md 断点） */
  .asl-profile .asl-profile__field {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }
}

@media (orientation: portrait) and (min-width: 560px) {
  .asl-profile .asl-profile__field {
    flex: 0 0 50% !important;
    max-width: 50% !important;
  }
}

/* 窄竖屏：顶栏改为上下叠放 */
@media (orientation: portrait) and (max-width: 480px) {
  .asl-profile__hero {
    flex-direction: column;
    align-items: stretch;
  }

  .asl-profile__actions {
    width: 100%;
    margin-top: 12px;
  }

  .asl-profile__actions .ant-btn {
    flex: 1 1 auto;
  }

  .asl-profile__subtitle {
    max-width: 100%;
    white-space: normal;
  }
}

/* 矮竖屏：再压顶栏 */
@media (orientation: portrait) and (max-height: 720px) {
  .asl-profile__hero {
    padding: 12px 12px 10px;
    margin-bottom: 12px;
  }

  .asl-profile__avatar {
    width: 44px;
    height: 44px;
    font-size: 18px;
  }
}

@keyframes asl-profile-in {
  from {
    opacity: 0;
    transform: translateY(8px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@keyframes asl-profile-bar {
  from {
    opacity: 0;
    transform: scaleX(0.35);
  }
  to {
    opacity: 1;
    transform: scaleX(1);
  }
}

@keyframes asl-profile-pop {
  from {
    opacity: 0;
    transform: scale(0.9);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}
/* 智能体宠物成长 — 可视化预览 / 配饰商店（管理员与学生共用） */

.pet-growth-visual-root {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  align-items: stretch;
  padding: 4px 0 8px;
}

.pet-growth-visual-main {
  flex: 1 1 320px;
  min-width: 280px;
  max-width: 100%;
}

.pet-growth-visual-stage-row {
  display: flex;
  gap: 12px;
  align-items: center;
  justify-content: center;
}

.pet-growth-hotspot-col {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 8px 0;
}

.pet-growth-hotspot-btn {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  border: none;
  background: linear-gradient(145deg, #e8f4ff 0%, #d6e8fb 100%);
  box-shadow: 0 2px 8px rgba(24, 144, 255, 0.18);
  color: #1677ff;
  cursor: default;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 18px;
  transition: transform 0.15s ease;
}

.pet-growth-hotspot-btn:hover {
  transform: scale(1.06);
}

button.pet-growth-hotspot-btn--action {
  cursor: pointer;
}

.pet-growth-stage-pedestal {
  position: relative;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 20px 24px 28px;
  border-radius: 24px;
  background: linear-gradient(180deg, #f0f9ff 0%, #e6f4ff 45%, #dcf0ff 100%);
  box-shadow:
    inset 0 1px 0 rgba(255, 255, 255, 0.85),
    0 8px 32px rgba(22, 119, 255, 0.12);
}

.pet-growth-stage-glow {
  position: absolute;
  bottom: 12px;
  left: 50%;
  transform: translateX(-50%);
  width: min(280px, 70vw);
  height: 48px;
  border-radius: 50%;
  background: radial-gradient(
    ellipse at center,
    rgba(64, 169, 255, 0.45) 0%,
    rgba(64, 169, 255, 0.08) 55%,
    transparent 70%
  );
  pointer-events: none;
  z-index: 0;
}

.pet-growth-preview-stack {
  position: relative;
  display: inline-block;
  line-height: 0;
  z-index: 1;
}

.pet-growth-preview-stack img.pet-growth-main {
  display: block;
  max-height: min(320px, 52vh);
  width: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.pet-growth-preview-stack img.pet-growth-overlay {
  position: absolute;
  pointer-events: none;
  max-width: 100%;
}

.pet-growth-visual-shop {
  flex: 0 1 340px;
  min-width: 260px;
  max-width: 100%;
  border-radius: 16px;
  padding: 16px;
  background: linear-gradient(180deg, #fafcff 0%, #f3f9ff 100%);
  border: 1px solid rgba(22, 119, 255, 0.12);
  box-shadow: 0 4px 24px rgba(22, 119, 255, 0.08);
}

.pet-growth-shop-title {
  font-weight: 600;
  font-size: 15px;
  color: #0958d9;
  margin-bottom: 10px;
  letter-spacing: 0.02em;
}

.pet-growth-points-bar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  padding: 10px 14px;
  margin-bottom: 14px;
  border-radius: 12px;
  background: linear-gradient(90deg, #e6f4ff 0%, #f0f9ff 100%);
  border: 1px solid rgba(22, 119, 255, 0.15);
}

.pet-growth-points-bar .label {
  color: #595959;
  font-size: 13px;
}

.pet-growth-points-bar .value {
  font-size: 18px;
  font-weight: 700;
  color: #1677ff;
}

.pet-growth-shop-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
}

.pet-growth-shop-grid--admin {
  grid-template-columns: repeat(auto-fill, minmax(88px, 1fr));
}

.pet-growth-shop-cell--add {
  border-style: dashed;
  border-color: rgba(22, 119, 255, 0.35);
  cursor: pointer;
  background: rgba(230, 244, 255, 0.5);
}

.pet-growth-shop-cell--add:hover {
  border-color: #1677ff;
  background: rgba(230, 244, 255, 0.85);
}

.pet-growth-shop-thumb--add {
  border: 1px dashed rgba(22, 119, 255, 0.25);
}

@media (max-width: 480px) {
  .pet-growth-shop-grid {
    grid-template-columns: repeat(3, 1fr);
  }
}

.pet-growth-shop-cell {
  position: relative;
  border-radius: 12px;
  padding: 8px 6px 6px;
  background: #fff;
  border: 2px solid transparent;
  cursor: pointer;
  text-align: center;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.pet-growth-shop-cell:hover {
  border-color: rgba(22, 119, 255, 0.35);
  box-shadow: 0 4px 12px rgba(22, 119, 255, 0.12);
}

.pet-growth-shop-cell.selected {
  border-color: #1677ff;
  box-shadow: 0 0 0 2px rgba(22, 119, 255, 0.2);
}

.pet-growth-shop-cell.disabled {
  opacity: 0.55;
  cursor: not-allowed;
}

/* 学生端：未拥有且积分不足 — 变浅 + 虚线框，与可购买区分 */
.pet-growth-shop-cell.pet-growth-shop-cell--unaffordable {
  opacity: 0.48;
  cursor: not-allowed;
  border: 2px dashed rgba(0, 0, 0, 0.14);
  background: linear-gradient(180deg, #fafafa 0%, #f3f3f3 100%);
  box-shadow: none;
}

.pet-growth-shop-cell.pet-growth-shop-cell--unaffordable:hover {
  border-color: rgba(0, 0, 0, 0.18);
  box-shadow: none;
  transform: none;
}

.pet-growth-shop-cell.pet-growth-shop-cell--unaffordable .pet-growth-shop-thumb {
  -webkit-filter: grayscale(0.35);
          filter: grayscale(0.35);
}

.pet-growth-shop-cell.pet-growth-shop-cell--unaffordable .pet-growth-shop-name,
.pet-growth-shop-cell.pet-growth-shop-cell--unaffordable .pet-growth-shop-cost {
  color: #bfbfbf;
}

.pet-growth-shop-cell--wrap {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: stretch;
  padding: 0;
  overflow: hidden;
}

.pet-growth-shop-remove {
  position: absolute;
  top: 4px;
  right: 4px;
  z-index: 4;
  width: 22px;
  height: 22px;
  margin: 0;
  padding: 0;
  line-height: 20px;
  text-align: center;
  border: none;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.42);
  color: #fff;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.12);
  transition: background 0.15s ease;
}

.pet-growth-shop-remove:hover {
  background: #ff4d4f;
  color: #fff;
}

.pet-growth-shop-cell--wrap .pet-growth-shop-cell-main {
  flex: 1;
  padding: 8px 6px 4px;
  cursor: pointer;
  text-align: center;
  border: none;
  background: transparent;
  outline: none;
}

.pet-growth-shop-cell--wrap.disabled .pet-growth-shop-cell-main {
  cursor: not-allowed;
}

.pet-growth-shop-edit-link {
  border: none;
  background: rgba(22, 119, 255, 0.08);
  color: #1677ff;
  font-size: 11px;
  padding: 4px 0;
  cursor: pointer;
  line-height: 1.2;
}

.pet-growth-shop-edit-link:hover {
  background: rgba(22, 119, 255, 0.16);
}

.pet-growth-shop-thumb {
  width: 100%;
  aspect-ratio: 1;
  border-radius: 8px;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
  margin-bottom: 6px;
}

.pet-growth-shop-thumb img {
  max-width: 100%;
  max-height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.pet-growth-shop-cost {
  font-size: 11px;
  color: #8c8c8c;
  line-height: 1.3;
}

.pet-growth-shop-name {
  font-size: 12px;
  color: #434343;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.pet-growth-shop-stage-scope {
  margin: 4px 0 2px;
  display: flex;
  justify-content: center;
  width: 100%;
}

.pet-growth-shop-stage-scope .ant-tag {
  white-space: normal;
  text-align: center;
  word-break: break-all;
}

.pet-growth-badge-owned {
  position: absolute;
  top: 4px;
  right: 4px;
  font-size: 10px;
  padding: 0 5px;
  border-radius: 4px;
  background: #52c41a;
  color: #fff;
  line-height: 18px;
}
/* 平板学生包登录页：与 ASL 桌面主题共用色板（Chrome 80 友好：无 color-mix / :has / conic-gradient） */

.asl-login-page {
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 20px 44px rgba(160, 48, 18, 0.22);

  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 24px 18px !important;
  background:
    radial-gradient(ellipse 80% 55% at 12% 10%, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 55%),
    radial-gradient(ellipse 70% 50% at 90% 85%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 58%),
    linear-gradient(148deg, var(--asl-accent-soft) 0%, var(--asl-accent) 48%, var(--asl-accent-deep) 100%) !important;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  -webkit-tap-highlight-color: transparent;
}

/* data-asl-theme 兜底（与 inline CSS 变量 / aslThemes 对齐；JS 会覆盖同名变量） */
.asl-login-page[data-asl-theme="azure"] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 20px 44px rgba(30, 64, 175, 0.2);
}

.asl-login-page[data-asl-theme="tech"] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 20px 44px rgba(14, 116, 144, 0.22);
}

.asl-login-page[data-asl-theme="emerald"] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 20px 44px rgba(4, 120, 87, 0.2);
}

.asl-login-page[data-asl-theme="violet"] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 20px 44px rgba(91, 33, 182, 0.2);
}

.asl-login-page .asl-login-card.ant-card {
  position: relative;
  width: 100% !important;
  max-width: 420px !important;
  margin: 0 auto;
  background: var(--asl-card) !important;
  border-radius: 28px !important;
  border: 1px solid rgba(255, 255, 255, 0.72) !important;
  box-shadow: var(--asl-shadow) !important;
  overflow: hidden;
  animation: asl-login-card-in 0.45s ease-out both;
}

@keyframes asl-login-card-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.asl-login-page .asl-login-card.ant-card::before {
  content: "";
  position: absolute;
  left: 18px;
  right: 18px;
  top: 0;
  height: 4px;
  border-radius: 0 0 8px 8px;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to));
  z-index: 1;
}

.asl-login-page .asl-login-card .ant-card-body {
  padding: 28px 24px 24px !important;
}

.asl-login-page .asl-login-title.ant-typography {
  color: var(--asl-ink) !important;
  font-weight: 800 !important;
  margin-bottom: 6px !important;
}

.asl-login-page .asl-login-subtitle {
  color: var(--asl-ink-soft) !important;
  font-size: 15px !important;
}

.asl-login-page .asl-login-hint {
  color: var(--asl-ink-soft) !important;
  opacity: 0.9;
}

/* —— 自管输入壳（不用 ant-input-affix，兼容 Chrome 80） —— */
.asl-login-page .asl-login-field {
  position: relative;
  margin-bottom: 18px;
}

.asl-login-page .asl-login-field .ant-form-item {
  margin-bottom: 0 !important;
}

.asl-login-page .asl-login-field__icon {
  position: absolute;
  left: 14px;
  top: 24px;
  z-index: 2;
  color: var(--asl-ink-soft);
  font-size: 16px;
  line-height: 1;
  pointer-events: none;
  transform: translateY(-50%);
}

.asl-login-page .asl-login-field--password .asl-login-field__icon {
  top: 24px;
}

.asl-login-page .asl-login-field .asl-login-field__control.ant-input,
.asl-login-page .asl-login-field .ant-input.asl-login-field__control {
  width: 100% !important;
  min-height: 48px !important;
  height: 48px !important;
  padding: 0 14px 0 42px !important;
  border-radius: 14px !important;
  border: 1px solid rgba(0, 0, 0, 0.08) !important;
  background: #fff !important;
  color: var(--asl-ink) !important;
  font-size: 16px !important;
  -webkit-user-select: text !important;
  -moz-user-select: text !important;
       user-select: text !important;
  box-shadow: none !important;
}

.asl-login-page .asl-login-field--password .asl-login-field__control.ant-input,
.asl-login-page .asl-login-field--password .ant-input.asl-login-field__control {
  padding-right: 48px !important;
}

.asl-login-page .asl-login-field .asl-login-field__control.ant-input:focus,
.asl-login-page .asl-login-field .ant-input.asl-login-field__control:focus {
  border-color: var(--asl-accent) !important;
  box-shadow: 0 0 0 2px rgba(0, 0, 0, 0.04) !important;
}

.asl-login-page .asl-login-field .ant-form-item-explain,
.asl-login-page .asl-login-field .ant-form-item-explain-error {
  padding-left: 4px;
  font-size: 12px;
}

.asl-login-page .asl-login-eye {
  position: absolute;
  right: 8px;
  top: 24px;
  z-index: 3;
  width: 40px;
  height: 40px;
  border: none;
  background: transparent;
  padding: 0;
  margin: 0;
  line-height: 1;
  color: var(--asl-ink-soft);
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transform: translateY(-50%);
  -webkit-tap-highlight-color: transparent;
}

.asl-login-page .asl-login-eye:active {
  opacity: 0.7;
}

.asl-login-page .asl-login-submit.ant-btn {
  width: 100% !important;
  height: 52px !important;
  border: none !important;
  border-radius: 999px !important;
  font-size: 17px !important;
  font-weight: 700 !important;
  color: #fff !important;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.16) !important;
}

.asl-login-page .asl-login-submit.ant-btn:hover,
.asl-login-page .asl-login-submit.ant-btn:focus {
  color: #fff !important;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  opacity: 0.96;
}

.asl-login-page .asl-login-theme-row {
  display: flex;
  justify-content: center;
  gap: 10px;
  margin-top: 18px;
  flex-wrap: wrap;
}

.asl-login-page .asl-login-theme-dot {
  width: 28px;
  height: 28px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.95);
  box-shadow: 0 3px 8px rgba(0, 0, 0, 0.16);
  cursor: pointer;
  padding: 0;
  transition: transform 0.15s ease;
}

.asl-login-page .asl-login-theme-dot--active {
  box-shadow:
    0 0 0 3px #fff,
    0 0 0 6px var(--asl-accent),
    0 4px 12px rgba(0, 0, 0, 0.18);
  transform: scale(1.08);
}

/* 横屏品牌区：默认隐藏（竖屏纯单卡居中） */
.asl-login-page .asl-login-brand {
  display: none;
}

/* —— 竖屏：居中单卡 —— */
@media (orientation: portrait) {
  .asl-login-page {
    flex-direction: column !important;
    padding: max(20px, env(safe-area-inset-top, 0px)) 18px max(20px, env(safe-area-inset-bottom, 0px)) !important;
  }

  .asl-login-page .asl-login-brand {
    display: none !important;
  }

  .asl-login-page .asl-login-card.ant-card {
    max-width: min(420px, 92vw) !important;
  }

  .asl-login-page .asl-login-card .ant-card-body {
    padding: 28px 20px 20px !important;
  }

  .asl-login-page .asl-login-title.ant-typography {
    font-size: 26px !important;
  }
}

/* —— 横屏：左品牌 + 右登录卡 —— */
@media (orientation: landscape) {
  .asl-login-page {
    flex-direction: row !important;
    align-items: center !important;
    justify-content: center !important;
    gap: 36px;
    padding: 16px 40px !important;
    padding-left: max(40px, env(safe-area-inset-left, 0px)) !important;
    padding-right: max(40px, env(safe-area-inset-right, 0px)) !important;
  }

  .asl-login-page .asl-login-brand {
    display: flex;
    flex-direction: column;
    justify-content: center;
    max-width: 360px;
    flex: 1 1 280px;
    color: #fff;
    text-shadow: 0 2px 10px rgba(0, 0, 0, 0.18);
    padding: 8px 12px;
    animation: asl-login-brand-in 0.5s ease-out both;
  }

  @keyframes asl-login-brand-in {
    from {
      opacity: 0;
      transform: translateX(-10px);
    }
    to {
      opacity: 1;
      transform: translateX(0);
    }
  }

  .asl-login-page .asl-login-brand__eyebrow {
    font-size: 13px;
    font-weight: 600;
    opacity: 0.9;
    margin-bottom: 8px;
  }

  .asl-login-page .asl-login-brand__title {
    margin: 0;
    font-size: 36px;
    line-height: 1.15;
    font-weight: 800;
    letter-spacing: 0.02em;
  }

  .asl-login-page .asl-login-brand__desc {
    margin: 12px 0 0;
    font-size: 15px;
    line-height: 1.5;
    opacity: 0.92;
    max-width: 18em;
  }

  .asl-login-page .asl-login-card.ant-card {
    flex: 0 1 400px;
    max-width: 400px !important;
    width: min(400px, 46vw) !important;
    margin: 0;
  }

  .asl-login-page .asl-login-card .ant-card-body {
    padding: 22px 22px 18px !important;
  }

  .asl-login-page .asl-login-title.ant-typography {
    font-size: 22px !important;
  }

  .asl-login-page .asl-login-submit.ant-btn {
    height: 48px !important;
  }
}

/* 矮横屏（高度有限）再压缩内边距 */
@media (orientation: landscape) and (max-height: 520px) {
  .asl-login-page {
    padding-top: 10px !important;
    padding-bottom: 10px !important;
    gap: 20px;
  }

  .asl-login-page .asl-login-brand__title {
    font-size: 28px;
  }

  .asl-login-page .asl-login-card .ant-card-body {
    padding: 16px 18px 14px !important;
  }

  .asl-login-page .asl-login-field {
    margin-bottom: 12px;
  }

  .asl-login-page .asl-login-theme-row {
    margin-top: 10px;
  }
}
.floating-logo-container {
  position: fixed !important;
  z-index: 9999 !important;
  pointer-events: none;
  /* 移除固定的 right 和 bottom，改为通过内联样式动态设置 */
  transition: none;  /* 拖拽时禁用过渡动画 */
}

.floating-logo-container .ant-float-btn {
  pointer-events: auto;
  width: 70px !important;
  height: 70px !important;
  border-radius: 50% !important;
  overflow: hidden;
  padding: 0 !important;
  position: relative !important;
}

/* 移除FloatButton内部icon容器的padding */
.floating-logo-container .ant-float-btn .ant-float-btn-icon {
  width: 100% !important;
  height: 100% !important;
  display: flex !important;
  align-items: center !important;
  justify-content: center !important;
  padding: 0 !important;
  margin: 0 !important;
}

.floating-logo-container .ant-float-btn img {
  width: 100% !important;
  height: 100% !important;
  -o-object-fit: cover !important;
     object-fit: cover !important;
  border-radius: 50% !important;
  display: block !important;
  padding: 0 !important;
  margin: 0 !important;
}

.floating-logo-menu {
  position: absolute;
  right: 0;
  bottom: calc(100% + 8px);
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 6px;
  min-width: 148px;
  padding: 8px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.98);
  box-shadow: 0 8px 24px rgba(0, 0, 0, 0.12);
  pointer-events: auto;
  animation: floating-logo-menu-in 0.15s ease-out;
}

@keyframes floating-logo-menu-in {
  from {
    opacity: 0;
    transform: translateY(6px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.floating-logo-menu-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 8px 10px;
  border: none;
  border-radius: 8px;
  background: transparent;
  color: #1a1a1a;
  font-size: 13px;
  text-align: left;
  cursor: pointer;
  white-space: nowrap;
}

.floating-logo-menu-item:hover {
  background: rgba(24, 144, 255, 0.08);
  color: #1890ff;
}

.floating-logo-menu-item-icon {
  display: flex;
  font-size: 16px;
}

.floating-logo-menu-hint {
  padding: 4px 10px 2px;
  font-size: 11px;
  color: #8c8c8c;
  text-align: center;
  border-top: 1px solid #f0f0f0;
  margin-top: 2px;
  padding-top: 8px;
}

.agent-avatar-container {
  display: inline-block;
  position: relative;
}

.agent-avatar-animated {
  animation: gentle-pulse 3s ease-in-out infinite;
}

@keyframes gentle-pulse {
  0%, 100% {
    transform: scale(1);
  }
  50% {
    transform: scale(1.02);
  }
}

.expression-overlay {
  opacity: 0;
  transition: opacity 0.3s ease;
}

.expression-overlay.expression-happy {
  background: radial-gradient(circle, rgba(255, 255, 0, 0.1) 0%, transparent 70%);
  opacity: 0.3;
}

.expression-overlay.expression-thinking {
  background: radial-gradient(circle, rgba(0, 123, 255, 0.1) 0%, transparent 70%);
  opacity: 0.2;
}

.expression-overlay.expression-sad {
  background: radial-gradient(circle, rgba(128, 128, 128, 0.1) 0%, transparent 70%);
  opacity: 0.2;
}

/* 成长宠物「雄鹰」阶段：轻微上下浮动 + 摆动，配合 GIF */
.agent-pet-fly-wrapper {
  animation: agentPetFly 2.5s ease-in-out infinite;
  transform-origin: center center;
}

@keyframes agentPetFly {
  0%,
  100% {
    transform: translateY(0) rotate(-3deg);
  }
  50% {
    transform: translateY(-14px) rotate(3deg);
  }
}

/* Teach 子组件共用 ASL 玻璃卡（依赖父级或 document 上的 --asl-*） */

.asl-teach-widget.ant-card {
  border: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.9)) !important;
  border-radius: var(--asl-radius-sm, 20px) !important;
  background: var(--asl-glass, rgba(255, 255, 255, 0.82)) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.asl-teach-widget > .ant-card-head {
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  background: transparent;
  min-height: 46px;
}

.asl-teach-widget > .ant-card-head .ant-card-head-title {
  color: var(--asl-ink, #5c3a2a);
  font-weight: 700;
}

.asl-teach-widget .ant-typography-secondary {
  color: var(--asl-ink-soft, #8a6452) !important;
}

.asl-teach-widget .ant-progress-bg {
  background: linear-gradient(90deg, var(--asl-pill-from, #ff7d4a), var(--asl-pill-to, #f24a1c)) !important;
}

.asl-teach-widget .ant-progress-circle .ant-progress-text {
  color: var(--asl-ink, #5c3a2a) !important;
  font-weight: 700;
}

.asl-teach-widget iframe,
.asl-teach-widget__frame {
  border-radius: 0 0 16px 16px;
  max-width: 100%;
  /* 高度由内容自适应，避免 iframe 内再出滚动条 */
  overflow: hidden !important;
}

.asl-teach-widget--blocks {
  background: linear-gradient(
    165deg,
    rgba(255, 255, 255, 0.92),
    rgba(239, 246, 255, 0.88)
  ) !important;
}

.asl-teach-widget--blocks > .ant-card-body {
  overflow: hidden !important;
  padding-bottom: 4px !important;
}

.asl-teach-widget--blocks .asl-teach-widget__frame {
  border-radius: 0 0 18px 18px;
  background: transparent !important;
}

/* —— 立体几何作答区：ASL 玻璃卡 —— */
.asl-teach-answer-field {
  margin-top: 12px;
  padding: 12px 14px;
  background: var(--asl-glass, rgba(255, 255, 255, 0.82));
  border: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.9));
  border-radius: var(--asl-radius-sm, 20px);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);
}

.asl-teach-answer-field .ant-typography-secondary {
  color: var(--asl-ink-soft, #8a6452) !important;
}

.asl-teach-answer-field__textarea.ant-input-textarea textarea {
  margin-bottom: 8px;
  font-family: monospace;
  border-radius: 14px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.asl-teach-answer-field .ant-btn-primary {
  border-radius: 999px !important;
  background: linear-gradient(90deg, var(--asl-pill-from, #ff7d4a), var(--asl-pill-to, #f24a1c)) !important;
  border: none !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}

/* —— 数学符号工具栏标签 —— */
.asl-teach-symbol-toolbar__label {
  font-size: 11px;
  color: var(--asl-ink-soft, #8a6452);
  margin-right: 8px;
}

/* —— 资源编辑器条目：ASL 玻璃底 —— */
.asl-teach-resource-entry {
  margin-bottom: 12px;
  padding: 8px;
  background: var(--asl-glass, rgba(255, 255, 255, 0.82));
  border: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.9));
  border-radius: var(--asl-radius-sm, 20px);
}

/* —— 校本可视化项目卡（平板横排按钮） —— */
.asl-teach-viz-project {
  width: 100%;
  box-sizing: border-box;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.04);
}

.asl-teach-viz-project__meta {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 10px;
  margin-bottom: 8px;
}

.asl-teach-viz-project__badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  font-weight: 600;
  color: var(--asl-ink-soft, #5b7a9d);
  white-space: nowrap;
}

.asl-teach-viz-project__select {
  flex: 1 1 180px;
  min-width: 160px;
  max-width: 100%;
}

.asl-teach-viz-project__title {
  display: block;
  margin-bottom: 10px !important;
  font-size: 14px !important;
  color: var(--asl-ink, #1e3a5f) !important;
}

.asl-teach-viz-project__actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.asl-teach-viz-project__btn.ant-btn {
  border-radius: 999px !important;
  height: 36px;
  font-weight: 600;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  color: var(--asl-ink, #1e3a5f) !important;
}

.asl-teach-viz-project__btn--primary.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from, #60a5fa), var(--asl-pill-to, #2563eb)) !important;
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.22);
}

.asl-teach-viz-project__hint {
  display: block;
  margin-top: 8px;
  font-size: 11px;
}

@media (max-width: 720px), (orientation: portrait) {
  .asl-teach-viz-project__actions .asl-teach-viz-project__btn.ant-btn {
    flex: 1 1 auto;
    min-width: 108px;
  }
}

/* —— 私教工具栏通用样式 —— */
.asl-teach-toolbar .ant-btn {
  border-radius: 999px !important;
  font-weight: 600;
  transition: transform 0.12s ease, background 0.15s ease;
}

.asl-teach-toolbar .ant-btn:hover {
  transform: translateY(-1px);
}

.asl-teach-toolbar .ant-select-selector {
  border-radius: 999px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.asl-teach-toolbar .ant-select-focused .ant-select-selector,
.asl-teach-toolbar .ant-select-selector:hover {
  border-color: var(--asl-accent, #ff6b3d) !important;
}

.asl-teach-toolbar .ant-typography-secondary {
  color: var(--asl-ink-soft, #8a6452) !important;
}

.asl-teach-notebook-dash__score {
  text-align: center;
}

@media (orientation: landscape) {
  .asl-teach-notebook-dash__score {
    text-align: left;
  }

  .asl-teach-widget iframe {
    min-height: 280px;
  }

  /* 横屏：作答区紧凑，工具栏按钮可小一些 */
  .asl-teach-answer-field {
    padding: 10px 14px;
  }

  .asl-teach-toolbar .ant-btn {
    height: 30px;
    padding: 0 12px;
  }

  .asl-teach-toolbar .ant-select-selector {
    height: 30px;
    line-height: 28px;
  }
}

/* 横屏矮屏（笔记本等）：极度压缩 */
@media (orientation: landscape) and (max-height: 560px) {
  .asl-teach-answer-field {
    padding: 8px 12px;
    border-radius: 14px;
  }

  .asl-teach-answer-field__textarea.ant-input-textarea textarea {
    min-height: 60px;
  }

  .asl-teach-toolbar .ant-btn {
    height: 28px;
    font-size: 12px;
  }

  .asl-teach-toolbar .ant-select-selector {
    height: 28px;
    line-height: 26px;
  }
}

@media (orientation: portrait) {
  .asl-teach-notebook-dash__stats {
    text-align: left;
  }

  .asl-teach-notebook-dash__score {
    display: flex;
    flex-direction: column;
    align-items: center;
  }

  .asl-teach-widget iframe {
    min-height: 240px;
  }

  /* 竖屏：作答区加大内边距与圆角，按钮适配拇指 */
  .asl-teach-answer-field {
    padding: 14px 16px;
    border-radius: 22px;
  }

  .asl-teach-answer-field .ant-btn-primary {
    min-height: 44px;
    font-size: 15px;
  }

  .asl-teach-answer-field__textarea.ant-input-textarea textarea {
    min-height: 120px;
    font-size: 16px; /* 防 iOS 缩放 */
  }

  /* 竖屏：符号工具栏标签字体略大 */
  .asl-teach-symbol-toolbar__label {
    font-size: 12px;
    margin-right: 6px;
  }

  /* 竖屏：资源编辑器条目增大内边距 */
  .asl-teach-resource-entry {
    padding: 10px;
    border-radius: 16px;
  }

  /* 竖屏：toolbar 按钮 / Select 放大触控区 */
  .asl-teach-toolbar .ant-btn {
    min-height: 40px;
    padding: 0 14px;
  }

  .asl-teach-toolbar .ant-select-selector {
    min-height: 40px;
    line-height: 38px;
  }
}
/* 科目私教会话面板：ASL 玻璃卡片（Chrome 80：无 color-mix / :has / conic-gradient） */

.asl-teach-panel {
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 20px 44px rgba(160, 48, 18, 0.18);
  --asl-radius: 28px;
  --asl-radius-sm: 20px;
  --asl-glass: rgba(255, 255, 255, 0.82);
  --asl-glass-border: rgba(255, 255, 255, 0.9);

  box-sizing: border-box;
  width: 100%;
  color: var(--asl-ink);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
}

.asl-teach-panel[data-asl-theme="azure"] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-card-surface: #f0f6ff;
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 20px 44px rgba(30, 64, 175, 0.16);
}

.asl-teach-panel[data-asl-theme="tech"] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-card-surface: #ecfeff;
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 20px 44px rgba(14, 116, 144, 0.16);
}

.asl-teach-panel[data-asl-theme="emerald"] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-card-surface: #ecfdf5;
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 20px 44px rgba(4, 120, 87, 0.16);
}

.asl-teach-panel[data-asl-theme="violet"] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-card-surface: #f5f3ff;
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 20px 44px rgba(91, 33, 182, 0.16);
}

.asl-teach-panel--standalone {
  max-width: none;
}

.asl-teach-panel--embedded {
  max-width: 720px;
}

.asl-teach-panel__title {
  margin-top: 0 !important;
  color: var(--asl-ink) !important;
  font-weight: 700 !important;
}

.asl-teach-panel__sub {
  color: var(--asl-ink-soft) !important;
  font-size: 13px;
}

.asl-teach-panel__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-bottom: 16px;
  padding: 10px 12px;
  background: var(--asl-glass);
  border: 1px solid var(--asl-glass-border);
  border-radius: var(--asl-radius-sm);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.05);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
  position: -webkit-sticky;
  position: sticky;
  top: 8px;
  z-index: 6;
}

.asl-teach-panel__actions .ant-select {
  min-width: 140px;
  flex: 0 1 auto;
}

.asl-teach-panel__actions .ant-select-selector {
  border-radius: 999px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.asl-teach-panel__btn.ant-btn {
  border-radius: 999px !important;
  height: 36px;
  font-weight: 600;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.75) !important;
  color: var(--asl-ink) !important;
  transition: transform 0.12s ease, background 0.15s ease;
}

.asl-teach-panel__btn.ant-btn:hover {
  transform: translateY(-1px);
  border-color: var(--asl-accent) !important;
  color: var(--asl-accent-deep) !important;
}

.asl-teach-panel__btn--primary.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

.asl-teach-panel__btn--primary.ant-btn-primary:hover {
  color: #fff !important;
}

.asl-teach-panel__card.ant-card {
  border: 1px solid var(--asl-glass-border) !important;
  border-radius: var(--asl-radius-sm) !important;
  background: var(--asl-glass) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.asl-teach-panel__card + .asl-teach-panel__card,
.asl-teach-panel__card.asl-teach-panel__card--spaced {
  margin-top: 12px;
}

.asl-teach-panel__card > .ant-card-head {
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  background: transparent;
  min-height: 46px;
}

.asl-teach-panel__card > .ant-card-head .ant-card-head-title {
  color: var(--asl-ink);
  font-weight: 700;
}

.asl-teach-panel__card .ant-typography-secondary {
  color: var(--asl-ink-soft) !important;
}

.asl-teach-panel__alert.ant-alert {
  margin-bottom: 16px;
  border-radius: var(--asl-radius-sm) !important;
  border: 1px solid var(--asl-glass-border);
  background: rgba(255, 255, 255, 0.72);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.asl-teach-panel__alert.ant-alert-info {
  border-color: rgba(59, 130, 246, 0.25);
}

.asl-teach-panel__alert.ant-alert-warning {
  border-color: rgba(245, 158, 11, 0.3);
}

.asl-teach-panel__mission .ant-input,
.asl-teach-panel__mission textarea.ant-input {
  border-radius: 14px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.9) !important;
}

.asl-teach-panel__spin {
  display: flex;
  justify-content: center;
  padding: 28px 0;
}

.asl-teach-panel__empty {
  color: var(--asl-ink-soft) !important;
  padding: 8px 2px;
}

/* —— 私教工具栏在面板内的间距与玻璃感 —— */
.asl-teach-panel .asl-teach-toolbar {
  margin-bottom: 12px;
  padding: 10px 12px;
  background: var(--asl-glass);
  border: 1px solid var(--asl-glass-border);
  border-radius: var(--asl-radius-sm);
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.04);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.asl-teach-panel .asl-teach-toolbar .ant-btn {
  border-radius: 999px !important;
  height: 32px;
  font-weight: 600;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.78) !important;
  color: var(--asl-ink) !important;
  transition: transform 0.12s ease, background 0.15s ease;
}

.asl-teach-panel .asl-teach-toolbar .ant-btn:hover {
  transform: translateY(-1px);
  border-color: var(--asl-accent) !important;
  color: var(--asl-accent-deep) !important;
}

.asl-teach-panel .asl-teach-toolbar .ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
}

.asl-teach-panel .asl-teach-toolbar .ant-btn-primary:hover {
  color: #fff !important;
}

.asl-teach-panel .asl-teach-toolbar .ant-select-selector {
  border-radius: 999px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.asl-teach-panel .asl-teach-answer-field {
  margin-bottom: 8px;
}

@media (orientation: landscape) {
  .asl-teach-panel--standalone .asl-teach-panel__actions {
    top: 10px;
  }

  .asl-teach-panel__card > .ant-card-body {
    padding: 14px 16px;
  }
}

@media (orientation: portrait) {
  /* 竖屏手机：操作条可贴底；ASL/平板独立页禁止贴底，避免底部只剩「数学」Select 挡滑动 */
  .asl-teach-panel--standalone:not(.asl-teach-panel--asl) {
    padding-bottom: 72px;
  }

  .asl-teach-panel--standalone:not(.asl-teach-panel--asl) .asl-teach-panel__actions {
    position: fixed;
    left: 12px;
    right: 12px;
    bottom: calc(12px + env(safe-area-inset-bottom, 0px));
    top: auto;
    margin-bottom: 0;
    border-radius: 22px;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.14);
    justify-content: stretch;
  }

  .asl-teach-panel--standalone:not(.asl-teach-panel--asl) .asl-teach-panel__actions .ant-select {
    flex: 1 1 100%;
    min-width: 0;
    width: 100%;
  }

  .asl-teach-panel--standalone:not(.asl-teach-panel--asl) .asl-teach-panel__actions .ant-select-selector {
    width: 100% !important;
  }

  .asl-teach-panel--standalone:not(.asl-teach-panel--asl) .asl-teach-panel__btn.ant-btn {
    flex: 1 1 calc(50% - 8px);
    min-height: 44px;
  }

  .asl-teach-panel--standalone.asl-teach-panel--asl {
    padding-bottom: 28px;
  }

  .asl-teach-panel--standalone.asl-teach-panel--asl .asl-teach-panel__actions {
    position: -webkit-sticky;
    position: sticky;
    top: 8px;
    bottom: auto;
    left: auto;
    right: auto;
    margin-bottom: 12px;
    border-radius: 16px;
    box-shadow: 0 8px 22px rgba(0, 0, 0, 0.06);
  }

  .asl-teach-panel--standalone.asl-teach-panel--asl .asl-teach-panel__btn.ant-btn {
    flex: 1 1 calc(50% - 8px);
    min-height: 44px;
  }

  .asl-teach-panel__actions {
    border-radius: 22px;
  }

  .asl-teach-panel__btn.ant-btn {
    min-height: 40px;
  }

  .asl-teach-panel__alert.ant-alert {
    padding: 10px 12px;
  }

  .asl-teach-panel__card + .asl-teach-panel__card,
  .asl-teach-panel__card.asl-teach-panel__card--spaced {
    margin-top: 10px;
  }

  /* 竖屏：面板内 toolbar 玻璃包裹加大，按钮适配拇指 */
  .asl-teach-panel .asl-teach-toolbar {
    padding: 12px 14px;
    border-radius: 22px;
    margin-bottom: 14px;
  }

  .asl-teach-panel .asl-teach-toolbar .ant-btn {
    height: auto;
    min-height: 42px;
    padding: 0 16px;
    font-size: 14px;
  }

  .asl-teach-panel .asl-teach-toolbar .ant-select-selector {
    min-height: 42px;
    line-height: 40px;
    font-size: 14px;
  }

  /* 竖屏：面板内作答区底部留出更多空间避免被贴底操作条遮挡 */
  .asl-teach-panel--standalone .asl-teach-answer-field {
    margin-bottom: 16px;
  }

  .asl-teach-panel--standalone .asl-teach-answer-field .ant-btn-primary {
    min-height: 44px;
    font-size: 15px;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  .asl-teach-panel__actions {
    padding: 8px 10px;
    margin-bottom: 10px;
  }

  .asl-teach-panel__btn.ant-btn {
    height: 32px;
  }

  /* 矮屏：toolbar 紧凑 */
  .asl-teach-panel .asl-teach-toolbar {
    padding: 6px 10px;
    margin-bottom: 8px;
  }

  .asl-teach-panel .asl-teach-toolbar .ant-btn {
    height: 28px;
    font-size: 12px;
    padding: 0 10px;
  }

  .asl-teach-panel .asl-teach-toolbar .ant-select-selector {
    height: 28px;
    line-height: 26px;
  }
}

/* 辅导进行中：自定义步骤条（完成绿 / 当前蓝 / 箭头） */
.asl-teach-session-progress {
  margin-top: 10px;
  margin-bottom: 10px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(145deg, #e8f3ff 0%, #eef7ff 55%, #f5faff 100%);
  border: 1px solid #91caff;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.08);
}

.asl-teach-session-progress--done {
  background: linear-gradient(145deg, #f6ffed 0%, #f0fff4 100%);
  border-color: #b7eb8f;
}

.asl-teach-session-progress__hint {
  font-size: 11px !important;
  margin: 8px 0 0 !important;
  line-height: 1.4 !important;
}

.asl-teach-director {
  margin-bottom: 10px;
}

.asl-teach-director__row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  flex-wrap: wrap;
}

.asl-teach-director__beats {
  display: flex;
  align-items: center;
  gap: 6px;
}

.asl-teach-director__beat {
  min-width: 36px;
  height: 28px;
  padding: 0 10px;
  border-radius: 999px;
  border: 1px solid #91caff;
  background: #fff;
  color: #1d4ed8;
  font-size: 13px;
  font-weight: 700;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.asl-teach-director__beat--active {
  background: linear-gradient(135deg, #2563eb, #1d4ed8);
  color: #fff;
  border-color: #1d4ed8;
}

.asl-teach-director__beat--done {
  background: #dbeafe;
  color: #1e40af;
}

.asl-teach-director__beat--pending {
  opacity: 0.55;
}

.asl-teach-director__auto {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 12px;
  color: #475569;
  margin: 0;
  cursor: pointer;
}

.asl-teach-director__hint {
  width: 100%;
  font-size: 12px !important;
  color: #475569 !important;
  margin: 6px 0 0 !important;
  line-height: 1.4 !important;
}

.asl-teach-step-strip {
  display: flex;
  flex-direction: row;
  align-items: center;
  flex-wrap: nowrap;
  gap: 4px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  width: 100%;
  padding: 2px 0 6px;
  margin-bottom: 2px;
}

.asl-teach-step-strip__arrow {
  flex-shrink: 0;
  font-size: 10px;
  color: #94a3b8;
  margin: 0 1px;
}

.asl-teach-step-strip__arrow--done {
  color: #34d399;
}

.asl-teach-step-chip {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 48px;
  flex: 1 1 auto;
  padding: 8px 6px 6px;
  border-radius: 14px;
  border: 1.5px solid rgba(15, 23, 42, 0.08);
  background: rgba(255, 255, 255, 0.72);
  box-sizing: border-box;
}

.asl-teach-step-chip__num {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  border-radius: 999px;
  font-size: 12px;
  font-weight: 800;
  line-height: 1;
  color: #64748b;
  background: rgba(148, 163, 184, 0.18);
}

.asl-teach-step-chip__label {
  font-size: 10px;
  line-height: 1.2;
  color: #64748b;
  white-space: nowrap;
}

.asl-teach-step-chip--active {
  border-color: #3b82f6;
  background: linear-gradient(135deg, #60a5fa 0%, #2563eb 100%);
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.28);
  transform: translateY(-1px);
}

.asl-teach-step-chip--active .asl-teach-step-chip__num {
  color: #fff;
  background: rgba(255, 255, 255, 0.22);
}

.asl-teach-step-chip--active .asl-teach-step-chip__label {
  color: rgba(255, 255, 255, 0.95);
  font-weight: 700;
}

.asl-teach-step-chip--done {
  border-color: rgba(16, 185, 129, 0.35);
  background: rgba(16, 185, 129, 0.1);
}

.asl-teach-step-chip--done .asl-teach-step-chip__num {
  color: #fff;
  background: #10b981;
  font-size: 11px;
}

.asl-teach-step-chip--done .asl-teach-step-chip__label {
  color: #059669;
  font-weight: 600;
}

.asl-teach-step-chip--pending {
  opacity: 0.55;
}

/* 平板聚焦：紧凑圆点 + 当前步大标题 */
.asl-teach-focus-hero {
  margin-bottom: 8px;
}

.asl-teach-focus-hero__meta {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 4px;
}

.asl-teach-focus-hero__micro {
  font-size: 12px !important;
}

.asl-teach-focus-hero__step {
  display: block;
  font-size: 12px !important;
  color: #2563eb !important;
  font-weight: 700 !important;
}

.asl-teach-focus-hero__title {
  display: block !important;
  font-size: 22px !important;
  line-height: 1.25 !important;
  color: #0f172a !important;
  margin: 2px 0 8px !important;
}

.asl-teach-focus-hero__bar {
  margin-bottom: 8px !important;
}

.asl-teach-step-strip--compact .asl-teach-step-chip {
  min-width: 28px;
  padding: 6px 4px;
  flex: 0 0 auto;
}

.asl-teach-step-strip--compact .asl-teach-step-chip--active {
  min-width: 64px;
  padding: 8px 10px;
}

.asl-teach-session--focus .asl-teach-session-step-body {
  margin-top: 4px;
  padding: 12px 14px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(15, 23, 42, 0.06);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.asl-teach-step-toggle,
.asl-teach-step-toggle.ant-btn {
  margin-left: auto !important;
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
       appearance: none !important;
  height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 700 !important;
  color: #1d4ed8 !important;
  background: #ffffff !important;
  border: 1px solid rgba(37, 99, 235, 0.28) !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.1) !important;
}

.asl-teach-learn-trio {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid rgba(37, 99, 235, 0.14);
}

.asl-teach-learn-trio__label {
  display: block;
  font-size: 12px;
  margin-bottom: 8px;
}

.asl-teach-learn-trio__btn,
.asl-teach-learn-trio__btn.ant-btn {
  border-radius: 999px !important;
  font-size: 12px !important;
  font-weight: 600 !important;
}

/* 可视化推荐条（替代 Alert） */
.asl-teach-viz-bar {
  margin-top: 10px;
  padding: 10px 12px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.16);
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.06);
}

.asl-teach-viz-bar__row {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-bottom: 8px;
}

.asl-teach-viz-bar__copy {
  flex: 1 1 180px;
  min-width: 0;
}

.asl-teach-viz-bar__badge {
  display: inline-block;
  margin-bottom: 4px;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 700;
  color: #fff;
  background: #2563eb;
}

.asl-teach-viz-bar__title {
  display: block !important;
  font-size: 14px !important;
  color: #0f172a !important;
  margin-bottom: 2px !important;
}

.asl-teach-viz-bar__desc {
  display: block !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

.asl-teach-viz-bar__btn,
.asl-teach-viz-bar__btn.ant-btn {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
       appearance: none !important;
  flex-shrink: 0;
  height: 36px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  border: none !important;
}

.asl-teach-viz-bar__btn--primary,
.asl-teach-viz-bar__btn--primary.ant-btn-primary {
  color: #fff !important;
  background: #2563eb !important;
  background: linear-gradient(90deg, #60a5fa, #2563eb) !important;
  box-shadow: 0 6px 14px rgba(37, 99, 235, 0.25) !important;
}

.asl-teach-viz-toggle,
.asl-teach-viz-toggle.ant-btn {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
       appearance: none !important;
  height: 40px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  color: #1e3a5f !important;
  background: #f8fafc !important;
  border: 1px solid rgba(15, 23, 42, 0.1) !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.04) !important;
}

.asl-teach-viz-toggle--open,
.asl-teach-viz-toggle--open.ant-btn {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  border-color: rgba(37, 99, 235, 0.28) !important;
}

.asl-teach-narrative-tools {
  margin-bottom: 12px;
  padding: 10px 12px;
  background: #f6f3ee;
  border-radius: 8px;
  border: 1px solid #d4c4a8;
}

.asl-teach-recog {
  margin-bottom: 8px;
}

.asl-teach-answer-box textarea.ant-input {
  min-height: 64px !important;
  max-height: 160px !important;
}

.asl-teach-recog__toggle.ant-btn {
  padding-inline: 0 !important;
  height: auto !important;
  font-size: 12px !important;
}

.asl-teach-panel__records-collapse {
  margin-top: 12px;
}

.asl-teach-panel__records-collapse .ant-collapse-header {
  padding-inline: 4px !important;
  font-weight: 600;
}

.asl-teach-interactive-viz {
  margin-bottom: 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background:
    radial-gradient(ellipse 70% 80% at 0% 0%, rgba(255, 255, 255, 0.65) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(145deg, #eff6ff 0%, #f0f9ff 55%, #e0f2fe 100%);
  border: 1px solid rgba(125, 211, 252, 0.55);
  box-shadow: 0 10px 24px rgba(14, 165, 233, 0.08);
}

.asl-teach-interactive-viz__head {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 12px;
  margin-bottom: 10px;
}

.asl-teach-interactive-viz__title {
  font-size: 14px !important;
  color: var(--asl-ink) !important;
  flex-shrink: 0;
}

.asl-teach-interactive-viz__segmented.ant-segmented {
  flex-shrink: 0;
  padding: 3px;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.85) !important;
}

.asl-teach-interactive-viz__segmented .ant-segmented-item {
  border-radius: 999px !important;
  min-height: 32px;
  font-weight: 600;
}

.asl-teach-interactive-viz__segmented .ant-segmented-item-selected {
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  color: #fff !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.2);
}

.asl-teach-interactive-viz__desc {
  flex: 1 1 140px;
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.4 !important;
}

.asl-teach-interactive-viz__body {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 8px;
  width: 100%;
}

.asl-teach-interactive-viz__body > * {
  width: 100%;
}

@media (max-width: 720px), (orientation: portrait) {
  .asl-teach-session-actions__btn,
  .asl-teach-session-actions__btn.ant-btn {
    flex: 1 1 calc(33.33% - 8px);
    min-width: 96px;
    text-align: center;
  }
}

/* 流式本步输出：嵌在辅导进行中卡片内、紧贴操作钮 */
.asl-teach-session-progress .asl-teach-stream-panel {
  margin: 10px 0 0;
}

.asl-teach-stream-panel {
  margin: 0 0 12px;
  padding: 12px 14px;
  border-radius: 14px;
  background: #ffffff;
  border: 1px solid rgba(37, 99, 235, 0.18);
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.08);
}

.asl-teach-stream-panel--loading {
  border-style: dashed;
}

.asl-teach-stream-panel__head {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 8px;
}

.asl-teach-stream-panel__heading {
  font-size: 13px !important;
  color: #1d4ed8 !important;
}

.asl-teach-stream-panel__placeholder {
  font-size: 13px !important;
}

.asl-teach-stream-panel__label {
  display: block !important;
  margin-bottom: 6px !important;
  font-size: 13px !important;
  color: #1e3a5f !important;
}

.asl-teach-stream-panel__text {
  white-space: pre-wrap !important;
  font-size: 14px !important;
  line-height: 1.7 !important;
  margin-bottom: 0 !important;
  color: #0f172a !important;
}

.asl-teach-stream-panel__cites {
  margin-top: 10px;
}

.asl-teach-stream-panel__wiki.ant-btn {
  padding-left: 0 !important;
  margin-top: 4px;
}

/* 流式本步 / 生成并推进 / 推进一步（紧贴七步下方；Chrome80 回退色） */
.asl-teach-session-progress .asl-teach-session-actions {
  margin: 8px 0 0;
}

.asl-teach-session-actions {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin: 4px 0 12px;
  padding: 10px 12px;
  border-radius: 16px;
  background: #ffffff;
  border: 1px solid rgba(15, 23, 42, 0.08);
  box-shadow: 0 6px 16px rgba(15, 23, 42, 0.06);
}

.asl-teach-session-actions__btn,
.asl-teach-session-actions__btn.ant-btn {
  -webkit-appearance: none !important;
  -moz-appearance: none !important;
       appearance: none !important;
  border-radius: 999px !important;
  height: 40px !important;
  min-height: 40px !important;
  padding: 0 16px !important;
  font-weight: 700 !important;
  font-size: 13px !important;
  line-height: 38px !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  background: #ffffff !important;
  color: #1e3a5f !important;
  box-shadow: 0 2px 8px rgba(15, 23, 42, 0.06) !important;
  cursor: pointer;
}

.asl-teach-session-actions__btn:hover,
.asl-teach-session-actions__btn.ant-btn:hover {
  transform: translateY(-1px);
  border-color: #3b82f6 !important;
  color: #1d4ed8 !important;
}

.asl-teach-session-actions__btn--primary,
.asl-teach-session-actions__btn--primary.ant-btn,
.asl-teach-session-actions__btn--primary.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: #2563eb !important;
  background: linear-gradient(90deg, #60a5fa, #2563eb) !important;
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.28) !important;
}

.asl-teach-session-actions__btn--primary:hover,
.asl-teach-session-actions__btn--primary.ant-btn-primary:hover {
  color: #fff !important;
}

.asl-teach-session-actions__btn--accent,
.asl-teach-session-actions__btn--accent.ant-btn {
  border: none !important;
  color: #fff !important;
  background: #3b82f6 !important;
  background: linear-gradient(90deg, #60a5fa, #3b82f6) !important;
  box-shadow: 0 6px 14px rgba(59, 130, 246, 0.25) !important;
}

.asl-teach-session-actions__btn--accent:hover,
.asl-teach-session-actions__btn--accent.ant-btn:hover {
  color: #fff !important;
}

.asl-teach-session-actions__btn--next,
.asl-teach-session-actions__btn--next.ant-btn {
  color: #1d4ed8 !important;
  background: #eff6ff !important;
  border: 1px solid rgba(37, 99, 235, 0.35) !important;
  box-shadow: 0 2px 8px rgba(37, 99, 235, 0.1) !important;
}

.asl-teach-session-actions__btn--next:hover,
.asl-teach-session-actions__btn--next.ant-btn:hover {
  color: #fff !important;
  background: #2563eb !important;
  border-color: #2563eb !important;
}

.asl-teach-session-actions__btn--back,
.asl-teach-session-actions__btn--back.ant-btn {
  color: #475569 !important;
  background: #f8fafc !important;
  border: 1px solid rgba(15, 23, 42, 0.12) !important;
  border-style: solid !important;
}

.asl-teach-session-actions__btn--back:hover,
.asl-teach-session-actions__btn--back.ant-btn:hover {
  color: #1e3a5f !important;
  border-color: #94a3b8 !important;
}

.asl-teach-session-actions__btn--ghost,
.asl-teach-session-actions__btn--ghost.ant-btn {
  background: #f8fafc !important;
  border-style: solid !important;
}

/* 进度卡内操作钮同一行尽量均分 */
.asl-teach-session-progress .asl-teach-session-actions {
  justify-content: flex-start;
}

.asl-teach-session--compact .asl-teach-session-actions__btn,
.asl-teach-session--compact .asl-teach-session-actions__btn.ant-btn {
  flex: 1 1 calc(50% - 8px);
  min-width: 120px;
  text-align: center;
}

/* 学情档案时间线卡 */
.asl-teach-records {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.asl-teach-records--empty {
  padding: 16px 12px;
  text-align: center;
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.55);
  border: 1px dashed rgba(0, 0, 0, 0.08);
}

.asl-teach-records__item {
  display: flex;
  gap: 10px;
  padding: 12px 12px 12px 8px;
  border-radius: 16px;
  background: rgba(255, 255, 255, 0.88);
  border: 1px solid rgba(0, 0, 0, 0.05);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.04);
}

.asl-teach-records__item--latest {
  border-color: rgba(59, 130, 246, 0.28);
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.08);
}

.asl-teach-records__rail {
  position: relative;
  width: 14px;
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
}

.asl-teach-records__dot {
  width: 10px;
  height: 10px;
  margin-top: 4px;
  border-radius: 50%;
  background: var(--asl-accent);
  box-shadow: 0 0 0 3px rgba(59, 130, 246, 0.15);
}

.asl-teach-records__item--latest .asl-teach-records__dot {
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to));
}

.asl-teach-records__line {
  flex: 1;
  width: 2px;
  margin-top: 4px;
  background: rgba(0, 0, 0, 0.06);
  min-height: 24px;
}

.asl-teach-records__body {
  flex: 1;
  min-width: 0;
}

.asl-teach-records__head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
  margin-bottom: 2px;
}

.asl-teach-records__id {
  font-size: 12px !important;
  color: var(--asl-accent-deep) !important;
}

.asl-teach-records__tag {
  display: inline-block;
  padding: 0 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
  line-height: 20px;
  color: var(--asl-ink-soft);
  background: rgba(0, 0, 0, 0.04);
}

.asl-teach-records__title {
  display: block;
  font-size: 13px !important;
  font-weight: 700 !important;
  color: var(--asl-ink) !important;
  margin-bottom: 2px;
}

.asl-teach-records__excerpt {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

/* ====== 辅导进行中小部件：7 步进度条 + 操作按钮 ====== */
.asl-session-widget {
  padding: 2px 0;
}

/* —— 步骤进度条（横向） —— */
.asl-session-widget__steps {
  margin-bottom: 14px;
}

.asl-session-widget__steps-label {
  display: block;
  font-size: 12px;
  font-weight: 600;
  color: var(--asl-ink-soft);
  margin-bottom: 8px;
}

.asl-session-widget__steps-row {
  display: flex;
  flex-direction: row;
  gap: 6px;
  align-items: stretch;
  flex-wrap: nowrap;
  overflow-x: auto;
  padding-bottom: 4px;
}

.asl-session-widget__step-badge {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  min-width: 52px;
  flex: 1 1 auto;
  padding: 8px 6px 6px;
  border-radius: 14px;
  border: 1.5px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.55);
  transition: all 0.18s ease;
  cursor: default;
  position: relative;
}

.asl-session-widget__step-num {
  font-size: 15px;
  font-weight: 700;
  line-height: 1;
  color: var(--asl-ink-soft);
  transition: color 0.15s;
}

.asl-session-widget__step-label {
  font-size: 10px;
  line-height: 1.2;
  color: var(--asl-ink-soft);
  white-space: nowrap;
}

/* 当前步 */
.asl-session-widget__step-badge--active {
  border-color: var(--asl-accent);
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to));
  box-shadow: 0 4px 14px var(--asl-glow);
  transform: translateY(-2px);
}

.asl-session-widget__step-badge--active .asl-session-widget__step-num {
  color: #fff;
}

.asl-session-widget__step-badge--active .asl-session-widget__step-label {
  color: rgba(255, 255, 255, 0.9);
}

/* 已完成步 */
.asl-session-widget__step-badge--done {
  border-color: rgba(16, 185, 129, 0.3);
  background: rgba(16, 185, 129, 0.08);
}

.asl-session-widget__step-badge--done .asl-session-widget__step-num {
  color: #10b981;
}

.asl-session-widget__step-badge--done .asl-session-widget__step-label {
  color: rgba(16, 185, 129, 0.7);
}

/* 未来步 */
.asl-session-widget__step-badge--pending {
  opacity: 0.5;
}

/* —— 操作按钮 —— */
.asl-session-widget__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
  margin-top: 4px;
}

.asl-session-widget__btn.ant-btn {
  border-radius: 999px !important;
  height: 34px;
  font-weight: 600;
  font-size: 13px;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.75) !important;
  color: var(--asl-ink) !important;
  transition: transform 0.12s ease, background 0.15s ease, box-shadow 0.15s ease;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.asl-session-widget__btn.ant-btn:hover {
  transform: translateY(-1px);
  border-color: var(--asl-accent) !important;
  color: var(--asl-accent-deep) !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.08);
}

.asl-session-widget__btn--primary.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 6px 16px var(--asl-glow);
}

.asl-session-widget__btn--primary.ant-btn-primary:hover {
  color: #fff !important;
  box-shadow: 0 8px 22px var(--asl-glow);
}

.asl-session-widget__btn--accent.ant-btn {
  border-color: var(--asl-accent) !important;
  color: var(--asl-accent-deep) !important;
  background: rgba(255, 255, 255, 0.82) !important;
}

.asl-session-widget__btn--accent.ant-btn:hover {
  background: var(--asl-accent) !important;
  color: #fff !important;
  border-color: var(--asl-accent) !important;
}

/* ====== 学情档案列表（时间线风格） ====== */
.asl-records-widget {
  padding: 2px 0;
}

.asl-records-widget__empty {
  padding: 12px 8px;
  text-align: center;
}

.asl-records-widget__item.ant-list-item {
  padding: 6px 0 !important;
  border-bottom: none !important;
}

.asl-records-widget__item-inner {
  display: flex;
  flex-direction: row;
  gap: 12px;
  align-items: flex-start;
  width: 100%;
}

.asl-records-widget__dot {
  display: flex;
  flex-direction: column;
  align-items: center;
  flex-shrink: 0;
  width: 20px;
  padding-top: 4px;
}

.asl-records-widget__dot-core {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  background: rgba(0, 0, 0, 0.12);
  border: 2px solid rgba(0, 0, 0, 0.06);
  transition: all 0.2s ease;
}

.asl-records-widget__dot-core--latest {
  width: 12px;
  height: 12px;
  background: var(--asl-accent);
  border-color: var(--asl-accent-soft);
  box-shadow: 0 0 8px var(--asl-glow);
}

.asl-records-widget__dot-line {
  width: 2px;
  flex: 1;
  min-height: 18px;
  background: rgba(0, 0, 0, 0.06);
  margin-top: 4px;
}

.asl-records-widget__content {
  flex: 1;
  min-width: 0;
  padding: 4px 10px 8px;
  background: rgba(255, 255, 255, 0.6);
  border-radius: 12px;
  border: 1px solid rgba(0, 0, 0, 0.04);
  transition: background 0.15s ease, border-color 0.15s ease;
}

.asl-records-widget__content:hover {
  background: rgba(255, 255, 255, 0.85);
  border-color: rgba(0, 0, 0, 0.08);
}

.asl-records-widget__header {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 4px;
}

.asl-records-widget__tag.ant-tag {
  font-size: 10px;
  line-height: 18px;
  padding: 0 6px;
  border-radius: 8px;
  margin: 0;
  border: 1px solid rgba(0, 0, 0, 0.08);
  background: rgba(255, 255, 255, 0.7);
}

.asl-records-widget__tag--score.ant-tag {
  font-weight: 700;
}

.asl-records-widget__tag--status.ant-tag {
  font-style: italic;
}

/* —— 竖屏适配 —— */
@media (orientation: portrait) {
  .asl-session-widget__steps-row {
    gap: 4px;
  }

  .asl-session-widget__step-badge {
    min-width: 44px;
    padding: 6px 4px 4px;
    border-radius: 12px;
  }

  .asl-session-widget__step-num {
    font-size: 13px;
  }

  .asl-session-widget__step-label {
    font-size: 9px;
  }

  .asl-session-widget__actions {
    gap: 6px;
  }

  .asl-session-widget__btn.ant-btn {
    height: 38px;
    font-size: 14px;
    padding: 0 14px;
  }
}

/* —— 矮屏适配 —— */
@media (orientation: landscape) and (max-height: 560px) {
  .asl-session-widget__steps-row {
    gap: 3px;
  }

  .asl-session-widget__step-badge {
    min-width: 38px;
    padding: 4px 3px 3px;
    border-radius: 10px;
  }

  .asl-session-widget__step-num {
    font-size: 12px;
  }

  .asl-session-widget__step-label {
    font-size: 8px;
  }

  .asl-session-widget__btn.ant-btn {
    height: 28px;
    font-size: 11px;
  }
}
.voice-session-panel {
  position: relative;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 10px;
  padding: 16px 14px 14px;
  border-radius: 22px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid rgba(0, 0, 0, 0.06);
  box-shadow: 0 10px 28px rgba(40, 24, 12, 0.08);
  overflow: hidden;
}

.voice-session-panel__pulse {
  position: absolute;
  width: 120px;
  height: 120px;
  border-radius: 50%;
  top: -36px;
  right: -28px;
  opacity: 0.35;
  pointer-events: none;
  background: radial-gradient(circle, var(--asl-glow, rgba(255, 180, 90, 0.55)) 0%, transparent 70%);
  transform: scale(0.85);
  animation: voice-session-breathe 2.4s ease-in-out infinite;
}

.voice-session-panel--listening .voice-session-panel__pulse {
  animation-duration: 1.4s;
  opacity: 0.55;
}

.voice-session-panel--processing .voice-session-panel__pulse {
  animation-duration: 2s;
}

.voice-session-panel--speaking .voice-session-panel__pulse {
  animation-duration: 1.1s;
  opacity: 0.5;
}

@keyframes voice-session-breathe {
  0%,
  100% {
    transform: scale(0.82);
    opacity: 0.28;
  }
  50% {
    transform: scale(1.08);
    opacity: 0.55;
  }
}

.voice-session-panel__label {
  position: relative;
  z-index: 1;
  font-size: 18px;
  font-weight: 700;
  color: var(--asl-ink, #3a2a1a);
  letter-spacing: 0.02em;
}

.voice-session-panel__wave {
  position: relative;
  z-index: 1;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 3px;
  height: 36px;
  width: min(100%, 220px);
  padding: 4px 10px;
  border-radius: 12px;
  background: linear-gradient(90deg, rgba(107, 78, 255, 0.08), rgba(255, 140, 66, 0.1));
}

.voice-session-panel__wave-bar {
  width: 5px;
  border-radius: 3px;
  background: linear-gradient(180deg, #7c5cff 0%, #ff8c42 100%);
  transition: height 70ms ease-out, opacity 120ms ease-out;
}

.voice-session-panel__partial {
  position: relative;
  z-index: 1;
  max-width: 100%;
  font-size: 15px;
  line-height: 1.45;
  color: var(--asl-ink-2, #5a4636);
  text-align: center;
  word-break: break-word;
}

.voice-session-panel__hint {
  position: relative;
  z-index: 1;
  font-size: 13px;
  color: var(--asl-ink-3, #7a6554);
  text-align: center;
  line-height: 1.4;
}

.voice-session-panel__actions {
  position: relative;
  z-index: 1;
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  width: 100%;
  margin-top: 4px;
}

.voice-session-panel__btn {
  min-height: 48px;
  min-width: 120px;
  padding: 10px 18px;
  border-radius: 999px;
  border: none;
  font-size: 16px;
  font-weight: 600;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

.voice-session-panel__btn--primary {
  background: var(--asl-accent, #ff8c42);
  color: #fff;
  box-shadow: 0 6px 16px rgba(255, 140, 66, 0.28);
}

.voice-session-panel__btn--hangup {
  background: rgba(0, 0, 0, 0.06);
  color: var(--asl-ink, #3a2a1a);
}

.voice-session-panel__btn:active {
  transform: scale(0.98);
}
.conversational-interface {
  height: 100%;
  display: flex;
  flex-direction: column;
}

.conversational-interface.ant-card {
  height: 100%;
  display: flex;
  flex-direction: column;
  background: transparent;
}

.conversational-interface > .ant-card-body {
  flex: 1;
  display: flex;
  flex-direction: column;
  min-height: 0;
  padding: 0;
}

.messages-container {
  flex: 1 1 auto;
  min-height: 0;
  overflow-y: auto;
  padding: 16px;
  max-height: none;
  -webkit-user-select: text;
     -moz-user-select: text;
          user-select: text;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-y;
  overscroll-behavior: contain;
}

.input-container {
  flex: 0 0 auto;
  padding: 12px 16px;
  border-top: 1px solid #f0f0f0;
  position: relative;
  bottom: auto;
  background: #fff;
  z-index: 100;
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}

.messages-container {
  padding-bottom: 12px;
}

/* —— 嵌入 FloatingAgent：ASL 对话窗 —— */
.conversational-interface--embedded.ant-card {
  border: none !important;
  box-shadow: none !important;
  background: transparent !important;
  border-radius: 0 !important;
}

.conversational-interface--embedded > .ant-card-head {
  min-height: 44px;
  padding: 8px 14px !important;
  border-bottom: 1px solid rgba(0, 0, 0, 0.05);
  background: rgba(255, 255, 255, 0.55);
}

.conversational-interface--embedded > .ant-card-head .ant-card-head-title {
  padding: 0 !important;
  overflow: visible;
}

.conversational-interface--embedded > .ant-card-body {
  padding: 0 !important;
  background:
    radial-gradient(
      ellipse 70% 45% at 100% 0%,
      var(--asl-glow, rgba(255, 200, 90, 0.14)) 0%,
      rgba(255, 255, 255, 0) 55%
    ),
    linear-gradient(180deg, var(--asl-card-surface, #fff7f1) 0%, #ffffff 72%);
}

.ci-embedded-toolbar {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  width: 100%;
}

.ci-embedded-days {
  font-size: 12px;
  font-weight: 700;
  color: var(--asl-ink-soft, #8a6452);
}

.ci-history-btn.ant-btn {
  height: 30px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-weight: 700;
  color: var(--asl-ink-soft, #8a6452) !important;
  background: rgba(255, 255, 255, 0.9) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.04);
}

.conversational-interface--embedded .messages-container {
  padding: 12px 14px 8px;
  background: transparent;
}

.conversational-interface--embedded .ci-msg-item.ant-list-item {
  border: none !important;
  padding: 8px 0 !important;
}

.conversational-interface--embedded .ci-msg-avatar {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.08);
  background: linear-gradient(
    160deg,
    var(--asl-avatar-from, #ffe8d8),
    var(--asl-avatar-to, #ffc39a)
  );
}

.conversational-interface--embedded .ci-bubble.ant-card {
  border-radius: 18px !important;
  box-shadow: 0 4px 14px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.conversational-interface--embedded .ci-bubble--agent.ant-card {
  background: rgba(255, 255, 255, 0.96) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  color: var(--asl-ink, #5c3a2a);
}

.conversational-interface--embedded .ci-bubble--user.ant-card {
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  ) !important;
  color: #fff;
}

.conversational-interface--embedded .ci-bubble .ant-card-body {
  padding: 12px 14px !important;
}

.conversational-interface--embedded .ci-bubble--agent .ant-typography-copy {
  color: var(--asl-accent-deep, #e84f28) !important;
}

.conversational-interface--embedded .ci-bubble--user .ant-typography-copy {
  color: rgba(255, 255, 255, 0.92) !important;
}

.conversational-interface--embedded .ci-user-avatar.ant-avatar {
  background: linear-gradient(
    145deg,
    var(--asl-accent-soft, #ff8f5c),
    var(--asl-accent-deep, #e84f28)
  ) !important;
}

.conversational-interface--embedded .ci-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 10px;
}

.conversational-interface--embedded .ci-action-btn.ant-btn {
  height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-weight: 700;
  font-size: 12px;
  border: 1.5px solid rgba(0, 0, 0, 0.06) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  background: linear-gradient(
    160deg,
    #fff,
    var(--asl-card-surface, #fff7f1)
  ) !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

.conversational-interface--embedded .ci-action-btn.ant-btn:hover,
.conversational-interface--embedded .ci-action-btn.ant-btn:focus {
  color: #fff !important;
  border: none !important;
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  ) !important;
}

.conversational-interface--embedded .ci-link-row {
  background: rgba(0, 0, 0, 0.04);
  border: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 12px !important;
}

.conversational-interface--embedded .ci-link,
.conversational-interface--embedded .ci-link-icon {
  color: var(--asl-accent-deep, #e84f28);
}

.conversational-interface--embedded .ci-msg-time {
  display: block;
  margin-top: 6px;
}

.conversational-interface--embedded .input-container {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  background: rgba(255, 255, 255, 0.78);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 12px 14px calc(12px + var(--asl-kb-inset, 0px));
}

.conversational-interface--embedded .ci-composer {
  display: flex;
  width: 100%;
  gap: 8px;
  align-items: flex-end;
}

.conversational-interface--embedded .ci-composer .ant-input,
.conversational-interface--embedded .ci-composer textarea.ant-input {
  border-radius: 16px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.96) !important;
}

.conversational-interface--embedded .ci-composer .ant-input:focus,
.conversational-interface--embedded .ci-composer textarea.ant-input:focus {
  border-color: var(--asl-accent, #ff6b3d) !important;
  box-shadow: 0 0 0 3px var(--asl-glow, rgba(255, 200, 90, 0.22));
}

.conversational-interface--embedded .ci-composer-send.ant-btn-primary,
.conversational-interface--embedded .ci-composer-voice.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  ) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.conversational-interface--embedded .ci-composer-voice.ant-btn-default,
.conversational-interface--embedded .ci-composer-send.ant-btn-default {
  border: 1.5px solid rgba(0, 0, 0, 0.06) !important;
  background: linear-gradient(
    160deg,
    #fff,
    var(--asl-card-surface, #fff7f1)
  ) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
}

.conversational-interface--embedded .ci-voice-btn.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  ) !important;
}

.input-container--voice-session {
  padding: 12px 14px 16px;
  background: transparent;
  border-top: 1px solid rgba(0, 0, 0, 0.05);
}

.conversational-interface--voice .messages-container {
  padding-bottom: 8px;
}

.conversational-interface--embedded.conversational-interface--voice > .ant-card-body {
  background:
    radial-gradient(
      ellipse 80% 50% at 50% 100%,
      var(--asl-glow, rgba(255, 200, 90, 0.18)) 0%,
      rgba(255, 255, 255, 0) 60%
    ),
    linear-gradient(180deg, var(--asl-card-surface, #fff7f1) 0%, #ffffff 72%);
}

/* —— 快捷入口：强制横排换行（避免竖排一长列） —— */
.ci-quick-chips,
.conversational-interface--student .ci-quick-chips,
.floating-agent-panel .ci-quick-chips,
.floating-agent-panel .input-container > .ant-space,
.floating-agent-panel .input-container > .ant-space-horizontal {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  align-items: center !important;
  gap: 8px !important;
  width: 100% !important;
  margin: 0 0 10px !important;
  box-sizing: border-box;
}

.floating-agent-panel .input-container > .ant-space .ant-space-item,
.floating-agent-panel .input-container > .ant-space .ant-btn,
.ci-quick-chip {
  flex: 0 0 auto !important;
  width: auto !important;
  max-width: 100%;
}

.ci-quick-chip {
  height: 32px;
  padding: 0 12px;
  border-radius: 999px;
  border: 1.5px solid rgba(0, 0, 0, 0.06);
  background: linear-gradient(160deg, #fff, var(--asl-card-surface, #fff7f1));
  color: var(--asl-accent-deep, #e84f28);
  font-size: 12px;
  font-weight: 700;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
  -webkit-tap-highlight-color: transparent;
}

.ci-quick-chip--primary {
  border: none;
  color: #fff;
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  );
  box-shadow: 0 6px 14px rgba(0, 0, 0, 0.12);
}

.ci-quick-chip:active {
  transform: scale(0.98);
}

/* 学生端：隐藏残留语音入口 */
.conversational-interface--student .ci-composer-voice,
.conversational-interface--student .ci-voice-btn,
.floating-agent-panel .ci-composer-voice,
.floating-agent-panel .ci-voice-btn {
  display: none !important;
}

/* —— 消息操作钮同样横排 —— */
.conversational-interface .ci-actions {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: wrap !important;
  gap: 8px;
  margin-top: 10px;
}

.conversational-interface .ci-action-btn.ant-btn {
  flex: 0 0 auto !important;
  width: auto !important;
  height: 32px !important;
  padding: 0 12px !important;
  border-radius: 999px !important;
  font-weight: 700;
  font-size: 12px;
  border: 1.5px solid rgba(0, 0, 0, 0.06) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  background: linear-gradient(
    160deg,
    #fff,
    var(--asl-card-surface, #fff7f1)
  ) !important;
  box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}

/* —— 复制图标 ASL 化 —— */
.conversational-interface .ant-typography-copy {
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  width: 28px;
  height: 28px;
  -webkit-margin-start: 6px !important;
          margin-inline-start: 6px !important;
  border-radius: 999px !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  background: rgba(255, 255, 255, 0.95) !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
}

.conversational-interface .ci-bubble--user .ant-typography-copy {
  color: #fff !important;
  background: rgba(255, 255, 255, 0.22) !important;
  border-color: rgba(255, 255, 255, 0.35) !important;
}

.conversational-interface .ant-typography-copy:hover {
  color: #fff !important;
  border: none !important;
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  ) !important;
}

/* —— 底部输入区：加高文本框 + 美化附件/发送 —— */
.conversational-interface .input-container {
  border-top: 1px solid rgba(0, 0, 0, 0.05);
  background: rgba(255, 255, 255, 0.84);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  padding: 12px 14px calc(12px + var(--asl-kb-inset, 0px));
}

.ci-composer {
  display: flex;
  width: 100%;
  gap: 8px;
  align-items: flex-end;
  flex-wrap: wrap;
  box-sizing: border-box;
}

.ci-composer-input.ant-input,
.ci-composer textarea.ant-input,
.ci-composer .ant-input {
  flex: 1 1 220px !important;
  min-width: 0 !important;
  min-height: 64px !important;
  padding: 12px 14px !important;
  border-radius: 16px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.98) !important;
  font-size: 15px !important;
  line-height: 1.45 !important;
  -webkit-writing-mode: horizontal-tb;
          writing-mode: horizontal-tb;
  direction: ltr;
  resize: vertical;
  box-shadow: inset 0 1px 2px rgba(0, 0, 0, 0.02);
}

.ci-composer-input.ant-input:focus,
.ci-composer textarea.ant-input:focus {
  border-color: var(--asl-accent, #ff6b3d) !important;
  box-shadow: 0 0 0 3px var(--asl-glow, rgba(255, 200, 90, 0.22));
}

.ci-composer-tools {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  gap: 8px;
  flex-shrink: 0;
}

.ci-attach-wrap {
  flex-shrink: 0;
}

.ci-attach-wrap .ant-space-vertical {
  width: auto !important;
}

.ci-attach-wrap .ant-alert {
  display: none; /* 对话底栏不展示大段知识库提示，避免挤占输入区 */
}

.ci-attach-wrap .ant-btn {
  width: 44px !important;
  min-width: 44px !important;
  height: 44px !important;
  padding: 0 !important;
  border-radius: 999px !important;
  border: 1.5px solid rgba(0, 0, 0, 0.06) !important;
  background: linear-gradient(
    160deg,
    #fff,
    var(--asl-card-surface, #fff7f1)
  ) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

.ci-attach-wrap .ant-btn .anticon {
  font-size: 18px;
  margin: 0 !important;
}

.ci-composer-send.ant-btn,
.ci-composer-voice.ant-btn {
  height: 44px !important;
  min-height: 44px !important;
  padding: 0 16px !important;
  border-radius: 999px !important;
  font-weight: 700 !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  gap: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.06);
}

.ci-composer-send.ant-btn-primary,
.ci-composer-voice.ant-btn-primary {
  border: none !important;
  color: #fff !important;
  background: linear-gradient(
    135deg,
    var(--asl-pill-from, #ff7d4a),
    var(--asl-pill-to, #f24a1c)
  ) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.12);
}

.ci-composer-voice.ant-btn-default,
.ci-composer-send.ant-btn-default {
  border: 1.5px solid rgba(0, 0, 0, 0.06) !important;
  background: linear-gradient(
    160deg,
    #fff,
    var(--asl-card-surface, #fff7f1)
  ) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
}

@media (orientation: portrait), (max-width: 768px) {
  .ci-composer-input.ant-input,
  .ci-composer textarea.ant-input {
    min-height: 72px !important;
    font-size: 16px !important; /* 减轻 iOS 聚焦缩放 */
  }

  .ci-composer-send.ant-btn,
  .ci-composer-voice.ant-btn,
  .ci-attach-wrap .ant-btn {
    height: 48px !important;
    min-height: 48px !important;
  }

  .ci-attach-wrap .ant-btn {
    width: 48px !important;
    min-width: 48px !important;
  }
}

.floating-agent-container {
  z-index: 1000;
  cursor: -webkit-grab;
  cursor: grab;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.floating-agent-container:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

/* 智能体形象包装器（直接显示形象，无球背景） */
.floating-agent-avatar-wrapper {
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: visible; /* 确保完整显示形象 */
  background: transparent; /* 透明背景，直接显示形象 */
  /* 直接显示智能体形象，不在球内 */
}

.floating-agent-avatar-wrapper:hover {
  /* hover效果由内联样式控制 */
}

.floating-agent-panel {
  background: white;
  border-radius: 16px;
  box-shadow: 0 8px 40px rgba(0, 0, 0, 0.15);
  z-index: 999999 !important;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  animation: slideUp 0.3s ease;
  resize: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  isolation: isolate; /* 创建新的层叠上下文 */
  transform: translateZ(0); /* 强制创建新的层叠上下文 */
  will-change: transform; /* 提示浏览器优化 */
}

@keyframes slideUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.floating-agent-panel-header {
  padding: 12px 14px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  color: white;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
  font-weight: 500;
  cursor: -webkit-grab;
  cursor: grab;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  flex-shrink: 0;
}

.floating-agent-panel-header:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.floating-agent-panel-header-left {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  flex: 1;
}

.floating-agent-panel-header-avatar {
  flex-shrink: 0;
  width: 48px;
  height: 48px;
  border-radius: 12px;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.22);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.28);
}

.floating-agent-panel-titles {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.floating-agent-panel-title {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  font-weight: 650;
  line-height: 1.25;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.floating-agent-panel-grip {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  opacity: 0.72;
  font-size: 12px;
  line-height: 1;
}

.floating-agent-panel-subtitle {
  font-size: 11px;
  font-weight: 500;
  line-height: 1.3;
  color: rgba(255, 255, 255, 0.82);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.floating-agent-panel-header-actions {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
}

.floating-agent-panel-icon-btn {
  width: 32px;
  height: 32px;
  margin: 0;
  padding: 0;
  border: none;
  border-radius: 10px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 15px;
  cursor: pointer;
  background: rgba(255, 255, 255, 0.16);
  transition: background 0.15s ease, transform 0.12s ease;
}

.floating-agent-panel-icon-btn:hover {
  background: rgba(255, 255, 255, 0.28);
}

.floating-agent-panel-icon-btn:active {
  transform: scale(0.96);
}

.floating-agent-panel-icon-btn.is-active {
  background: rgba(255, 255, 255, 0.34);
}

/* 连轮语音入口：带文字，避免与「仅播报」语义混淆 */
.floating-agent-voice-btn {
  height: 32px;
  margin: 0;
  padding: 0 10px 0 8px;
  border: none;
  border-radius: 999px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: #1a1a2e;
  font-size: 13px;
  font-weight: 650;
  letter-spacing: 0.02em;
  cursor: pointer;
  background: linear-gradient(180deg, #fff 0%, #f3f0ff 100%);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.55) inset, 0 2px 8px rgba(0, 0, 0, 0.18);
  transition: transform 0.12s ease, background 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.floating-agent-voice-btn__icon {
  font-size: 15px;
  color: #6b4eff;
}

.floating-agent-voice-btn__label {
  line-height: 1;
  white-space: nowrap;
}

.floating-agent-voice-btn:hover {
  transform: translateY(-1px);
  box-shadow: 0 1px 0 rgba(255, 255, 255, 0.65) inset, 0 4px 12px rgba(0, 0, 0, 0.22);
}

.floating-agent-voice-btn:active {
  transform: translateY(0);
}

.floating-agent-voice-btn.is-active {
  color: #fff;
  background: linear-gradient(135deg, #ff7a45 0%, #fa541c 55%, #d4380d 100%);
  box-shadow: 0 0 0 2px rgba(255, 255, 255, 0.35), 0 4px 14px rgba(250, 84, 28, 0.45);
}

.floating-agent-voice-btn.is-active .floating-agent-voice-btn__icon {
  color: #fff;
}

.floating-agent-voice-btn.is-active .floating-agent-voice-btn__label {
  animation: floating-agent-voice-pulse 1.4s ease-in-out infinite;
}

@keyframes floating-agent-voice-pulse {
  0%,
  100% {
    opacity: 1;
  }
  50% {
    opacity: 0.78;
  }
}

@media (max-width: 420px) {
  .floating-agent-voice-btn__label {
    font-size: 12px;
  }
}

.floating-agent-panel-icon-btn--close:hover {
  background: rgba(239, 68, 68, 0.55);
}

/* 旧 class 兼容 */
.close-button {
  cursor: pointer;
  font-size: 18px;
  opacity: 0.8;
  transition: opacity 0.2s;
}

.close-button:hover {
  opacity: 1;
}

.floating-agent-panel-content {
  flex: 1;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.resize-handle {
  position: absolute;
  z-index: 1000;
  touch-action: none;
}

.resize-handle--corner {
  bottom: 0;
  right: 0;
  width: 22px;
  height: 22px;
  cursor: nwse-resize;
  background: linear-gradient(
    135deg,
    transparent 0%,
    transparent 40%,
    rgba(0, 0, 0, 0.12) 40%,
    rgba(0, 0, 0, 0.12) 60%,
    transparent 60%
  );
}

.resize-handle--corner:hover {
  background: linear-gradient(
    135deg,
    transparent 0%,
    transparent 40%,
    rgba(37, 99, 235, 0.35) 40%,
    rgba(37, 99, 235, 0.35) 60%,
    transparent 60%
  );
}

.resize-handle--east {
  top: 28px;
  right: 0;
  bottom: 22px;
  width: 10px;
  cursor: ew-resize;
  background: transparent;
}

.resize-handle--east:hover {
  background: color-mix(in srgb, var(--product-primary, #2563eb) 18%, transparent);
}

.resize-handle--south {
  left: 0;
  right: 22px;
  bottom: 0;
  height: 10px;
  cursor: ns-resize;
  background: transparent;
}

.resize-handle--south:hover {
  background: color-mix(in srgb, var(--product-primary, #2563eb) 18%, transparent);
}

/* 响应式：仅窄屏强制铺满；PC 保留内联宽高以便拖动手柄调宽 */
@media (max-width: 768px) {
  .floating-agent-panel-header-avatar {
    width: 36px;
    height: 36px;
    border-radius: 10px;
  }

  .floating-agent-panel:not(.floating-agent-panel--student) {
    width: calc(100vw - 60px) !important;
    height: calc(100vh - 200px) !important;
    max-width: calc(100vw - 60px);
    max-height: calc(100vh - 200px);
  }
}

/* Product UI 设计 Token（body.product-ui-active 时生效，仅 Preview 通道） */

body.product-ui-active {
  --product-primary: #2563eb;
  --product-primary-hover: #1d4ed8;
  --product-primary-light: #dbeafe;
  --product-accent: #0ea5e9;
  --product-surface: #f0f4f8;
  --product-surface-card: #ffffff;
  --product-text: #1e293b;
  --product-text-secondary: #64748b;
  --product-deep: #1e3a5f;
  --product-radius-md: 12px;
  --product-radius-lg: 16px;
  --product-shadow-card: 0 8px 24px rgba(37, 99, 235, 0.08);
  --product-gradient-login: linear-gradient(145deg, #1e3a5f 0%, #2563eb 48%, #38bdf8 100%);
  --product-gradient-hero: linear-gradient(135deg, #1e3a5f 0%, #2563eb 52%, #0ea5e9 100%);
  --product-touch-min: 44px;
  background-color: var(--product-surface);
  background-image: none;
}

body.product-ui-active #root {
  background-color: var(--product-surface);
  background-image: none;
}

/* 登录页品牌视觉 */
.product-login-page {
  background: var(--product-gradient-login) !important;
}

.product-login-page .product-login-card {
  border-radius: var(--product-radius-lg) !important;
  box-shadow: 0 20px 50px rgba(15, 23, 42, 0.18) !important;
  border: 1px solid rgba(255, 255, 255, 0.25);
}

.product-login-page .product-login-title {
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
}

.product-login-page .product-login-subtitle {
  color: rgba(255, 255, 255, 0.88) !important;
}

.product-login-page .product-login-hint {
  color: rgba(255, 255, 255, 0.72) !important;
}

/* ═══════════════════════════════════════
   学生 App 壳 · 底栏对齐 ASL Dock
   Chrome 80：无 color-mix / :has / conic-gradient
   主题色走 --asl-*（运行时由 StudentAppShell 注入）
   ═══════════════════════════════════════ */

.student-app-shell {
  /* 默认暖橙，与 aslThemes sunset / 桌面同源 */
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 20px 44px rgba(160, 48, 18, 0.22);
  --asl-tab-active-ink: #2b211c;
  --asl-avatar-from: #ffe8d8;
  --asl-avatar-to: #ffc39a;
  --asl-avatar-ink: #9a3412;
  --asl-radius: 28px;
  --asl-radius-sm: 20px;
  --asl-glass: rgba(255, 255, 255, 0.78);
  --asl-glass-border: rgba(255, 255, 255, 0.88);
  --asl-dock-shadow: 0 14px 28px rgba(0, 0, 0, 0.12);

  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  display: flex;
  flex-direction: column;
  color: var(--asl-ink);
  background:
    radial-gradient(ellipse 70% 50% at 12% 0%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 55%),
    radial-gradient(ellipse 55% 40% at 88% 100%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(168deg, var(--asl-card-surface) 0%, var(--asl-card) 48%, #ffffff 100%);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  -webkit-tap-highlight-color: transparent;
}

.student-app-shell[data-asl-theme="azure"] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-card-surface: #f0f6ff;
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-avatar-from: #dbeafe;
  --asl-avatar-to: #93c5fd;
  --asl-avatar-ink: #1e40af;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 20px 44px rgba(30, 64, 175, 0.2);
  --asl-tab-active-ink: #1e293b;
}

.student-app-shell[data-asl-theme="tech"] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-card-surface: #ecfeff;
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-avatar-from: #cffafe;
  --asl-avatar-to: #67e8f9;
  --asl-avatar-ink: #155e75;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 20px 44px rgba(14, 116, 144, 0.2);
  --asl-tab-active-ink: #0f172a;
}

.student-app-shell[data-asl-theme="emerald"] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-card-surface: #ecfdf5;
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-avatar-from: #d1fae5;
  --asl-avatar-to: #6ee7b7;
  --asl-avatar-ink: #065f46;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 20px 44px rgba(4, 120, 87, 0.18);
  --asl-tab-active-ink: #064e3b;
}

.student-app-shell[data-asl-theme="violet"] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-card-surface: #f5f3ff;
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-avatar-from: #ede9fe;
  --asl-avatar-to: #c4b5fd;
  --asl-avatar-ink: #5b21b6;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 20px 44px rgba(91, 33, 182, 0.2);
  --asl-tab-active-ink: #2e1065;
}

.student-app-shell__main {
  flex: 1;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

/* 玻璃 Dock —— 默认按竖屏底栏；横屏由 orientation 切到右侧 */
.student-app-shell__tabbar {
  position: fixed;
  z-index: 1000;
  display: flex;
  align-items: center;
  box-sizing: border-box;
  background: var(--asl-glass);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  border: 1px solid var(--asl-glass-border);
  box-shadow: var(--asl-dock-shadow);
  animation: student-shell-dock-in 0.36s ease both;
}

@keyframes student-shell-dock-in {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.student-app-shell__tab {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 3px;
  padding: 0;
  position: relative;
  border: none;
  background: transparent;
  color: var(--asl-ink-soft);
  font-size: 10px;
  font-weight: 600;
  line-height: 1.15;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
  transition: color 0.18s ease, transform 0.12s ease;
}

.student-app-shell__tab-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 46px;
  height: 46px;
  border-radius: 16px;
  overflow: hidden;
  background: transparent;
  box-shadow: 0 8px 16px rgba(92, 58, 42, 0.12);
  transition: transform 0.12s ease, box-shadow 0.18s ease, opacity 0.18s ease;
}

.student-app-shell__tab-icon--img {
  background: transparent;
}

.student-app-shell__tab-icon-img {
  width: 46px;
  height: 46px;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  border-radius: 16px;
  transition: opacity 0.18s ease, transform 0.12s ease;
}

.student-app-shell__tab-label {
  max-width: 68px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.student-app-shell__tab:not(.student-app-shell__tab--active) .student-app-shell__tab-icon {
  opacity: 0.72;
  box-shadow: 0 4px 10px rgba(92, 58, 42, 0.08);
}

.student-app-shell__tab:not(.student-app-shell__tab--active) .student-app-shell__tab-icon-img {
  opacity: 0.85;
}

.student-app-shell__tab--active {
  color: var(--asl-tab-active-ink);
}

.student-app-shell__tab--active .student-app-shell__tab-icon {
  opacity: 1;
  transform: scale(1.06);
  box-shadow: 0 8px 16px rgba(92, 58, 42, 0.16);
}

.student-app-shell__tab--active .student-app-shell__tab-icon-img {
  opacity: 1;
}

/* 激活指示：竖屏顶条 / 横屏左侧条（见 orientation） */
.student-app-shell__tab--active::before {
  content: '';
  position: absolute;
  border-radius: 2px;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to));
}

.student-app-shell__tab:active {
  transform: scale(0.94);
}

/* 学习桌面页：壳透明、隐藏底栏（与 ASL 首页衔接） */
.student-app-shell--asl .student-app-shell__main {
  padding: 0 !important;
  overflow: hidden;
}

.student-app-shell--asl .student-app-shell__tabbar {
  display: none;
}

.student-app-shell--asl,
.student-app-shell--asl .student-app-shell__main {
  min-height: 100vh;
  min-height: 100dvh;
  background: transparent;
}

/* ═══════════════ 竖屏：底栏 Dock（对齐 ASL portrait） ═══════════════ */
@media screen and (orientation: portrait) {
  .student-app-shell__main {
    padding-bottom: calc(88px + env(safe-area-inset-bottom, 12px));
    padding-right: 0;
  }

  .student-app-shell__tabbar {
    left: 12px;
    right: 12px;
    bottom: calc(10px + env(safe-area-inset-bottom, 0px));
    top: auto;
    width: auto;
    height: 72px;
    flex-direction: row;
    justify-content: space-around;
    padding: 8px 6px;
    border-radius: 22px;
  }

  .student-app-shell__tab {
    flex: 1;
    width: auto;
    max-width: 88px;
    min-height: 56px;
  }

  .student-app-shell__tab-label {
    display: block;
  }

  .student-app-shell__tab--active::before {
    top: 0;
    left: 50%;
    width: 18px;
    height: 3px;
    margin-left: -9px;
    background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to));
  }
}

/* 窄竖屏 */
@media screen and (orientation: portrait) and (max-width: 420px) {
  .student-app-shell__tabbar {
    left: 10px;
    right: 10px;
    height: 68px;
    border-radius: 20px;
  }

  .student-app-shell__tab-icon,
  .student-app-shell__tab-icon-img {
    width: 42px;
    height: 42px;
    border-radius: 14px;
  }

  .student-app-shell__main {
    padding-bottom: calc(84px + env(safe-area-inset-bottom, 12px));
  }
}

/* ═══════════════ 横屏：右侧 Dock（对齐 ASL landscape） ═══════════════ */
@media screen and (orientation: landscape) {
  .student-app-shell__main {
    padding-bottom: 12px;
    padding-right: calc(96px + env(safe-area-inset-right, 8px));
  }

  .student-app-shell__tabbar {
    top: 12px;
    bottom: 12px;
    right: calc(10px + env(safe-area-inset-right, 0px));
    left: auto;
    width: 78px;
    max-width: none;
    height: auto;
    margin: 0;
    flex-direction: column;
    justify-content: space-evenly;
    gap: 6px;
    padding: 14px 8px;
    border-radius: 30px;
    animation-name: student-shell-dock-in-x;
  }

  .student-app-shell__tab {
    flex: 0 0 auto;
    width: 62px;
    max-width: none;
    min-height: 0;
  }

  /* 与 ASL 横屏 Dock 一致：隐藏文字，只留图标 */
  .student-app-shell__tab-label {
    display: none;
  }

  .student-app-shell__tab-icon,
  .student-app-shell__tab-icon-img {
    width: 54px;
    height: 54px;
    border-radius: 18px;
  }

  .student-app-shell__tab--active::before {
    top: 50%;
    left: 2px;
    width: 3px;
    height: 18px;
    margin-top: -9px;
    background: linear-gradient(180deg, var(--asl-pill-from), var(--asl-pill-to));
  }
}

@keyframes student-shell-dock-in-x {
  from {
    opacity: 0;
    transform: translateX(12px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 矮横屏（平板横置高度有限）：压缩 Dock */
@media screen and (orientation: landscape) and (max-height: 520px) {
  .student-app-shell__tabbar {
    width: 68px;
    padding: 8px 6px;
    border-radius: 24px;
  }

  .student-app-shell__tab-icon,
  .student-app-shell__tab-icon-img {
    width: 44px;
    height: 44px;
    border-radius: 15px;
  }

  .student-app-shell__main {
    padding-right: calc(84px + env(safe-area-inset-right, 8px));
  }
}


/* ========================================
   Product UI shared chips (theme via --product-*)
   ======================================== */

.product-chip-btn.ant-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 12%, transparent);
  background: var(--product-surface-card, #fff);
  color: var(--product-deep, #1e3a5f);
  box-shadow: 0 1px 2px color-mix(in srgb, var(--product-deep, #1e3a5f) 6%, transparent);
  transition: background 0.15s ease, border-color 0.15s ease, color 0.15s ease, box-shadow 0.15s ease;
}

.product-chip-btn.ant-btn:hover,
.product-chip-btn.ant-btn:focus-visible {
  background: var(--product-primary-light, #dbeafe) !important;
  border-color: color-mix(in srgb, var(--product-primary, #2563eb) 35%, transparent) !important;
  color: var(--product-primary, #2563eb) !important;
  outline: none;
}

.product-chip-btn.ant-btn:focus-visible {
  box-shadow: 0 0 0 3px var(--product-primary-light, #dbeafe);
}

.product-pill-btn.ant-btn {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  height: 40px;
  padding: 0 14px 0 12px;
  border-radius: 999px;
  border: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 12%, transparent);
  background: var(--product-surface-card, #fff);
  color: var(--product-deep, #1e3a5f);
  font-weight: 560;
  max-width: 220px;
  box-shadow: 0 1px 3px color-mix(in srgb, var(--product-deep, #1e3a5f) 6%, transparent);
  transition: background 0.15s ease, border-color 0.15s ease, box-shadow 0.15s ease, color 0.15s ease;
}

.product-pill-btn.ant-btn > span {
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.product-pill-btn.ant-btn:hover,
.product-pill-btn.ant-btn:focus-visible {
  background: var(--product-surface, #f8fafc) !important;
  border-color: color-mix(in srgb, var(--product-primary, #2563eb) 35%, transparent) !important;
  color: var(--product-primary, #2563eb) !important;
  box-shadow: 0 4px 12px color-mix(in srgb, var(--product-primary, #2563eb) 16%, transparent);
  outline: none;
}

.product-pill-btn.ant-btn .anticon {
  flex-shrink: 0;
  font-size: 15px;
  color: var(--product-primary, #2563eb);
}

/* ========================================
   Teacher app shell (token-driven)
   ======================================== */

.teacher-app-shell {
  min-height: 100vh;
  height: 100vh;
  max-height: 100vh;
  overflow: hidden;
  background: var(--product-surface, #f0f4f8);
  color: var(--product-text, #1e293b);
}

.teacher-app-shell__sider {
  background: var(--product-surface-card, #fff) !important;
  border-right: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 8%, transparent) !important;
  box-shadow: 6px 0 28px color-mix(in srgb, var(--product-deep, #1e3a5f) 5%, transparent);
  height: 100vh !important;
  max-height: 100vh !important;
  overflow: hidden !important;
}

.teacher-app-shell__sider .ant-layout-sider-children {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 0;
  overflow: hidden;
}

.teacher-app-shell__brand {
  display: flex;
  align-items: center;
  flex-shrink: 0;
  min-height: 72px;
  height: 72px;
  padding: 0 22px;
  border-bottom: none;
  background: var(--product-gradient-hero, linear-gradient(135deg, #1e3a5f 0%, #2563eb 52%, #0ea5e9 100%));
  box-shadow: inset 0 -1px 0 rgba(255, 255, 255, 0.12);
  position: relative;
}

.teacher-app-shell__brand::after {
  content: '';
  position: absolute;
  inset: 0;
  background: radial-gradient(ellipse 70% 90% at 100% 0%, rgba(255, 255, 255, 0.16) 0%, transparent 55%);
  pointer-events: none;
}

.teacher-app-shell__brand-text {
  position: relative;
  z-index: 1;
  color: #fff !important;
  font-size: 14px;
  font-weight: 650;
  letter-spacing: 0.04em;
  line-height: 1.4;
  max-width: 100%;
}

.teacher-app-shell.ant-layout-has-sider > .ant-layout-sider-collapsed .teacher-app-shell__brand {
  justify-content: center;
  padding: 0 12px;
}

.teacher-app-shell__menu {
  -webkit-border-end: none !important;
          border-inline-end: none !important;
  flex: 1 1 auto;
  min-height: 0;
  padding: 16px 12px 32px;
  background: transparent !important;
  overflow-x: hidden;
  overflow-y: auto;
  overscroll-behavior: contain;
  scrollbar-gutter: stable;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: thin;
  scrollbar-color: color-mix(in srgb, var(--product-deep, #1e3a5f) 22%, transparent) transparent;
}

/* 侧栏菜单滚动条：默认细条，悬停时更明显 */
.teacher-app-shell__menu::-webkit-scrollbar {
  width: 8px;
}

.teacher-app-shell__menu::-webkit-scrollbar-track {
  background: transparent;
}

.teacher-app-shell__menu::-webkit-scrollbar-thumb {
  background: color-mix(in srgb, var(--product-deep, #1e3a5f) 18%, transparent);
  border-radius: 999px;
  border: 2px solid transparent;
  background-clip: padding-box;
}

.teacher-app-shell__menu::-webkit-scrollbar-thumb:hover {
  background: color-mix(in srgb, var(--product-deep, #1e3a5f) 32%, transparent);
  background-clip: padding-box;
}

.teacher-app-shell__menu.ant-menu-inline .ant-menu-item,
.teacher-app-shell__menu.ant-menu-inline .ant-menu-submenu-title {
  margin: 4px 2px !important;
  width: calc(100% - 4px) !important;
  height: 42px !important;
  line-height: 42px !important;
  border-radius: 10px;
  padding-inline: 14px !important;
  color: var(--product-text, #334155);
  transition: background 0.18s ease, color 0.18s ease, box-shadow 0.18s ease;
}

.teacher-app-shell__menu.ant-menu-inline .ant-menu-item .anticon,
.teacher-app-shell__menu.ant-menu-inline .ant-menu-submenu-title .anticon {
  font-size: 15px;
  color: var(--product-text-secondary, #64748b);
  transition: color 0.18s ease;
}

.teacher-app-shell__menu.ant-menu-inline .ant-menu-item:hover,
.teacher-app-shell__menu.ant-menu-inline .ant-menu-submenu-title:hover {
  background: var(--product-primary-light, #dbeafe) !important;
  color: var(--product-primary, #2563eb) !important;
}

.teacher-app-shell__menu.ant-menu-inline .ant-menu-item:hover .anticon,
.teacher-app-shell__menu.ant-menu-inline .ant-menu-submenu-title:hover .anticon {
  color: var(--product-primary, #2563eb);
}

.teacher-app-shell__menu .ant-menu-item-selected {
  background: var(--product-primary-light, #dbeafe) !important;
  color: var(--product-primary, #2563eb) !important;
  font-weight: 650;
  box-shadow: inset 3px 0 0 var(--product-primary, #2563eb);
}

.teacher-app-shell__menu .ant-menu-item-selected .anticon {
  color: var(--product-primary, #2563eb) !important;
}

.teacher-app-shell__menu .ant-menu-submenu-open > .ant-menu-submenu-title {
  color: var(--product-deep, #1e3a5f);
  font-weight: 650;
}

.teacher-app-shell__menu .ant-menu-item-group-title {
  padding: 18px 14px 10px;
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.1em;
  color: var(--product-text-secondary, #94a3b8);
}

.teacher-app-shell__menu .ant-menu-sub.ant-menu-inline {
  background: transparent !important;
}

.teacher-app-shell__menu .ant-menu-sub.ant-menu-inline .ant-menu-item {
  height: 38px !important;
  line-height: 38px !important;
  margin-block: 2px !important;
}

.teacher-app-shell__menu .ant-menu-sub .ant-menu-sub.ant-menu-inline .ant-menu-item {
  padding-left: 44px !important;
}

.teacher-app-shell__body {
  min-height: 0;
  height: 100vh;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.teacher-app-shell__header {
  display: flex !important;
  align-items: center;
  justify-content: space-between;
  height: 72px !important;
  padding: 0 24px 0 18px !important;
  line-height: normal !important;
  overflow: hidden !important;
  background: color-mix(in srgb, var(--product-surface-card, #fff) 96%, transparent) !important;
  -webkit-backdrop-filter: blur(12px);
          backdrop-filter: blur(12px);
  border-bottom: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 7%, transparent);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.9),
    0 8px 24px color-mix(in srgb, var(--product-deep, #1e3a5f) 4%, transparent);
}

.teacher-app-shell__header-left {
  gap: 14px !important;
  min-width: 0;
}

.teacher-app-shell__header .ant-space,
.teacher-app-shell__header .ant-btn {
  line-height: 1.2;
}

.teacher-app-shell__toggle-btn.ant-btn {
  width: 40px;
  height: 40px;
  padding: 0;
}

.teacher-app-shell__header-subtitle {
  color: var(--product-deep, #1e3a5f) !important;
  font-weight: 650;
  font-size: 15px;
  letter-spacing: 0.03em;
  line-height: 1.2 !important;
}

.teacher-app-shell__content {
  padding: 24px 28px 36px;
  min-height: calc(100vh - 72px);
  background:
    radial-gradient(
      ellipse 70% 40% at 0% 0%,
      color-mix(in srgb, var(--product-primary, #2563eb) 8%, transparent) 0%,
      transparent 55%
    ),
    var(--product-surface, #f0f4f8);
  box-sizing: border-box;
}

/* 沉浸式课堂 / 简单对话：取消内边距，把剩余视口交给子页，避免顶栏裁掉底部输入 */
.teacher-app-shell__content--fill {
  padding: 0;
  height: calc(100vh - 72px);
  max-height: calc(100vh - 72px);
  min-height: 0;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.teacher-app-shell__content--fill > .modular-chat {
  flex: 1 1 auto;
  min-height: 0;
  height: 100%;
  max-height: 100%;
}

.student-app-shell__main--fill-classroom {
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.teacher-app-shell--nested .teacher-app-shell__content {
  padding: 0;
  background: transparent;
}

.teacher-ui.teacher-admin-page,
.teacher-ui.teacher-workspace-page,
.teacher-ui.teacher-homework-page,
.teacher-ui.teacher-classroom-page,
.teacher-ui.teacher-prep-page,
.teacher-ui.teacher-research-page,
.teacher-ui.teacher-schedule-page,
.teacher-ui.teacher-agent-page,
.teacher-ui.teacher-homework-design-page {
  background: var(--product-surface, #f0f4f8);
  color: var(--product-text, #1e293b);
}

.teacher-ui.teacher-homework-design-page .homework-design-flow {
  margin: 0 0 20px;
  padding: 16px 18px;
  border-radius: 12px;
  background: linear-gradient(135deg, rgba(37, 99, 235, 0.06) 0%, rgba(14, 165, 233, 0.05) 100%);
  border: 1px solid rgba(37, 99, 235, 0.12);
}

.teacher-ui.teacher-homework-design-page .homework-design-flow .ant-steps-item {
  cursor: pointer;
}

.teacher-ui.teacher-homework-design-page .homework-design-flow .ant-steps-item-title {
  font-weight: 600;
  font-size: 13px;
}

.teacher-ui.teacher-homework-design-page .homework-design-flow .ant-steps-item-description {
  font-size: 12px;
  max-width: 140px;
}

/* ========================================
   Student PC shell (token-driven, not ASL)
   侧栏布局复用 .teacher-app-shell*；以下仅保留兼容旧顶栏（若仍被引用）
   ======================================== */

.student-app-shell--pc.teacher-app-shell {
  /* Ant Layout 横向侧栏；覆盖旧顶栏壳的 column flex */
  display: flex;
  flex-direction: row;
  min-height: 100vh;
  min-height: 100dvh;
  background: var(--product-surface, #f0f4f8);
  color: var(--product-text, #1e293b);
  font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
}

.student-app-shell--pc .student-pc-topnav {
  position: -webkit-sticky;
  position: sticky;
  top: 0;
  z-index: 100;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  min-height: 60px;
  padding: 0 22px;
  background: color-mix(in srgb, var(--product-surface-card, #fff) 94%, transparent);
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border-bottom: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 8%, transparent);
  box-shadow: 0 4px 16px color-mix(in srgb, var(--product-deep, #1e3a5f) 4%, transparent);
}

.student-app-shell--pc .student-pc-topnav__brand {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.student-app-shell--pc .student-pc-topnav__kicker {
  font-size: 11px;
  font-weight: 650;
  letter-spacing: 0.08em;
  color: var(--product-text-secondary, #94a3b8);
}

.student-app-shell--pc .student-pc-topnav__title {
  font-size: 15px;
  font-weight: 650;
  color: var(--product-deep, #1e3a5f);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.student-app-shell--pc .student-pc-topnav__tabs {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-wrap: wrap;
  justify-content: flex-end;
}

.student-app-shell--pc .student-pc-topnav__tab {
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 8px 14px;
  border-radius: 10px;
  font-size: 14px;
  font-weight: 500;
  color: var(--product-text-secondary, #64748b);
  transition: background 0.15s ease, color 0.15s ease;
}

.student-app-shell--pc .student-pc-topnav__tab:hover {
  color: var(--product-primary, #2563eb);
  background: var(--product-primary-light, #dbeafe);
}

.student-app-shell--pc .student-pc-topnav__tab--active {
  color: var(--product-primary, #2563eb);
  background: var(--product-primary-light, #dbeafe);
  font-weight: 650;
}

.student-app-shell--pc .student-app-shell__main {
  flex: 1;
  min-height: 0;
  overflow: auto;
  padding: 20px 24px 32px;
  box-sizing: border-box;
}

@media (max-width: 767px) {
  .student-app-shell--pc .student-pc-topnav {
    flex-direction: column;
    align-items: stretch;
    padding: 10px 12px 8px;
  }

  .student-app-shell--pc .student-pc-topnav__tabs {
    justify-content: flex-start;
    overflow-x: auto;
    flex-wrap: nowrap;
    padding-bottom: 4px;
  }

  .student-app-shell--pc .student-app-shell__main {
    padding: 12px;
  }
}
/* Android 学生包：横屏「学习桌面」视觉（Chrome 80 友好：无 color-mix / :has / 仅用 dvh） */

.asl-root {
  --asl-orange: #ff6a3d;
  --asl-orange-deep: #e85a2e;
  --asl-orange-soft: #ff8f66;
  --asl-card: rgba(255, 255, 255, 0.88);
  --asl-card-solid: #fff7f2;
  --asl-text: #1f2937;
  --asl-muted: rgba(31, 41, 55, 0.62);
  --asl-radius: 28px;
  --asl-shadow: 0 18px 40px rgba(180, 60, 20, 0.22);

  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  padding: 16px 18px 18px;
  padding-left: max(18px, env(safe-area-inset-left, 0px));
  padding-right: max(18px, env(safe-area-inset-right, 0px));
  padding-top: max(12px, env(safe-area-inset-top, 0px));
  padding-bottom: max(12px, env(safe-area-inset-bottom, 0px));
  color: var(--asl-text);
  background:
    radial-gradient(circle at 12% 18%, rgba(255, 255, 255, 0.28) 0%, rgba(255, 255, 255, 0) 42%),
    radial-gradient(circle at 88% 72%, rgba(255, 210, 120, 0.35) 0%, rgba(255, 210, 120, 0) 46%),
    radial-gradient(circle at 70% 8%, rgba(255, 255, 255, 0.18) 0%, rgba(255, 255, 255, 0) 36%),
    linear-gradient(145deg, var(--asl-orange-soft) 0%, var(--asl-orange) 48%, var(--asl-orange-deep) 100%);
  display: flex;
  flex-direction: column;
  gap: 14px;
  overflow: hidden;
  -webkit-tap-highlight-color: transparent;
}

.asl-root *,
.asl-root *::before,
.asl-root *::after {
  box-sizing: border-box;
}

.asl-top {
  display: flex;
  align-items: center;
  gap: 14px;
  min-height: 52px;
  flex-shrink: 0;
}

.asl-avatar {
  width: 46px;
  height: 46px;
  border-radius: 50%;
  border: 2px solid rgba(255, 255, 255, 0.85);
  background: linear-gradient(160deg, #ffe7d6, #ffc4a0);
  color: #9a3412;
  font-weight: 700;
  font-size: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  box-shadow: 0 6px 16px rgba(120, 40, 10, 0.2);
  cursor: pointer;
  flex-shrink: 0;
}

.asl-tabs {
  flex: 1;
  display: flex;
  align-items: center;
  gap: 8px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
  padding: 4px 0;
}

.asl-tabs::-webkit-scrollbar {
  display: none;
}

.asl-tab {
  border: none;
  background: transparent;
  color: rgba(255, 255, 255, 0.88);
  font-size: 15px;
  font-weight: 600;
  padding: 10px 18px;
  border-radius: 999px;
  white-space: nowrap;
  cursor: pointer;
  transition: background 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.asl-tab--active {
  background: #ffffff;
  color: #111827;
  box-shadow: 0 8px 18px rgba(120, 40, 10, 0.18);
}

.asl-tab:active {
  transform: scale(0.96);
}

.asl-body {
  flex: 1;
  min-height: 0;
  display: flex;
  gap: 16px;
}

.asl-main {
  flex: 1;
  min-width: 0;
  display: grid;
  grid-template-columns: minmax(0, 1.15fr) minmax(0, 1fr);
  gap: 16px;
}

.asl-card {
  position: relative;
  border-radius: var(--asl-radius);
  background: var(--asl-card-solid);
  background: var(--asl-card);
  border: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: var(--asl-shadow);
  overflow: hidden;
  backdrop-filter: blur(18px);
  -webkit-backdrop-filter: blur(18px);
}

.asl-card--hero {
  display: flex;
  flex-direction: column;
  padding: 22px 22px 18px;
  cursor: pointer;
  transition: transform 0.16s ease, box-shadow 0.16s ease;
}

.asl-card--hero:active {
  transform: scale(0.985);
}

.asl-card__eyebrow {
  font-size: 13px;
  font-weight: 600;
  color: var(--asl-muted);
  margin-bottom: 6px;
}

.asl-card__title {
  margin: 0;
  font-size: 28px;
  line-height: 1.2;
  font-weight: 800;
  letter-spacing: 0.01em;
  color: #111827;
}

.asl-card__desc {
  margin: 8px 0 0;
  font-size: 14px;
  line-height: 1.45;
  color: var(--asl-muted);
  max-width: 22em;
}

.asl-pill {
  align-self: flex-start;
  margin-top: 14px;
  border: none;
  border-radius: 999px;
  padding: 10px 18px;
  font-size: 14px;
  font-weight: 700;
  color: #fff;
  background: linear-gradient(135deg, #ff7a45, #f4511e);
  box-shadow: 0 8px 18px rgba(244, 81, 30, 0.35);
  cursor: pointer;
}

.asl-card__art {
  margin-top: auto;
  align-self: center;
  width: min(72%, 280px);
  max-height: 46%;
  -o-object-fit: contain;
     object-fit: contain;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  -webkit-filter: drop-shadow(0 12px 20px rgba(120, 50, 20, 0.18));
          filter: drop-shadow(0 12px 20px rgba(120, 50, 20, 0.18));
}

.asl-card--tools {
  display: flex;
  flex-direction: column;
  padding: 18px 16px 14px;
}

.asl-card--tools .asl-card__title {
  font-size: 22px;
  margin: 0 0 12px 4px;
}

.asl-tool-list {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.asl-tool {
  display: flex;
  align-items: center;
  gap: 12px;
  width: 100%;
  border: none;
  text-align: left;
  border-radius: 20px;
  padding: 12px 14px;
  cursor: pointer;
  background: #fff;
  box-shadow: 0 4px 14px rgba(15, 23, 42, 0.06);
  transition: transform 0.12s ease, box-shadow 0.12s ease;
}

.asl-tool:active {
  transform: scale(0.98);
}

.asl-tool__icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  flex-shrink: 0;
  overflow: hidden;
  background: #fff;
  box-shadow: inset 0 -3px 0 rgba(0, 0, 0, 0.06);
}

.asl-tool__icon-img {
  width: 40px;
  height: 40px;
  -o-object-fit: contain;
     object-fit: contain;
  display: block;
}

.asl-tool__meta {
  flex: 1;
  min-width: 0;
}

.asl-tool__name {
  display: block;
  font-size: 16px;
  font-weight: 700;
  color: #111827;
}

.asl-tool__hint {
  display: block;
  margin-top: 2px;
  font-size: 12px;
  color: var(--asl-muted);
}

.asl-tool--blue .asl-tool__icon { background: #dbeafe; }
.asl-tool--rose .asl-tool__icon { background: #ffe4e6; }
.asl-tool--amber .asl-tool__icon { background: #fef3c7; }
.asl-tool--violet .asl-tool__icon { background: #ede9fe; }
.asl-tool--teal .asl-tool__icon { background: #ccfbf1; }

.asl-dock {
  width: 86px;
  flex-shrink: 0;
  border-radius: 28px;
  background: rgba(255, 255, 255, 0.78);
  border: 1px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 14px 30px rgba(120, 40, 10, 0.18);
  padding: 14px 10px;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 12px;
  backdrop-filter: blur(16px);
  -webkit-backdrop-filter: blur(16px);
  overflow-y: auto;
}

.asl-dock__btn {
  width: 58px;
  border: none;
  background: transparent;
  padding: 0;
  cursor: pointer;
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  color: #374151;
}

.asl-dock__glyph {
  width: 52px;
  height: 52px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 24px;
  overflow: hidden;
  background: transparent;
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.12);
}

.asl-dock__glyph-img {
  width: 52px;
  height: 52px;
  -o-object-fit: cover;
     object-fit: cover;
  display: block;
  border-radius: 16px;
}

.asl-dock__btn--store .asl-dock__glyph,
.asl-dock__btn--settings .asl-dock__glyph,
.asl-dock__btn--camera .asl-dock__glyph,
.asl-dock__btn--files .asl-dock__glyph,
.asl-dock__btn--more .asl-dock__glyph {
  background: transparent;
  box-shadow: 0 8px 16px rgba(15, 23, 42, 0.14);
}

.asl-dock__label {
  font-size: 11px;
  font-weight: 600;
  line-height: 1.2;
  max-width: 72px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.asl-dock__btn--store .asl-dock__glyph { background: linear-gradient(160deg, #60a5fa, #2563eb); color: #fff; }
.asl-dock__btn--settings .asl-dock__glyph { background: linear-gradient(160deg, #93c5fd, #3b82f6); color: #fff; }
.asl-dock__btn--camera .asl-dock__glyph { background: linear-gradient(160deg, #c4b5fd, #7c3aed); color: #fff; }
.asl-dock__btn--files .asl-dock__glyph { background: linear-gradient(160deg, #fde68a, #f59e0b); color: #fff; }
.asl-dock__btn--more .asl-dock__glyph { background: #e5e7eb; color: #374151; }

/* 竖屏：收成单列，侧栏改底栏 */
@media (max-width: 900px), (orientation: portrait) {
  .asl-body {
    flex-direction: column;
  }

  .asl-main {
    grid-template-columns: 1fr;
    overflow: auto;
  }

  .asl-card--hero {
    min-height: 280px;
  }

  .asl-dock {
    width: 100%;
    flex-direction: row;
    justify-content: space-around;
    border-radius: 22px;
    padding: 10px 8px;
    overflow-x: auto;
  }
}

/* 学生壳内：本页自带桌面，去掉底栏占位 */
.student-app-shell--asl .student-app-shell__main {
  padding-bottom: 0;
}

.student-app-shell--asl .student-app-shell__tabbar {
  display: none;
}

body.asl-launcher-active #root {
  background: transparent;
}
.voice-input-button {
  transition: all 0.3s ease;
}

.voice-input-button.recording {
  animation: pulse 1.5s ease-in-out infinite;
}

@keyframes pulse {
  0%, 100% {
    transform: scale(1);
    box-shadow: 0 0 0 0 rgba(255, 77, 79, 0.7);
  }
  50% {
    transform: scale(1.05);
    box-shadow: 0 0 0 10px rgba(255, 77, 79, 0);
  }
}

/* 知识库 · 手机端卡片内横向滑动：与整页上下滑共存，减少滚动穿透与卡顿 */

.kb-mobile-card-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  overscroll-behavior-x: contain;
  overscroll-behavior-y: auto;
  /* pan-x 单独使用会吞掉纵向手势，导致整页难以上下滑动 */
  touch-action: pan-x pan-y;
  scrollbar-width: thin;
}

.kb-mobile-card-scroll::-webkit-scrollbar {
  height: 4px;
}

.kb-mobile-card-scroll::-webkit-scrollbar-thumb {
  background: rgba(0, 0, 0, 0.18);
  border-radius: 4px;
}

/* 略减轻默认大阴影，降低滚动时重绘成本 */
.kb-mobile-kb-card.ant-card {
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.06);
}

.kb-mobile-kb-card .ant-card-body {
  /* 避免子项 margin 折叠影响滚动高度计算 */
  display: block;
}

.kb-mobile-card-row {
  display: flex;
  flex-direction: column;
  gap: 12px;
  width: 100%;
}

.kb-mobile-card-row-inner {
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  gap: 16px;
  min-width: -webkit-min-content;
  min-width: -moz-min-content;
  min-width: min-content;
}

.kb-mobile-col {
  flex: 0 0 auto;
}
/* this gets exported as style.css and can be used for the default theming */
/* these are the necessary styles for React Flow, they get used by base.css and style.css */
.react-flow {
  direction: ltr;
}
.react-flow__container {
  position: absolute;
  width: 100%;
  height: 100%;
  top: 0;
  left: 0;
}
.react-flow__pane {
  z-index: 1;
  cursor: -webkit-grab;
  cursor: grab;
}
.react-flow__pane.selection {
    cursor: pointer;
  }
.react-flow__pane.dragging {
    cursor: -webkit-grabbing;
    cursor: grabbing;
  }
.react-flow__viewport {
  transform-origin: 0 0;
  z-index: 2;
  pointer-events: none;
}
.react-flow__renderer {
  z-index: 4;
}
.react-flow__selection {
  z-index: 6;
}
.react-flow__nodesselection-rect:focus,
.react-flow__nodesselection-rect:focus-visible {
  outline: none;
}
.react-flow .react-flow__edges {
  pointer-events: none;
  overflow: visible;
}
.react-flow__edge-path,
.react-flow__connection-path {
  stroke: #b1b1b7;
  stroke-width: 1;
  fill: none;
}
.react-flow__edge {
  pointer-events: visibleStroke;
  cursor: pointer;
}
.react-flow__edge.animated path {
    stroke-dasharray: 5;
    animation: dashdraw 0.5s linear infinite;
  }
.react-flow__edge.animated path.react-flow__edge-interaction {
    stroke-dasharray: none;
    animation: none;
  }
.react-flow__edge.inactive {
    pointer-events: none;
  }
.react-flow__edge.selected,
  .react-flow__edge:focus,
  .react-flow__edge:focus-visible {
    outline: none;
  }
.react-flow__edge.selected .react-flow__edge-path,
  .react-flow__edge:focus .react-flow__edge-path,
  .react-flow__edge:focus-visible .react-flow__edge-path {
    stroke: #555;
  }
.react-flow__edge-textwrapper {
    pointer-events: all;
  }
.react-flow__edge-textbg {
    fill: white;
  }
.react-flow__edge .react-flow__edge-text {
    pointer-events: none;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
  }
.react-flow__connection {
  pointer-events: none;
}
.react-flow__connection .animated {
    stroke-dasharray: 5;
    animation: dashdraw 0.5s linear infinite;
  }
.react-flow__connectionline {
  z-index: 1001;
}
.react-flow__nodes {
  pointer-events: none;
  transform-origin: 0 0;
}
.react-flow__node {
  position: absolute;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
  pointer-events: all;
  transform-origin: 0 0;
  box-sizing: border-box;
  cursor: -webkit-grab;
  cursor: grab;
}
.react-flow__node.dragging {
    cursor: -webkit-grabbing;
    cursor: grabbing;
  }
.react-flow__nodesselection {
  z-index: 3;
  transform-origin: left top;
  pointer-events: none;
}
.react-flow__nodesselection-rect {
    position: absolute;
    pointer-events: all;
    cursor: -webkit-grab;
    cursor: grab;
  }
.react-flow__handle {
  position: absolute;
  pointer-events: none;
  min-width: 5px;
  min-height: 5px;
  width: 6px;
  height: 6px;
  background: #1a192b;
  border: 1px solid white;
  border-radius: 100%;
}
.react-flow__handle.connectionindicator {
    pointer-events: all;
    cursor: crosshair;
  }
.react-flow__handle-bottom {
    top: auto;
    left: 50%;
    bottom: -4px;
    transform: translate(-50%, 0);
  }
.react-flow__handle-top {
    left: 50%;
    top: -4px;
    transform: translate(-50%, 0);
  }
.react-flow__handle-left {
    top: 50%;
    left: -4px;
    transform: translate(0, -50%);
  }
.react-flow__handle-right {
    right: -4px;
    top: 50%;
    transform: translate(0, -50%);
  }
.react-flow__edgeupdater {
  cursor: move;
  pointer-events: all;
}
.react-flow__panel {
  position: absolute;
  z-index: 5;
  margin: 15px;
}
.react-flow__panel.top {
    top: 0;
  }
.react-flow__panel.bottom {
    bottom: 0;
  }
.react-flow__panel.left {
    left: 0;
  }
.react-flow__panel.right {
    right: 0;
  }
.react-flow__panel.center {
    left: 50%;
    transform: translateX(-50%);
  }
.react-flow__attribution {
  font-size: 10px;
  background: rgba(255, 255, 255, 0.5);
  padding: 2px 3px;
  margin: 0;
}
.react-flow__attribution a {
    text-decoration: none;
    color: #999;
  }
@keyframes dashdraw {
  from {
    stroke-dashoffset: 10;
  }
}
.react-flow__edgelabel-renderer {
  position: absolute;
  width: 100%;
  height: 100%;
  pointer-events: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}
.react-flow__edge.updating .react-flow__edge-path {
      stroke: #777;
    }
.react-flow__edge-text {
    font-size: 10px;
  }
.react-flow__node.selectable:focus,
  .react-flow__node.selectable:focus-visible {
    outline: none;
  }
.react-flow__node-default,
.react-flow__node-input,
.react-flow__node-output,
.react-flow__node-group {
  padding: 10px;
  border-radius: 3px;
  width: 150px;
  font-size: 12px;
  color: #222;
  text-align: center;
  border-width: 1px;
  border-style: solid;
  border-color: #1a192b;
  background-color: white;
}
.react-flow__node-default.selectable:hover, .react-flow__node-input.selectable:hover, .react-flow__node-output.selectable:hover, .react-flow__node-group.selectable:hover {
      box-shadow: 0 1px 4px 1px rgba(0, 0, 0, 0.08);
    }
.react-flow__node-default.selectable.selected,
    .react-flow__node-default.selectable:focus,
    .react-flow__node-default.selectable:focus-visible,
    .react-flow__node-input.selectable.selected,
    .react-flow__node-input.selectable:focus,
    .react-flow__node-input.selectable:focus-visible,
    .react-flow__node-output.selectable.selected,
    .react-flow__node-output.selectable:focus,
    .react-flow__node-output.selectable:focus-visible,
    .react-flow__node-group.selectable.selected,
    .react-flow__node-group.selectable:focus,
    .react-flow__node-group.selectable:focus-visible {
      box-shadow: 0 0 0 0.5px #1a192b;
    }
.react-flow__node-group {
  background-color: rgba(240, 240, 240, 0.25);
}
.react-flow__nodesselection-rect,
.react-flow__selection {
  background: rgba(0, 89, 220, 0.08);
  border: 1px dotted rgba(0, 89, 220, 0.8);
}
.react-flow__nodesselection-rect:focus,
  .react-flow__nodesselection-rect:focus-visible,
  .react-flow__selection:focus,
  .react-flow__selection:focus-visible {
    outline: none;
  }
.react-flow__controls {
  box-shadow: 0 0 2px 1px rgba(0, 0, 0, 0.08);
}
.react-flow__controls-button {
    border: none;
    background: #fefefe;
    border-bottom: 1px solid #eee;
    box-sizing: content-box;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 16px;
    height: 16px;
    cursor: pointer;
    -webkit-user-select: none;
       -moz-user-select: none;
            user-select: none;
    padding: 5px;
  }
.react-flow__controls-button:hover {
      background: #f4f4f4;
    }
.react-flow__controls-button svg {
      width: 100%;
      max-width: 12px;
      max-height: 12px;
    }
.react-flow__controls-button:disabled {
      pointer-events: none;
    }
.react-flow__controls-button:disabled svg {
        fill-opacity: 0.4;
      }
.react-flow__minimap {
  background-color: #fff;
}
.react-flow__minimap svg {
  display: block;
}
.react-flow__resize-control {
  position: absolute;
}
.react-flow__resize-control.left,
.react-flow__resize-control.right {
  cursor: ew-resize;
}
.react-flow__resize-control.top,
.react-flow__resize-control.bottom {
  cursor: ns-resize;
}
.react-flow__resize-control.top.left,
.react-flow__resize-control.bottom.right {
  cursor: nwse-resize;
}
.react-flow__resize-control.bottom.left,
.react-flow__resize-control.top.right {
  cursor: nesw-resize;
}
/* handle styles */
.react-flow__resize-control.handle {
  width: 4px;
  height: 4px;
  border: 1px solid #fff;
  border-radius: 1px;
  background-color: #3367d9;
  transform: translate(-50%, -50%);
}
.react-flow__resize-control.handle.left {
  left: 0;
  top: 50%;
}
.react-flow__resize-control.handle.right {
  left: 100%;
  top: 50%;
}
.react-flow__resize-control.handle.top {
  left: 50%;
  top: 0;
}
.react-flow__resize-control.handle.bottom {
  left: 50%;
  top: 100%;
}
.react-flow__resize-control.handle.top.left {
  left: 0;
}
.react-flow__resize-control.handle.bottom.left {
  left: 0;
}
.react-flow__resize-control.handle.top.right {
  left: 100%;
}
.react-flow__resize-control.handle.bottom.right {
  left: 100%;
}
/* line styles */
.react-flow__resize-control.line {
  border-color: #3367d9;
  border-width: 0;
  border-style: solid;
}
.react-flow__resize-control.line.left,
.react-flow__resize-control.line.right {
  width: 1px;
  transform: translate(-50%, 0);
  top: 0;
  height: 100%;
}
.react-flow__resize-control.line.left {
  left: 0;
  border-left-width: 1px;
}
.react-flow__resize-control.line.right {
  left: 100%;
  border-right-width: 1px;
}
.react-flow__resize-control.line.top,
.react-flow__resize-control.line.bottom {
  height: 1px;
  transform: translate(0, -50%);
  left: 0;
  width: 100%;
}
.react-flow__resize-control.line.top {
  top: 0;
  border-top-width: 1px;
}
.react-flow__resize-control.line.bottom {
  border-bottom-width: 1px;
  top: 100%;
}
/* 可视化工坊：出题栏 + 预览主舞台；审阅为右侧抽屉 */

.viz-studio-page {
  padding: 20px 24px 40px;
  max-width: 1480px;
  margin: 0 auto;
}

.viz-studio-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 16px;
  flex-wrap: wrap;
  margin-bottom: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.06);
}

.viz-studio-header-copy h3.ant-typography {
  margin: 0 0 4px;
  letter-spacing: 0.02em;
}

.viz-studio-header-copy .ant-typography {
  margin-bottom: 0;
}

.viz-studio-workbench {
  display: grid;
  grid-template-columns: minmax(280px, 320px) minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}

.viz-studio-col-generate {
  position: -webkit-sticky;
  position: sticky;
  top: 12px;
}

.viz-studio-col-generate .ant-card,
.viz-studio-col-preview .ant-card {
  border-radius: 16px;
  border-color: rgba(15, 23, 42, 0.08);
  box-shadow: 0 10px 32px rgba(15, 23, 42, 0.07);
}

.viz-studio-preview-card .ant-card-head {
  min-height: 48px;
}

.viz-studio-preview-card .ant-card-body {
  padding: 12px 14px 16px;
}

.viz-studio-preview-stage {
  position: relative;
  border-radius: 12px;
  overflow: hidden;
  background: #0f172a;
  box-shadow: inset 0 0 0 1px rgba(148, 163, 184, 0.22);
}

.viz-studio-preview-frame {
  width: 100%;
  height: min(78vh, 880px);
  min-height: 560px;
  border: 0;
  display: block;
  background: #0f172a;
}

.viz-studio-preview-stage--fs {
  position: fixed;
  inset: 10px;
  z-index: 1200;
  border-radius: 16px;
  box-shadow: 0 24px 80px rgba(15, 23, 42, 0.45);
}

.viz-studio-preview-stage--fs .viz-studio-preview-frame {
  height: calc(100vh - 20px);
  min-height: 0;
}

.viz-studio-fs-exit {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
}

.viz-studio-preview-empty {
  min-height: min(58vh, 520px);
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  padding: 36px 24px;
  border-radius: 12px;
  background:
    radial-gradient(1000px 260px at 50% -10%, rgba(56, 189, 248, 0.18), transparent 55%),
    linear-gradient(180deg, #0f172a 0%, #1e293b 100%);
  color: #94a3b8;
}

.viz-studio-mp4-link {
  margin-bottom: 8px;
}

.viz-review-panel {
  display: flex;
  flex-direction: column;
  min-height: 100%;
  height: 100%;
}

.viz-review-scroll {
  flex: 1;
  overflow: auto;
  padding: 16px 16px 8px;
}

.viz-review-footer {
  flex-shrink: 0;
  padding: 12px 16px 16px;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  background: #fff;
  box-shadow: 0 -8px 20px rgba(15, 23, 42, 0.04);
}

.viz-review-drawer .ant-drawer-body {
  height: 100%;
}

@media (max-width: 900px) {
  .viz-studio-page {
    padding: 16px;
  }

  .viz-studio-workbench {
    grid-template-columns: 1fr;
  }

  .viz-studio-col-generate {
    position: static;
  }

  .viz-studio-preview-frame {
    min-height: 420px;
    height: min(64vh, 640px);
  }
}
.selection-ai-result-float {
  position: absolute;
  z-index: 40;
  width: min(360px, calc(100% - 16px));
  max-height: min(58vh, 520px);
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid rgba(15, 23, 42, 0.12);
  border-radius: 12px;
  box-shadow: 0 12px 40px rgba(15, 23, 42, 0.18);
  overflow: hidden;
  pointer-events: auto;
}

.selection-ai-result-float-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 10px 12px;
  border-bottom: 1px solid rgba(15, 23, 42, 0.08);
  background: linear-gradient(180deg, #f8fafc 0%, #fff 100%);
  flex: 0 0 auto;
}

.selection-ai-result-float-title {
  font-size: 14px;
  font-weight: 600;
  color: #0f172a;
}

.selection-ai-result-float-body {
  padding: 12px;
  overflow-x: hidden;
  overflow-y: auto;
  flex: 1 1 auto;
  min-height: 0;
}

.selection-ai-result-float-foot {
  flex: 0 0 auto;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding: 10px 12px;
  border-top: 1px solid rgba(15, 23, 42, 0.08);
  background: #fff;
}

/* 单层展示：SVG 等比缩放到容器宽度，禁止内层滚动条 */
.selection-ai-result-svg {
  width: 100%;
  margin-top: 8px;
  background: #fafafa;
  border-radius: 8px;
  border: 1px solid #f0f0f0;
  overflow: hidden;
  line-height: 0;
}

.selection-ai-result-svg svg {
  display: block;
  width: 100% !important;
  max-width: 100%;
  height: auto !important;
  max-height: 200px;
}

/* 笔顺 hanzi-writer：保持固定尺寸，勿被结果区其它 svg 规则拉伸成「静态整字」 */
.selection-ai-result-float-body [aria-label^='汉字'] svg {
  width: auto !important;
  height: auto !important;
  max-width: none !important;
  max-height: none !important;
}
/**
 * 课堂 AI 品牌标题 — 指导 / 考考我共用
 */

.classroom-ai-brand {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
}

.classroom-ai-brand__badge {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #fff;
  background: linear-gradient(145deg, #ffd28a 0%, #ff9a4a 45%, #e84f28 100%);
  box-shadow:
    0 8px 18px rgba(232, 79, 40, 0.28),
    0 1px 0 rgba(255, 255, 255, 0.35) inset;
}

.classroom-ai-brand[data-intent='quiz'] .classroom-ai-brand__badge {
  background: linear-gradient(145deg, #ffb07a 0%, #ff6b3d 50%, #d63d1a 100%);
}

.classroom-ai-brand[data-intent='guide'] .classroom-ai-brand__badge {
  background: linear-gradient(145deg, #ffe0a8 0%, #ffb14a 42%, #e84f28 100%);
}

.classroom-ai-brand__texts {
  min-width: 0;
  flex: 1 1 auto;
}

.classroom-ai-brand__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.classroom-ai-brand__title {
  font-size: 17px;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #1a1a1a;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.classroom-ai-brand__chip {
  flex-shrink: 0;
  margin: 0;
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 8px;
  border-radius: 999px;
  color: var(--asl-accent-deep, #e84f28);
  background: rgba(232, 79, 40, 0.1);
  border: 1px solid rgba(232, 79, 40, 0.16);
}

.classroom-ai-brand__sub {
  display: block;
  margin-top: 4px;
  font-size: 12px;
  font-weight: 600;
  color: rgba(20, 24, 32, 0.58);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.classroom-ai-brand--compact .classroom-ai-brand__badge {
  width: 36px;
  height: 36px;
  border-radius: 12px;
  font-size: 16px;
}

.classroom-ai-brand--compact .classroom-ai-brand__title {
  font-size: 15px;
}

/* 教师授课台 Drawer / 学生推送 Modal 标题区 */
.classroom-ai-guide-modal .ant-modal-header,
.classroom-ai-guide-drawer .ant-drawer-header {
  background: linear-gradient(180deg, #fff8f3 0%, #ffffff 78%) !important;
  border-bottom: 1px solid rgba(20, 24, 32, 0.06) !important;
  padding-top: 14px !important;
  padding-bottom: 14px !important;
}

.classroom-ai-guide-modal .ant-modal-content {
  border-radius: 18px !important;
  overflow: hidden;
  box-shadow: 0 18px 48px rgba(20, 24, 32, 0.22) !important;
}

.classroom-ai-guide-modal .ant-modal-body {
  background: linear-gradient(180deg, #f7f5f2 0%, #ffffff 40%);
}
/**
 * 任务级 AI 对话独立窗 — 竖/横屏统一「悬浮窗口」感
 * Chrome 80：不用 color-mix / :has / conic-gradient
 */

body.classroom-task-ai-dialog-open .student-app-shell__tabbar {
  visibility: hidden !important;
  pointer-events: none !important;
}

.classroom-task-ai-dialog {
  position: fixed !important;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  z-index: 10000060;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: stretch;
  /* 竖屏也留边，形成窗口感；底边为 fixed 输入条预留 */
  padding: 10px 12px;
  padding-bottom: calc(96px + var(--cta-keyboard-inset, 0px));
  box-sizing: border-box;
  pointer-events: auto;
}

.classroom-task-ai-dialog__backdrop {
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  bottom: 0;
  background: rgba(18, 22, 30, 0.52);
  background-image: radial-gradient(
    ellipse farthest-corner at 50% 30%,
    rgba(232, 79, 40, 0.14) 0%,
    rgba(18, 22, 30, 0.58) 62%
  );
}

.classroom-task-ai-dialog__sheet {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: 920px;
  height: calc(100% - 4px);
  max-height: calc(100% - 4px);
  margin: 0 auto;
  background: #fff;
  border-radius: 22px;
  border: 1px solid rgba(255, 255, 255, 0.72);
  box-shadow:
    0 18px 48px rgba(20, 24, 32, 0.28),
    0 2px 0 rgba(255, 255, 255, 0.65) inset;
  overflow: hidden;
  flex: 1 1 auto;
  min-height: 0;
}

@media screen and (orientation: landscape) {
  .classroom-task-ai-dialog {
    padding: 12px 16px;
    padding-bottom: calc(96px + var(--cta-keyboard-inset, 0px));
  }

  .classroom-task-ai-dialog__sheet {
    height: calc(100% - 8px);
    max-height: calc(100% - 8px);
    border-radius: 24px;
  }
}

/* —— 顶栏品牌区 —— */
.classroom-task-ai-dialog__bar {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 12px 12px 12px 10px;
  border-bottom: 1px solid rgba(20, 24, 32, 0.06);
  background: linear-gradient(180deg, #fff8f3 0%, #ffffff 72%);
}

.classroom-task-ai-dialog__icon-btn {
  flex-shrink: 0;
  width: 40px;
  height: 40px;
  border: 1px solid rgba(20, 24, 32, 0.08);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.92);
  color: #2a2f3a;
  font-size: 16px;
  cursor: pointer;
  box-shadow: 0 2px 8px rgba(20, 24, 32, 0.06);
}

.classroom-task-ai-dialog__brand {
  flex: 1 1 auto;
  min-width: 0;
  display: flex;
  align-items: center;
  gap: 10px;
}

.classroom-task-ai-dialog__brand-badge {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border-radius: 16px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 20px;
  color: #fff;
  background: linear-gradient(
    145deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 48%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  box-shadow:
    0 8px 18px rgba(232, 79, 40, 0.28),
    0 1px 0 rgba(255, 255, 255, 0.35) inset;
}

.classroom-task-ai-dialog[data-intent='guide'] .classroom-task-ai-dialog__brand-badge {
  background: linear-gradient(145deg, #ffd28a 0%, #ff9a4a 45%, #e84f28 100%);
}

.classroom-task-ai-dialog[data-intent='quiz'] .classroom-task-ai-dialog__brand-badge {
  background: linear-gradient(145deg, #ffb07a 0%, #ff6b3d 50%, #d63d1a 100%);
}

.classroom-task-ai-dialog__titles {
  min-width: 0;
  flex: 1 1 auto;
}

.classroom-task-ai-dialog__title-row {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}

.classroom-task-ai-dialog__titles h2 {
  margin: 0;
  font-size: 17px;
  font-weight: 800;
  letter-spacing: 0.02em;
  color: #1a1a1a;
  line-height: 1.2;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.classroom-task-ai-dialog__title-chip {
  flex-shrink: 0;
  margin: 0;
  font-style: normal;
  font-size: 11px;
  font-weight: 700;
  line-height: 1;
  padding: 5px 8px;
  border-radius: 999px;
  color: var(--asl-accent-deep, #e84f28);
  background: rgba(232, 79, 40, 0.1);
  border: 1px solid rgba(232, 79, 40, 0.16);
}

.classroom-task-ai-dialog__titles p {
  margin: 4px 0 0;
  font-size: 12px;
  font-weight: 600;
  color: rgba(20, 24, 32, 0.58);
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.classroom-task-ai-dialog__body {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
  background: linear-gradient(180deg, #f7f5f2 0%, #f3f0eb 100%);
}

.classroom-task-ai-dialog__opening {
  flex-shrink: 0;
  padding: 12px 14px 8px;
  border-bottom: 1px solid rgba(20, 24, 32, 0.06);
  background: rgba(255, 255, 255, 0.72);
}

.classroom-task-ai-dialog__opening p {
  margin: 0 0 10px;
  font-size: 14px;
  line-height: 1.5;
  color: #333;
}

.classroom-task-ai-dialog__options {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.classroom-task-ai-dialog__options .ant-btn {
  border-radius: 999px;
}

.classroom-task-ai-dialog__messages {
  flex: 1 1 auto;
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  padding: 14px 12px 8px;
}

.classroom-task-ai-dialog__messages .enhanced-chat-messages {
  padding: 0 !important;
}

.classroom-task-ai-dialog__empty {
  padding: 28px 16px;
  text-align: left;
  color: rgba(20, 24, 32, 0.55);
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  gap: 12px;
}

.classroom-task-ai-dialog__empty-hint {
  display: block;
  padding-left: 54px;
  font-size: 13px;
  line-height: 1.45;
}

.classroom-task-ai-dialog__empty-badge {
  display: inline-flex;
  width: 56px;
  height: 56px;
  margin: 0 auto 14px;
  border-radius: 18px;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 24px;
  background: linear-gradient(
    145deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  box-shadow: 0 10px 22px rgba(232, 79, 40, 0.25);
}

.classroom-task-ai-dialog__empty strong {
  display: block;
  margin-bottom: 8px;
  font-size: 17px;
  color: #1a1a1a;
}

/* —— 对话头像 / 气泡（仅覆盖本窗内，不改 EnhancedChat 源文件） —— */
.classroom-task-ai-dialog .enhanced-chat-row {
  margin-bottom: 18px !important;
}

.classroom-task-ai-dialog .enhanced-chat-avatar {
  width: 46px !important;
  height: 46px !important;
  min-width: 46px !important;
  line-height: 46px !important;
  border-radius: 16px !important;
  border: 2px solid #fff !important;
  box-shadow:
    0 6px 14px rgba(20, 24, 32, 0.14),
    0 1px 0 rgba(255, 255, 255, 0.5) inset !important;
  font-weight: 700 !important;
  font-size: 18px !important;
}

.classroom-task-ai-dialog .enhanced-chat-avatar.ant-avatar {
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
}

.classroom-task-ai-dialog .enhanced-chat-avatar--user {
  background: linear-gradient(
    160deg,
    var(--asl-avatar-from, #ffe8d8) 0%,
    var(--asl-avatar-to, #ffc39a) 100%
  ) !important;
  color: var(--asl-avatar-ink, #9a3412) !important;
}

.classroom-task-ai-dialog .enhanced-chat-avatar--user .anticon {
  color: var(--asl-avatar-ink, #9a3412) !important;
  font-size: 20px !important;
}

.classroom-task-ai-dialog .enhanced-chat-avatar--ai {
  background: linear-gradient(
    150deg,
    #fff1e4 0%,
    #ffb07a 42%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  color: #fff !important;
  border-radius: 50% !important;
}

.classroom-task-ai-dialog .enhanced-chat-avatar--ai .anticon {
  color: #fff !important;
  font-size: 22px !important;
}

.classroom-task-ai-dialog .enhanced-chat-bubble--user {
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  color: #fff !important;
  border-radius: 18px 18px 6px 18px !important;
  box-shadow: 0 8px 18px rgba(232, 79, 40, 0.22) !important;
  padding: 12px 16px !important;
}

.classroom-task-ai-dialog .enhanced-chat-answer {
  background: #ffffff !important;
  border: 1px solid rgba(232, 79, 40, 0.1) !important;
  border-radius: 18px !important;
  box-shadow: 0 10px 24px rgba(20, 24, 32, 0.07) !important;
  padding: 16px 18px !important;
}

.classroom-task-ai-dialog .enhanced-chat-meta {
  margin-top: 10px !important;
}

/* —— 播放语音：粘土风胶囊按钮 —— */
.classroom-task-ai-dialog .enhanced-chat-audio {
  display: inline-flex !important;
  align-items: center !important;
  gap: 8px !important;
}

.classroom-task-ai-dialog .enhanced-chat-audio__btn.ant-btn,
.classroom-task-ai-dialog .enhanced-chat-audio__btn.ant-btn-text,
.classroom-task-ai-dialog .enhanced-chat-meta .enhanced-chat-audio__btn.ant-btn {
  height: 34px !important;
  padding: 0 12px 0 8px !important;
  border-radius: 999px !important;
  border: 1px solid rgba(232, 79, 40, 0.22) !important;
  background: linear-gradient(165deg, #ffffff 0%, #ffe8d8 100%) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  font-size: 13px !important;
  font-weight: 700 !important;
  line-height: 1 !important;
  box-shadow: 0 4px 12px rgba(232, 79, 40, 0.12) !important;
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
}

.classroom-task-ai-dialog .enhanced-chat-audio__btn.ant-btn .anticon {
  width: 22px;
  height: 22px;
  border-radius: 50%;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: 12px !important;
  color: #fff !important;
  background: linear-gradient(
    145deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  box-shadow: 0 2px 6px rgba(232, 79, 40, 0.28);
}

.classroom-task-ai-dialog .enhanced-chat-audio__btn.ant-btn-loading,
.classroom-task-ai-dialog .enhanced-chat-audio__btn.ant-btn[disabled] {
  opacity: 0.7 !important;
}

.classroom-task-ai-dialog .enhanced-chat-audio__controls {
  display: inline-flex !important;
  align-items: center !important;
  gap: 6px !important;
  padding: 4px 6px !important;
  border-radius: 999px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(232, 79, 40, 0.14) !important;
  box-shadow: 0 4px 12px rgba(20, 24, 32, 0.06) !important;
}

.classroom-task-ai-dialog .enhanced-chat-audio__slider {
  width: 88px !important;
  margin: 0 4px 0 0 !important;
}

.classroom-task-ai-dialog .enhanced-chat-audio__slider .ant-slider-track {
  background: var(--asl-accent, #ff6b3d) !important;
}

.classroom-task-ai-dialog .enhanced-chat-audio__slider .ant-slider-handle {
  border-color: var(--asl-accent-deep, #e84f28) !important;
}

.classroom-task-ai-dialog__compose {
  flex-shrink: 0;
  border-top: 1px solid rgba(20, 24, 32, 0.08);
  background: #fff;
  padding-bottom: 8px !important;
}

body.native-keyboard-open .classroom-task-ai-dialog__compose.native-keyboard-compose {
  padding-bottom: 8px !important;
}
/**
 * 固定贴底输入条：bottom 由 JS 写成键盘遮挡高度（visualViewport）
 */

.classroom-task-ai-compose {
  position: fixed !important;
  left: 12px;
  right: 12px;
  bottom: 0;
  z-index: 10000080;
  box-sizing: border-box;
  max-width: 920px;
  margin-left: auto;
  margin-right: auto;
  padding: 10px 12px calc(10px + env(safe-area-inset-bottom, 0px));
  background: #fff;
  border: 1px solid rgba(20, 24, 32, 0.08);
  border-bottom: none;
  border-radius: 18px 18px 0 0;
  box-shadow: 0 -8px 24px rgba(20, 24, 32, 0.14);
}

@media screen and (orientation: landscape) {
  .classroom-task-ai-compose {
    left: 16px;
    right: 16px;
  }
}

.classroom-task-ai-compose__preview {
  position: relative;
  display: inline-block;
  margin-bottom: 8px;
}

.classroom-task-ai-compose__preview img {
  max-width: 120px;
  max-height: 120px;
  border-radius: 12px;
  border: 1px solid rgba(20, 24, 32, 0.12);
}

.classroom-task-ai-compose__preview-x {
  position: absolute;
  top: -8px;
  right: -8px;
  width: 28px;
  height: 28px;
  border: none;
  border-radius: 50%;
  background: #fff;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.15);
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
}

.classroom-task-ai-compose__row {
  display: flex;
  align-items: flex-end;
  gap: 10px;
}

.classroom-task-ai-compose__icon-btn,
.classroom-task-ai-compose__send {
  flex-shrink: 0;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 14px;
  cursor: pointer;
  padding: 0;
  display: flex;
  align-items: center;
  justify-content: center;
}

.classroom-task-ai-compose__icon-btn {
  border: 1px solid rgba(232, 79, 40, 0.22);
  background: linear-gradient(165deg, #ffffff 0%, #ffe8d8 100%);
  box-shadow: 0 3px 10px rgba(232, 79, 40, 0.1);
}

.classroom-task-ai-compose__ta {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 44px;
  max-height: 120px;
  resize: none;
  border: 1px solid rgba(20, 24, 32, 0.12);
  border-radius: 14px;
  padding: 10px 12px;
  font-size: 16px;
  line-height: 1.4;
  color: #1a1a1a;
  background: #fff;
  outline: none;
  box-sizing: border-box;
}

.classroom-task-ai-compose__send {
  background: linear-gradient(135deg, #ff8f5c 0%, #ff6b3d 55%, #e84f28 100%);
  box-shadow: 0 4px 12px rgba(232, 79, 40, 0.28);
}

.classroom-task-ai-compose__send--off {
  opacity: 0.45;
  cursor: not-allowed;
}

.classroom-task-ai-compose__send:not(.classroom-task-ai-compose__send--off) {
  opacity: 1;
  cursor: pointer;
}

.classroom-task-ai-compose__hint {
  margin: 6px 0 0;
  font-size: 11px;
  color: rgba(20, 24, 32, 0.45);
  text-align: center;
}
/* 学生端课堂计时：固定顶栏，避免叠层挂在 fragment 底部看不见 */

.classroom-live-timer-chip {
  position: fixed;
  top: calc(12px + env(safe-area-inset-top, 0px));
  left: 50%;
  transform: translateX(-50%);
  z-index: 12000;
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 18px;
  border-radius: 999px;
  font-size: 18px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: #0f172a;
  background: rgba(255, 255, 255, 0.96);
  border: 2px solid #38bdf8;
  box-shadow: 0 10px 28px rgba(15, 23, 42, 0.18);
  pointer-events: none;
}

.classroom-live-timer-chip.is-urgent {
  color: #7f1d1d;
  border-color: #f87171;
  background: #fff1f2;
  animation: classroom-live-timer-pulse 1s ease-in-out infinite;
}

.classroom-live-timer-chip.is-ended {
  color: #fff;
  border-color: #dc2626;
  background: #dc2626;
  animation: none;
}

@keyframes classroom-live-timer-pulse {
  0%,
  100% {
    transform: translateX(-50%) scale(1);
  }
  50% {
    transform: translateX(-50%) scale(1.04);
  }
}
/**
 * 学生课堂页 · 玻璃卡片对齐 ASL
 * Chrome 80：不用 color-mix / :has / conic-gradient
 * 主题色读 --asl-*（页面 / StudentAppShell / html 注入）
 */

/* 对抗全局 * { max-width:100% } 对 flex 布局的破坏 */
.classroom-student-page,
.classroom-student-page .ant-layout,
.classroom-student-page .ant-layout-content,
.classroom-student-asl-scope {
  max-width: none;
  width: 100%;
}

.classroom-student-page {
  /* 默认暖橙 fallback；运行时由 data-asl-theme / 内联变量覆盖为五套色板 */
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 18px 40px rgba(160, 48, 18, 0.2);
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-avatar-from: #ffe8d8;
  --asl-avatar-to: #ffc39a;
  --asl-glass: rgba(255, 255, 255, 0.78);
  --asl-glass-border: rgba(255, 255, 255, 0.58);
  --asl-radius: 28px;
  --asl-radius-sm: 20px;
  --cs-radius: 26px;
  --cs-radius-sm: 18px;
  --cs-radius-xs: 12px;
  --cs-ink-border: rgba(90, 50, 30, 0.14);
  --cs-ink-divider: rgba(90, 50, 30, 0.08);
  --cs-shadow: 0 12px 32px rgba(90, 50, 30, 0.12);
  --cs-shadow-soft: 0 6px 18px rgba(90, 50, 30, 0.08);
  --cs-accent-wash: rgba(255, 107, 61, 0.1);
  --cs-accent-wash-strong: rgba(255, 107, 61, 0.16);
  --cs-accent-border: rgba(255, 107, 61, 0.28);
  --cs-accent-border-soft: rgba(255, 107, 61, 0.18);
  --cs-accent-glow: rgba(255, 143, 92, 0.4);
  --cs-accent-glow-soft: rgba(255, 143, 92, 0.22);
  --cs-accent-shadow: rgba(232, 79, 40, 0.28);
  --cs-accent-shadow-soft: rgba(232, 79, 40, 0.12);
  --cs-page-spot-a: rgba(255, 180, 120, 0.42);
  --cs-page-spot-b: rgba(255, 220, 180, 0.38);
  --cs-upload-from: #ffffff;
  --cs-upload-mid: var(--asl-card-surface);
  --cs-upload-to: var(--asl-avatar-from);
  --cs-divider: var(--cs-ink-divider);

  min-height: 100vh;
  min-height: 100dvh;
  color: var(--asl-ink);
  background:
    radial-gradient(ellipse 70% 45% at 12% 0%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 58%),
    linear-gradient(180deg, var(--asl-card) 0%, #f4f6f9 52%, #eef1f4 100%);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  -webkit-tap-highlight-color: transparent;
}

/* PC 课堂：跟学生学习中心同一套霁青蓝，不走平板 ASL 暖橙 */
.student-ui.classroom-student-page.classroom-student-page--pc {
  --asl-accent: var(--product-primary, #2563eb);
  --asl-accent-deep: var(--product-primary-hover, #1d4ed8);
  --asl-accent-soft: #60a5fa;
  --asl-ink: var(--product-text, #1e293b);
  --asl-ink-soft: var(--product-text-secondary, #64748b);
  --asl-card: var(--product-surface, #f0f4f8);
  --asl-card-surface: var(--product-surface-card, #ffffff);
  --asl-glow: rgba(37, 99, 235, 0.12);
  --asl-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-avatar-from: #dbeafe;
  --asl-avatar-to: #93c5fd;
  --asl-glass: rgba(255, 255, 255, 0.94);
  --asl-glass-border: rgba(37, 99, 235, 0.12);
  --asl-radius: 16px;
  --asl-radius-sm: 12px;
  --cs-radius: 16px;
  --cs-radius-sm: 12px;
  --cs-radius-xs: 8px;
  --cs-ink-border: rgba(30, 41, 59, 0.12);
  --cs-ink-divider: rgba(30, 41, 59, 0.08);
  --cs-shadow: 0 12px 32px rgba(30, 58, 95, 0.1);
  --cs-shadow-soft: 0 6px 18px rgba(30, 58, 95, 0.08);
  --cs-accent-wash: rgba(37, 99, 235, 0.1);
  --cs-accent-wash-strong: rgba(37, 99, 235, 0.16);
  --cs-accent-border: rgba(37, 99, 235, 0.28);
  --cs-accent-border-soft: rgba(37, 99, 235, 0.18);
  --cs-accent-glow: rgba(56, 189, 248, 0.35);
  --cs-accent-glow-soft: rgba(56, 189, 248, 0.18);
  --cs-accent-shadow: rgba(37, 99, 235, 0.22);
  --cs-accent-shadow-soft: rgba(37, 99, 235, 0.1);
  --cs-page-spot-a: rgba(37, 99, 235, 0.12);
  --cs-page-spot-b: rgba(14, 165, 233, 0.1);
  --cs-upload-from: #ffffff;
  --cs-upload-mid: var(--asl-card-surface);
  --cs-upload-to: var(--asl-avatar-from);
  --cs-divider: var(--cs-ink-divider);
  color: var(--product-text, #1e293b);
  background: var(--product-surface, #f0f4f8);
}

.classroom-student-page--pc .classroom-student-header-card.ant-card {
  background: var(
    --product-gradient-hero,
    linear-gradient(135deg, #1e3a5f 0%, #2563eb 52%, #0ea5e9 100%)
  );
}

/* 五套主题：data-asl-theme 全量兜底（对齐桌面 launcher，不依赖内联注入） */
.classroom-student-page[data-asl-theme='sunset'],
.classroom-student-asl-scope[data-asl-theme='sunset'],
html[data-classroom-asl-theme='sunset'] {
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 18px 40px rgba(160, 48, 18, 0.2);
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-avatar-from: #ffe8d8;
  --asl-avatar-to: #ffc39a;
  --cs-accent-wash: rgba(255, 107, 61, 0.1);
  --cs-accent-wash-strong: rgba(255, 107, 61, 0.16);
  --cs-accent-border: rgba(255, 107, 61, 0.28);
  --cs-accent-border-soft: rgba(255, 107, 61, 0.18);
  --cs-accent-glow: rgba(255, 143, 92, 0.4);
  --cs-accent-glow-soft: rgba(255, 143, 92, 0.22);
  --cs-accent-shadow: rgba(232, 79, 40, 0.28);
  --cs-accent-shadow-soft: rgba(232, 79, 40, 0.12);
  --cs-page-spot-a: rgba(255, 180, 120, 0.42);
  --cs-page-spot-b: rgba(255, 220, 180, 0.38);
  --cs-ink-border: rgba(90, 50, 30, 0.14);
  --cs-ink-divider: rgba(90, 50, 30, 0.08);
}

.classroom-student-page[data-asl-theme='azure'],
.classroom-student-asl-scope[data-asl-theme='azure'],
html[data-classroom-asl-theme='azure'] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-card-surface: #f0f6ff;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 18px 40px rgba(30, 64, 175, 0.2);
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-avatar-from: #dbeafe;
  --asl-avatar-to: #93c5fd;
  --cs-accent-wash: rgba(59, 130, 246, 0.1);
  --cs-accent-wash-strong: rgba(59, 130, 246, 0.16);
  --cs-accent-border: rgba(59, 130, 246, 0.28);
  --cs-accent-border-soft: rgba(59, 130, 246, 0.18);
  --cs-accent-glow: rgba(96, 165, 250, 0.4);
  --cs-accent-glow-soft: rgba(96, 165, 250, 0.22);
  --cs-accent-shadow: rgba(29, 78, 216, 0.28);
  --cs-accent-shadow-soft: rgba(29, 78, 216, 0.12);
  --cs-page-spot-a: rgba(96, 165, 250, 0.35);
  --cs-page-spot-b: rgba(147, 197, 253, 0.32);
  --cs-ink-border: rgba(30, 58, 95, 0.14);
  --cs-ink-divider: rgba(30, 58, 95, 0.08);
}

.classroom-student-page[data-asl-theme='tech'],
.classroom-student-asl-scope[data-asl-theme='tech'],
html[data-classroom-asl-theme='tech'] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-card-surface: #ecfeff;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 18px 40px rgba(14, 116, 144, 0.22);
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-avatar-from: #cffafe;
  --asl-avatar-to: #67e8f9;
  --cs-accent-wash: rgba(8, 145, 178, 0.1);
  --cs-accent-wash-strong: rgba(8, 145, 178, 0.16);
  --cs-accent-border: rgba(8, 145, 178, 0.28);
  --cs-accent-border-soft: rgba(8, 145, 178, 0.18);
  --cs-accent-glow: rgba(34, 211, 238, 0.35);
  --cs-accent-glow-soft: rgba(34, 211, 238, 0.2);
  --cs-accent-shadow: rgba(14, 116, 144, 0.28);
  --cs-accent-shadow-soft: rgba(14, 116, 144, 0.12);
  --cs-page-spot-a: rgba(34, 211, 238, 0.32);
  --cs-page-spot-b: rgba(103, 232, 249, 0.28);
  --cs-ink-border: rgba(15, 23, 42, 0.14);
  --cs-ink-divider: rgba(15, 23, 42, 0.08);
}

.classroom-student-page[data-asl-theme='emerald'],
.classroom-student-asl-scope[data-asl-theme='emerald'],
html[data-classroom-asl-theme='emerald'] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-card-surface: #ecfdf5;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 18px 40px rgba(4, 120, 87, 0.2);
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-avatar-from: #d1fae5;
  --asl-avatar-to: #6ee7b7;
  --cs-accent-wash: rgba(16, 185, 129, 0.1);
  --cs-accent-wash-strong: rgba(16, 185, 129, 0.16);
  --cs-accent-border: rgba(16, 185, 129, 0.28);
  --cs-accent-border-soft: rgba(16, 185, 129, 0.18);
  --cs-accent-glow: rgba(52, 211, 153, 0.35);
  --cs-accent-glow-soft: rgba(52, 211, 153, 0.2);
  --cs-accent-shadow: rgba(4, 120, 87, 0.28);
  --cs-accent-shadow-soft: rgba(4, 120, 87, 0.12);
  --cs-page-spot-a: rgba(52, 211, 153, 0.32);
  --cs-page-spot-b: rgba(110, 231, 183, 0.28);
  --cs-ink-border: rgba(6, 78, 59, 0.14);
  --cs-ink-divider: rgba(6, 78, 59, 0.08);
}

.classroom-student-page[data-asl-theme='violet'],
.classroom-student-asl-scope[data-asl-theme='violet'],
html[data-classroom-asl-theme='violet'] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-card-surface: #f5f3ff;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 18px 40px rgba(91, 33, 182, 0.2);
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-avatar-from: #ede9fe;
  --asl-avatar-to: #c4b5fd;
  --cs-accent-wash: rgba(139, 92, 246, 0.1);
  --cs-accent-wash-strong: rgba(139, 92, 246, 0.16);
  --cs-accent-border: rgba(139, 92, 246, 0.28);
  --cs-accent-border-soft: rgba(139, 92, 246, 0.18);
  --cs-accent-glow: rgba(167, 139, 250, 0.35);
  --cs-accent-glow-soft: rgba(167, 139, 250, 0.2);
  --cs-accent-shadow: rgba(109, 40, 217, 0.28);
  --cs-accent-shadow-soft: rgba(109, 40, 217, 0.12);
  --cs-page-spot-a: rgba(167, 139, 250, 0.32);
  --cs-page-spot-b: rgba(196, 181, 253, 0.28);
  --cs-ink-border: rgba(46, 16, 101, 0.14);
  --cs-ink-divider: rgba(46, 16, 101, 0.08);
}

.classroom-student-asl-scope {
  min-height: 100%;
}

/* 对话专注：外壳也实色，避免下层渐变透过半透明面板造成「遮罩糊字」 */
.classroom-student-asl-scope--compose,
.classroom-student-asl-scope[data-ai-compose='1'] {
  background: #fff !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-filter: none !important;
  filter: none !important;
}

/**
 * 学生底栏玻璃模糊在 Android WebView 会污染整页合成层 → 输入区像蒙了遮罩。
 * 课堂桌面强制取消 blur；对话专注时彻底隐藏底栏。
 */
body.classroom-student-desk-active .student-app-shell__tabbar {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  background: #ffffff !important;
  opacity: 1 !important;
  -webkit-filter: none !important;
  filter: none !important;
}

body.classroom-ai-compose-active .student-app-shell__tabbar {
  display: none !important;
  pointer-events: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  opacity: 0 !important;
}

body.classroom-ai-compose-active .student-app-shell__main,
body.classroom-student-desk-active .student-app-shell__main {
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-filter: none !important;
  filter: none !important;
}

body.classroom-ai-compose-active,
body.classroom-ai-compose-active #root {
  background: #fff !important;
}

.classroom-student-accent-icon {
  color: var(--asl-accent) !important;
}

.classroom-student-content {
  padding: 20px 16px 24px;
  max-width: 1200px;
  margin: 0 auto;
  box-sizing: border-box;
}

.classroom-student-page .ant-btn-primary:not(.ant-btn-dangerous) {
  background: linear-gradient(135deg, var(--asl-accent-soft) 0%, var(--asl-accent) 55%, var(--asl-accent-deep) 100%);
  border-color: var(--asl-accent-deep);
  border-radius: 16px;
  box-shadow: 0 6px 16px var(--cs-ink-border);
}

.classroom-student-page .ant-btn-primary:not(.ant-btn-dangerous):hover,
.classroom-student-page .ant-btn-primary:not(.ant-btn-dangerous):focus {
  background: linear-gradient(135deg, var(--asl-accent) 0%, var(--asl-accent-deep) 100%);
  border-color: var(--asl-accent-deep);
}

.classroom-student-page .ant-btn-default {
  border-radius: 14px;
}

/* —— 加入课堂 —— */
.classroom-student-page--join .classroom-student-join-shell {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 20px 16px;
  box-sizing: border-box;
}

.classroom-student-join-layout {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  gap: 20px;
  width: 100%;
  max-width: 520px;
  animation: classroom-student-rise 0.42s ease both;
}

.classroom-student-join-brand {
  text-align: center;
  padding: 4px 8px 0;
}

.classroom-student-join-brand-kicker {
  margin: 0 0 8px;
  font-size: 13px;
  font-weight: 600;
  letter-spacing: 0.12em;
  color: var(--asl-accent-deep);
}

.classroom-student-join-brand-title {
  margin: 0 0 8px;
  font-size: 32px;
  line-height: 1.15;
  font-weight: 700;
  color: var(--asl-ink);
}

.classroom-student-join-brand-sub {
  margin: 0;
  font-size: 14px;
  line-height: 1.5;
  color: var(--asl-ink-soft);
}

.classroom-student-join-card.ant-card {
  max-width: 500px;
  width: 100%;
  border-radius: var(--asl-radius) !important;
  box-shadow: var(--asl-shadow) !important;
  background: var(--asl-glass) !important;
  border: 1px solid var(--asl-glass-border) !important;
  overflow: hidden;
  /* 旧 Android System WebView：backdrop-filter 易整页白屏/幽灵遮罩 */
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
  position: relative;
}

html.classroom-focus-shell .classroom-student-join-card.ant-card,
body.classroom-focus-shell .classroom-student-join-card.ant-card {
  background: #fff !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
}

.classroom-student-join-card.ant-card::before {
  content: '';
  display: block;
  height: 4px;
  background: linear-gradient(
    90deg,
    var(--asl-accent-soft) 0%,
    var(--asl-accent) 50%,
    var(--asl-accent-deep) 100%
  );
}

.classroom-student-join-card > .ant-card-body {
  background: linear-gradient(180deg, var(--asl-card-surface) 0%, rgba(255, 255, 255, 0.92) 48%);
  padding: 22px 22px 24px !important;
}

.classroom-student-join-form {
  display: flex;
  flex-direction: column;
  gap: 16px;
  width: 100%;
}

.classroom-student-join-card-head {
  text-align: center;
  margin-bottom: 2px;
}

.classroom-student-join-card-icon {
  display: block;
  margin: 0 auto 10px;
  font-size: 42px;
  line-height: 1;
  color: var(--asl-accent);
}

.classroom-student-join-card-title {
  margin-bottom: 4px !important;
  color: var(--asl-ink) !important;
}

.classroom-student-join-card-desc {
  margin-bottom: 0 !important;
  color: var(--asl-ink-soft) !important;
}

.classroom-student-join-field {
  display: flex;
  flex-direction: column;
  gap: 8px;
  width: 100%;
}

.classroom-student-join-field-title {
  color: var(--asl-ink);
  font-size: 14px;
}

.classroom-student-join-code-row {
  display: flex;
  align-items: stretch;
  gap: 10px;
  width: 100%;
  position: relative;
  z-index: 1;
  overflow: visible;
}

/* 限制输入框宽度，避免全局 width:100%!important 盖住扫码按钮 */
.classroom-student-join-code-input-wrap--solo {
  flex: 1 1 100%;
  width: 100%;
  max-width: 100%;
}

.classroom-student-join-code-input-wrap {
  flex: 1 1 auto;
  min-width: 0;
  max-width: 100%;
  overflow: hidden;
  position: relative;
  z-index: 1;
}

.classroom-student-join-input--code {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.classroom-student-join-code-input-wrap .ant-input,
.classroom-student-join-code-input-wrap .ant-input-affix-wrapper {
  width: 100% !important;
  max-width: 100% !important;
  min-width: 0 !important;
}

.classroom-student-join-card .ant-input-affix-wrapper,
.classroom-student-join-card .ant-input {
  border-radius: 14px !important;
  border-color: var(--cs-ink-border);
}

.classroom-student-join-card .ant-input-affix-wrapper-focused,
.classroom-student-join-card .ant-input:focus,
.classroom-student-join-card .ant-input-focused {
  border-color: var(--asl-accent) !important;
  box-shadow: 0 0 0 2px var(--cs-accent-wash) !important;
}

/* 原生 button，避免旧 WebView 上 Ant Button 点击被吞 */
.classroom-student-join-scan-btn {
  flex: 0 0 auto;
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-width: 96px;
  width: auto;
  height: 40px;
  padding: 0 14px;
  margin: 0;
  border-radius: 14px;
  border: 1px solid var(--cs-accent-border);
  background: var(--cs-accent-wash);
  color: var(--asl-accent-deep);
  font-size: 15px;
  font-weight: 600;
  line-height: 1;
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  position: relative;
  z-index: 5;
  pointer-events: auto !important;
  -webkit-tap-highlight-color: var(--cs-accent-border);
  box-shadow: none;
  touch-action: manipulation;
}

.classroom-student-join-scan-btn .anticon {
  color: var(--asl-accent);
  font-size: 18px;
  pointer-events: none;
}

.classroom-student-join-scan-btn:hover,
.classroom-student-join-scan-btn:focus {
  border-color: var(--asl-accent);
  color: var(--asl-accent-deep);
  background: rgba(255, 255, 255, 0.95);
  outline: none;
}

.classroom-student-join-scan-btn:active {
  transform: scale(0.98);
}

.classroom-student-join-scan-btn-block.ant-btn {
  margin-top: 10px;
  height: 44px !important;
  border-radius: 14px !important;
  border: 1px solid var(--cs-accent-border) !important;
  background: var(--cs-accent-wash) !important;
  color: var(--asl-accent-deep) !important;
  font-weight: 600;
  position: relative;
  z-index: 5;
  pointer-events: auto !important;
}

.classroom-student-join-scan-btn-block.ant-btn .anticon {
  color: var(--asl-accent) !important;
}

.classroom-student-join-switch-code.ant-btn-link {
  padding: 0;
  height: auto;
  margin: 4px 0 8px;
  font-size: 13px;
  color: var(--asl-accent-deep, #e84f28) !important;
}

.classroom-student-join-retry.ant-checkbox-wrapper {
  color: var(--asl-ink-soft);
  font-size: 13px;
}

.classroom-student-join-retry .ant-checkbox-checked .ant-checkbox-inner {
  background-color: var(--asl-accent);
  border-color: var(--asl-accent-deep);
}

.classroom-student-join-submit.ant-btn-primary {
  width: 100% !important;
  height: 48px !important;
  border-radius: 999px !important;
  font-size: 16px;
  font-weight: 600;
  margin-top: 4px;
  color: #fff !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
}

.classroom-student-join-submit.ant-btn-primary[disabled],
.classroom-student-join-submit.ant-btn-primary.ant-btn-disabled {
  color: #fff !important;
  opacity: 0.55;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft) 0%,
    var(--asl-accent) 55%,
    var(--asl-accent-deep) 100%
  ) !important;
  border-color: var(--asl-accent-deep) !important;
}

/* 横屏加入：整页上下居中 */
@media screen and (orientation: landscape) {
  .classroom-student-page--join .classroom-student-join-shell,
  .classroom-student-page--landscape.classroom-student-page--join .classroom-student-join-shell {
    display: flex;
    align-items: center;
    justify-content: center;
    min-height: 100vh;
    min-height: 100dvh;
    padding: 16px 24px;
    box-sizing: border-box;
  }

  .classroom-student-page--join .classroom-student-join-layout,
  .classroom-student-page--landscape.classroom-student-page--join .classroom-student-join-layout {
    width: 100%;
    margin: 0 auto;
  }

  .student-app-shell .classroom-student-page--join .classroom-student-join-shell,
  .student-app-shell__main .classroom-student-page--join .classroom-student-join-shell {
    min-height: calc(100vh - 64px);
    min-height: calc(100dvh - 64px);
    padding-bottom: 12px;
  }
}

/* 宽横屏加入：左品牌文案 + 右玻璃卡（ASL 登录同构图） */
@media screen and (orientation: landscape) and (min-width: 800px) {
  .classroom-student-join-layout,
  .classroom-student-page--landscape .classroom-student-join-layout {
    flex-direction: row;
    align-items: center;
    max-width: 960px;
    gap: 36px;
  }

  .classroom-student-join-brand,
  .classroom-student-page--landscape .classroom-student-join-brand {
    flex: 1 1 42%;
    text-align: left;
    padding: 12px 8px;
    margin-right: 12px;
  }

  .classroom-student-join-brand-title,
  .classroom-student-page--landscape .classroom-student-join-brand-title {
    font-size: 40px;
  }

  .classroom-student-join-brand-sub,
  .classroom-student-page--landscape .classroom-student-join-brand-sub {
    max-width: 360px;
  }

  .classroom-student-join-card.ant-card,
  .classroom-student-page--landscape .classroom-student-join-card.ant-card {
    flex: 0 1 440px;
    max-width: 440px;
    width: 100%;
  }

  .classroom-student-join-form {
    gap: 14px;
  }

  .classroom-student-join-code-row {
    flex-direction: row;
  }

  .classroom-student-join-scan-btn {
    min-width: 96px;
    height: 40px;
  }
}

/* 窄横屏加入（手机横放）：仍单列居中，压缩内边距 */
@media screen and (orientation: landscape) and (max-width: 799px) {
  .classroom-student-page--join .classroom-student-join-layout {
    max-width: 520px;
    gap: 12px;
  }

  .classroom-student-join-brand-title {
    font-size: 26px;
  }

  .classroom-student-join-card > .ant-card-body {
    padding: 14px 16px 16px !important;
  }

  .classroom-student-join-card-icon {
    font-size: 32px;
    margin-bottom: 6px;
  }

  .classroom-student-join-form {
    gap: 12px;
  }
}

/* 竖屏加入：整块上下居中 */
@media screen and (orientation: portrait) {
  .classroom-student-page--join .classroom-student-join-shell {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 16px 14px;
    min-height: 100vh;
    min-height: 100dvh;
    box-sizing: border-box;
  }

  .classroom-student-page--join .classroom-student-join-layout {
    gap: 14px;
    max-width: 520px;
    width: 100%;
    margin: 0 auto;
  }

  .classroom-student-join-brand {
    padding: 0 4px;
  }

  .classroom-student-join-brand-kicker {
    margin-bottom: 6px;
    font-size: 12px;
  }

  .classroom-student-join-brand-title {
    font-size: 28px;
    margin-bottom: 6px;
  }

  .classroom-student-join-brand-sub {
    font-size: 13px;
  }

  .classroom-student-join-card.ant-card {
    max-width: 100%;
  }

  .classroom-student-join-card > .ant-card-body {
    padding: 18px 16px 20px !important;
  }

  .classroom-student-join-form {
    gap: 14px;
  }

  .classroom-student-join-card-icon {
    font-size: 36px;
    margin-bottom: 8px;
  }

  .classroom-student-join-code-row {
    flex-direction: row;
    gap: 8px;
  }

  .classroom-student-join-scan-btn {
    min-width: 88px;
    height: 40px;
    padding: 0 12px;
  }

  .classroom-student-join-submit.ant-btn-primary {
    height: 48px !important;
    margin-top: 2px;
  }

  .student-app-shell .classroom-student-page--join .classroom-student-join-shell,
  .student-app-shell__main .classroom-student-page--join .classroom-student-join-shell {
    /* 底栏占用时仍尽量视觉居中 */
    min-height: calc(100vh - 72px);
    min-height: calc(100dvh - 72px);
    padding-bottom: 16px;
  }
}

/* 矮横屏加入：压缩品牌与卡片内边距，避免裁切 */
@media screen and (orientation: landscape) and (max-height: 720px) {
  .classroom-student-page--join .classroom-student-join-shell {
    padding: 12px 16px;
  }

  .classroom-student-join-brand-title {
    font-size: 30px;
  }

  .classroom-student-join-brand-sub {
    font-size: 13px;
  }

  .classroom-student-join-card > .ant-card-body {
    padding: 16px 18px 18px !important;
  }

  .classroom-student-join-form {
    gap: 12px;
  }

  .classroom-student-join-scan-btn {
    min-width: 84px;
    height: 38px;
  }

  .classroom-student-join-submit.ant-btn-primary {
    height: 44px !important;
  }
}

/* 窄竖屏：扫码改整行，更易点 */
@media screen and (orientation: portrait) and (max-width: 420px) {
  .classroom-student-join-code-row {
    flex-direction: column;
  }

  .classroom-student-join-scan-btn {
    width: 100%;
    min-width: 0;
    height: 42px;
  }
}

/* —— 已加入：顶栏 + 主区 —— */
.classroom-student-header-card.ant-card {
  width: 100%;
  max-width: 100% !important;
  margin-bottom: 16px;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft) 0%,
    var(--asl-accent) 48%,
    var(--asl-accent-deep) 100%
  );
  border: none !important;
  color: #fff;
  border-radius: var(--cs-radius) !important;
  box-shadow: var(--cs-shadow);
  overflow: hidden;
  animation: classroom-student-rise 0.4s ease both;
}

.classroom-student-header-card > .ant-card-body {
  padding: 18px 20px !important;
  width: 100%;
  max-width: 100% !important;
}

.classroom-student-header-row {
  display: flex;
  flex-direction: row;
  justify-content: space-between;
  align-items: center;
  flex-wrap: wrap;
  gap: 12px 16px;
  width: 100%;
  max-width: 100%;
}

.classroom-student-header-main {
  flex: 1 1 220px;
  min-width: 0;
  max-width: 100%;
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important;
  -webkit-text-orientation: mixed !important;
          text-orientation: mixed !important;
}

.classroom-student-header-title {
  margin: 0 !important;
  color: #fff !important;
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important;
  -webkit-text-orientation: mixed !important;
          text-orientation: mixed !important;
  white-space: normal !important;
  word-break: break-word;
  overflow-wrap: anywhere;
  width: 100%;
  max-width: 100%;
  line-height: 1.35 !important;
}

.classroom-student-header-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  margin-top: 8px;
  width: 100%;
  max-width: 100%;
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important;
}

.classroom-student-header-meta .ant-tag {
  color: #fff;
  border-color: rgba(255, 255, 255, 0.5);
  background: rgba(255, 255, 255, 0.22);
  -webkit-margin-end: 0 !important;
          margin-inline-end: 0 !important;
}

.classroom-student-header-meta-text {
  color: rgba(255, 255, 255, 0.92) !important;
  font-size: 14px;
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important;
  white-space: nowrap;
}

.classroom-student-header-actions {
  display: flex;
  flex-direction: column;
  gap: 8px;
  flex: 0 1 auto;
  min-width: 0;
  max-width: 100%;
}

.classroom-student-header-emotion {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-width: 0;
}

.classroom-student-header-emotion-select.ant-select {
  width: 132px !important;
  min-width: 120px;
  max-width: 45%;
}

.classroom-student-header-emotion-note.ant-input {
  flex: 1 1 auto;
  width: auto !important;
  min-width: 0 !important;
  max-width: none !important;
  border-radius: 12px !important;
}

.classroom-student-header-emotion .ant-select-selector {
  border-radius: 12px !important;
}

.classroom-student-header-btns {
  display: flex;
  gap: 8px;
  width: 100%;
}

.classroom-student-header-btns .ant-btn {
  flex: 1 1 auto;
  color: #fff;
  border-color: rgba(255, 255, 255, 0.85);
  background: rgba(255, 255, 255, 0.16);
  border-radius: 14px;
}

.classroom-student-header-btns .ant-btn:hover,
.classroom-student-header-btns .ant-btn:focus {
  color: #fff !important;
  border-color: #fff !important;
  background: rgba(255, 255, 255, 0.28) !important;
}

/* 对抗全局 * { max-width:100% } 造成的顶栏单字竖排 */
.classroom-student-page--joined .classroom-student-header-card,
.classroom-student-page--joined .classroom-student-header-card *,
.classroom-student-page--joined .classroom-student-header-row,
.classroom-student-page--joined .classroom-student-header-main,
.classroom-student-page--joined .classroom-student-header-actions {
  max-width: 100%;
}

.classroom-student-page--joined .classroom-student-header-title,
.classroom-student-page--joined .classroom-student-header-meta,
.classroom-student-page--joined .classroom-student-header-meta-text,
.classroom-student-page--joined .classroom-student-header-main .ant-typography {
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important;
  -webkit-text-orientation: mixed !important;
          text-orientation: mixed !important;
  direction: ltr !important;
}

.classroom-student-main-card.ant-card {
  border-radius: var(--cs-radius) !important;
  border: 1px solid var(--asl-glass-border) !important;
  box-shadow: var(--cs-shadow) !important;
  overflow: hidden;
  background: var(--asl-glass) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  animation: classroom-student-rise 0.48s ease 0.06s both;
}

.classroom-student-main-card > .ant-card-body {
  background: var(--asl-card-surface);
  padding: 16px !important;
}

.classroom-student-workspace {
  display: flex;
  flex-direction: column;
  min-height: calc(100vh - 280px);
  min-height: calc(100dvh - 280px);
}

/* PC 原工作台：课堂信息 | 当前任务 | AI 助教，一次只看一条任务 */
.classroom-student-workspace-inner.classroom-student-workspace-3col {
  display: flex;
  flex-direction: row;
  align-items: stretch;
  gap: 12px;
  min-height: 0;
  width: 100%;
}

.classroom-student-lesson-sidebar {
  flex-shrink: 0;
  width: 240px;
  max-width: 28%;
  min-width: 200px;
}

.classroom-student-lesson-sidebar-toggle,
.classroom-student-lesson-rail {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  width: 100%;
  margin-top: 8px;
  padding: 8px 10px;
  border: 1px solid var(--cs-ink-border, #e8e8e8);
  border-radius: 10px;
  background: #fff;
  color: var(--asl-ink, #333);
  cursor: pointer;
}

.classroom-student-lesson-rail {
  flex-direction: column;
  flex-shrink: 0;
  width: 44px;
  min-width: 44px;
  max-width: 44px;
  margin-top: 0;
  padding: 12px 6px;
}

.classroom-student-lesson-rail-text {
  font-size: 12px;
  line-height: 1.2;
  text-align: center;
}

.classroom-student-workspace-center-row {
  flex: 1 1 auto;
  display: flex;
  min-width: 0;
}

.classroom-student-workspace-main {
  flex: 1 1 auto;
  min-width: 0;
}

.classroom-student-workspace-main--split {
  display: flex;
  gap: 12px;
}

.classroom-student-workspace-main-taskpane {
  flex: 1 1 auto;
  min-width: 0;
}

.classroom-student-workspace-main-aipane {
  flex-shrink: 0;
  width: 38%;
  min-width: 280px;
  max-width: 440px;
}

.classroom-student-practice-bar {
  margin-bottom: 10px;
}

.classroom-student-practice-title-row {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 8px;
}

.classroom-student-practice-title-left {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  min-width: 0;
  flex: 1 1 auto;
}

.classroom-student-practice-nav {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.classroom-student-practice-nav-item {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  padding: 10px 12px;
  border: 1px solid var(--cs-ink-border, #e8e8e8);
  border-radius: 10px;
  background: #fff;
  text-align: left;
  cursor: pointer;
}

.classroom-student-practice-nav-item--active {
  border-color: var(--asl-accent, #1677ff);
  background: var(--cs-accent-wash, rgba(22, 119, 255, 0.08));
  color: var(--asl-accent-deep, #1677ff);
  font-weight: 600;
}

.classroom-student-ai-rail-column {
  flex-shrink: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 52px;
  margin-left: 8px;
  padding: 12px 6px;
  border: 1px solid var(--cs-ink-border, #e8e8e8);
  border-radius: 12px;
  background: #fff;
  cursor: pointer;
}

.classroom-student-ai-rail-column--hidden {
  display: none;
}

.classroom-student-top-chrome-mini {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 12px;
  padding: 8px 10px;
  border-radius: 12px;
  background: #fff;
  border: 1px solid var(--cs-ink-border, #e8e8e8);
}

@media screen and (max-width: 992px) {
  .classroom-student-workspace-inner.classroom-student-workspace-3col {
    flex-direction: column;
  }

  .classroom-student-lesson-sidebar {
    width: 100%;
    max-width: none;
    min-width: 0;
  }

  .classroom-student-workspace-main--split {
    flex-direction: column;
  }

  .classroom-student-workspace-main-aipane {
    width: 100%;
    max-width: none;
    min-width: 0;
  }
}

.classroom-student-message-area {
  flex: 1 1 70%;
  min-height: 0;
  overflow: auto;
  padding: 16px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: var(--cs-radius-sm);
  margin-bottom: 16px;
  border: 1px solid var(--asl-glass-border);
  -webkit-overflow-scrolling: touch;
}

.classroom-student-message-empty {
  text-align: center;
  padding: 48px 20px;
  color: var(--asl-ink-soft);
}

.classroom-student-message-empty-list {
  text-align: left;
  display: inline-block;
  margin-top: 8px;
  color: var(--asl-ink-soft);
}

.classroom-student-input-area {
  flex-shrink: 0;
  margin-bottom: 16px;
}

.classroom-student-task-area {
  flex: 0 1 auto;
  min-height: 40vh;
  max-height: 50vh;
  overflow: auto;
  padding: 14px;
  background: var(--asl-glass);
  border-radius: var(--cs-radius-sm);
  border: 1px solid var(--asl-glass-border);
  box-shadow: var(--cs-shadow-soft);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.classroom-student-task-panel.ant-card,
.classroom-student-ai-panel.ant-card {
  height: 100%;
  min-height: 280px;
  border-radius: var(--cs-radius-sm) !important;
  border: 1px solid var(--asl-glass-border) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: var(--cs-shadow-soft);
}

.classroom-student-task-panel .ant-card-head,
.classroom-student-ai-panel .ant-card-head {
  border-bottom-color: var(--cs-divider);
  color: var(--asl-ink);
}

.classroom-student-task-panel .ant-btn-link {
  color: var(--asl-accent-deep);
}

.classroom-student-task-item.ant-list-item {
  padding: 16px !important;
  margin-bottom: 12px;
  background: #fff;
  border-radius: var(--cs-radius-xs);
  border: 1px solid var(--cs-divider) !important;
  cursor: pointer;
  transition: background 0.15s, border-color 0.15s, box-shadow 0.15s;
}

.classroom-student-task-item.ant-list-item:hover {
  background: var(--cs-accent-wash);
  border-color: var(--cs-accent-border) !important;
  box-shadow: var(--cs-shadow-soft);
}

.classroom-student-ai-title {
  font-size: 14px !important;
  color: var(--asl-accent-deep) !important;
}

.classroom-student-ai-tip {
  font-size: 12px;
  color: var(--asl-accent) !important;
  display: block;
}

/* Modal / Drawer 门户（依赖 html[data-classroom-asl-theme] 变量） */
.classroom-student-glass-modal .ant-modal-content {
  border-radius: 22px;
  overflow: hidden;
  background: var(--asl-card-surface);
  border: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.55));
  box-shadow: var(--asl-shadow, 0 18px 40px rgba(160, 48, 18, 0.2));
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.classroom-student-glass-modal .ant-modal-header {
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  border-bottom: none;
  border-radius: 22px 22px 0 0;
}

.classroom-student-glass-modal .ant-modal-title,
.classroom-student-glass-modal .ant-modal-title .anticon {
  color: #fff !important;
}

.classroom-student-glass-modal .ant-modal-close {
  color: rgba(255, 255, 255, 0.9);
}

.classroom-student-glass-modal .ant-modal-body {
  background: var(--asl-card-surface, #fff7f1);
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-glass-modal .ant-modal-footer {
  background: rgba(255, 255, 255, 0.86);
  border-top: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.55));
  border-radius: 0 0 22px 22px;
}

.classroom-student-glass-modal .ant-btn-primary:not(.ant-btn-dangerous) {
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  border-color: var(--asl-accent-deep, #e84f28);
  border-radius: 16px;
}

.classroom-student-glass-modal .ant-btn-default {
  border-radius: 14px;
}

.classroom-student-glass-modal {
  z-index: 2200;
}

.classroom-student-glass-modal .ant-modal-mask,
.classroom-student-glass-modal.ant-modal-wrap {
  z-index: 2200;
}

/*
 * 全屏扫码层：固体色、无 backdrop-filter，z-index 高于悬浮球(999999)。
 * 避免 Ant glass Modal 在 Chrome 80 WebView 上整层不绘制。
 */
.classroom-student-scan-overlay {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10000001 !important;
  display: flex !important;
  flex-direction: column;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: #111111 !important;
  overflow: hidden !important;
  pointer-events: auto !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.classroom-student-scan-overlay__panel {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  max-width: 100%;
  background: #1b1b1b;
  color: #f5f5f5;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.classroom-student-scan-overlay__header {
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  min-height: 52px;
  padding: 12px 56px 12px 16px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  background: var(--asl-accent-deep);
}

.classroom-student-scan-overlay__close {
  position: absolute !important;
  top: 8px !important;
  right: 8px !important;
  width: 40px !important;
  height: 40px !important;
  margin: 0 !important;
  color: #fff !important;
  background: rgba(0, 0, 0, 0.35) !important;
  border: none !important;
  border-radius: 20px !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
}

.classroom-student-scan-overlay__footer {
  flex-shrink: 0;
  padding: 12px 16px 16px;
  background: #222;
}

.classroom-student-scan-overlay__footer .ant-btn-primary {
  height: 48px;
  border-radius: 14px;
  background: var(--asl-accent-deep);
  border-color: var(--asl-accent-deep);
}

.classroom-student-scan-body {
  flex: 1 1 auto;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  min-height: 0;
  text-align: center;
  padding: 16px 16px 12px;
  overflow: auto;
}

/*
 * 取景框：按屏幕比例缩放的居中方框（宽高同一 min()，保持正方形）。
 * 竖屏约 min(80vmin, 88vw, 56vh) ≈ 原 280 的两倍量级。
 */
.classroom-student-scan-viewport {
  position: relative;
  display: block;
  flex: 0 0 auto;
  width: min(80vmin, 88vw, 56vh);
  height: min(80vmin, 88vw, 56vh);
  min-width: 320px;
  min-height: 320px;
  margin: 0 auto;
  border-radius: 18px;
  overflow: hidden;
  background: #000;
  border: 2px solid rgba(255, 255, 255, 0.28);
  box-shadow: 0 12px 32px rgba(0, 0, 0, 0.45);
}

/* 横屏：略收，给顶栏/底栏留空，仍约为原 220 的两倍量级 */
.classroom-student-scan-overlay--landscape .classroom-student-scan-viewport {
  width: min(72vmin, 48vw, 70vh);
  height: min(72vmin, 48vw, 70vh);
  min-width: 300px;
  min-height: 300px;
}

@media screen and (orientation: landscape) {
  .classroom-student-scan-viewport {
    width: min(72vmin, 48vw, 70vh);
    height: min(72vmin, 48vw, 70vh);
    min-width: 300px;
    min-height: 300px;
  }
}

.classroom-student-scan-overlay--landscape .classroom-student-scan-overlay__header {
  min-height: 44px;
  padding: 8px 52px 8px 14px;
  font-size: 15px;
}

.classroom-student-scan-overlay--landscape .classroom-student-scan-overlay__footer {
  padding: 8px 16px 10px;
}

.classroom-student-scan-overlay--landscape .classroom-student-scan-overlay__footer .ant-btn-primary {
  height: 40px;
}

.classroom-student-scan-overlay--landscape .classroom-student-scan-body {
  padding: 10px 16px 6px;
}

.classroom-student-scan-overlay--landscape .classroom-student-scan-tips {
  margin-top: 8px;
}

/* 很矮的横屏：仍按比例，必要时藏提示 */
@media screen and (orientation: landscape) and (max-height: 560px) {
  .classroom-student-scan-viewport,
  .classroom-student-scan-overlay--landscape .classroom-student-scan-viewport {
    width: min(62vmin, 42vw, 64vh);
    height: min(62vmin, 42vw, 64vh);
    min-width: 240px;
    min-height: 240px;
  }

  .classroom-student-scan-overlay--landscape .classroom-student-scan-tips {
    display: none;
  }
}

/* 只强制 video：解码用 canvas 若也被铺满会盖住预览 */
.classroom-student-scan-viewport video {
  position: relative;
  z-index: 1;
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
  -o-object-fit: cover !important;
     object-fit: cover !important;
  display: block !important;
  background: #000 !important;
  transform: translateZ(0);
}

.classroom-student-scan-viewport > div {
  width: 100% !important;
  height: 100% !important;
  max-width: none !important;
}

.classroom-student-scan-tips {
  flex-shrink: 0;
  margin-top: 12px;
  font-size: 12px;
  line-height: 1.5;
}

.classroom-student-scan-tips .ant-typography {
  color: rgba(255, 255, 255, 0.72) !important;
}

/* 扫码打开时禁止底层误点 */
body[data-classroom-scan-open='1'] {
  overflow: hidden;
}

.classroom-student-artifacts-drawer .ant-drawer-header {
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  border-bottom: none;
}

.classroom-student-artifacts-drawer .ant-drawer-title,
.classroom-student-artifacts-drawer .ant-drawer-title .anticon,
.classroom-student-artifacts-drawer .ant-drawer-close {
  color: #fff !important;
}

.classroom-student-artifacts-drawer .ant-drawer-body {
  background: var(--asl-card-surface, #fff7f1);
}

.classroom-student-artifact-card.ant-card {
  border-radius: var(--cs-radius-sm) !important;
  border: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.55)) !important;
  box-shadow: var(--cs-shadow-soft);
  background: rgba(255, 255, 255, 0.94) !important;
}

.classroom-student-artifact-feedback {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--cs-divider, var(--cs-ink-divider));
}

.classroom-student-artifact-feedback-item {
  padding: 8px 12px;
  background: var(--cs-accent-wash, var(--cs-accent-wash));
  border-radius: 10px;
  border: 1px solid var(--cs-accent-border, var(--cs-accent-border));
}

@keyframes classroom-student-rise {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 学生底栏：给 Dock 留底边距 */
.student-app-shell .classroom-student-page--joined .classroom-student-content,
.student-app-shell__main .classroom-student-page--joined .classroom-student-content {
  padding-bottom: calc(20px + 72px);
}

.student-app-shell .classroom-student-page--join,
.student-app-shell__main .classroom-student-page--join {
  background: transparent;
}

/* ========== 竖屏：任务优先，顶栏收紧，对话/任务上下分区 ========== */
@media screen and (orientation: portrait) {
  .classroom-student-page--joined {
    --cs-radius: 22px;
    --cs-radius-sm: 16px;
  }

  .classroom-student-page--joined .classroom-student-content {
    padding: 10px 10px 14px;
    max-width: none;
  }

  .classroom-student-page--joined .classroom-student-header-card {
    margin-bottom: 10px;
  }

  .classroom-student-page--joined .classroom-student-header-card > .ant-card-body {
    padding: 12px 14px !important;
  }

  .classroom-student-page--joined .classroom-student-header-row {
    flex-direction: column;
    align-items: stretch;
    gap: 10px;
  }

  .classroom-student-page--joined .classroom-student-header-main,
  .classroom-student-page--joined .classroom-student-header-actions {
    width: 100%;
    flex: 0 0 auto;
    max-width: 100% !important;
  }

  .classroom-student-page--joined .classroom-student-header-title {
    font-size: 18px !important;
    line-height: 1.35 !important;
  }

  .classroom-student-page--joined .classroom-student-header-emotion-select.ant-select {
    width: 40% !important;
    max-width: 150px;
  }

  .classroom-student-page--joined .classroom-student-header-emotion-note.ant-input {
    width: auto !important;
    max-width: none !important;
  }

  .classroom-student-page--joined .classroom-student-header-btns .ant-btn {
    min-height: 36px;
  }

  .classroom-student-page--joined .classroom-student-main-card > .ant-card-body {
    padding: 10px !important;
  }

  .classroom-student-page--joined .classroom-student-workspace {
    min-height: calc(100vh - 220px);
    min-height: calc(100dvh - 220px);
  }

  .classroom-student-page--joined .classroom-student-message-area {
    flex: 1 1 48%;
    padding: 12px;
    margin-bottom: 10px;
    min-height: 28vh;
  }

  .classroom-student-page--joined .classroom-student-message-empty {
    padding: 28px 12px;
  }

  .classroom-student-page--joined .classroom-student-input-area {
    margin-bottom: 10px;
  }

  .classroom-student-page--joined .classroom-student-task-area {
    flex: 1 1 42%;
    min-height: 32vh;
    max-height: none;
    padding: 10px;
  }

  .classroom-student-page--joined .classroom-student-task-panel.ant-card,
  .classroom-student-page--joined .classroom-student-ai-panel.ant-card {
    min-height: 0;
  }

  .classroom-student-page--joined .classroom-student-task-panel .ant-card-body {
    max-height: none !important;
  }

  /* 成果墙竖屏占满宽度 */
  .classroom-student-artifacts-drawer.ant-drawer-right > .ant-drawer-content-wrapper,
  .classroom-student-artifacts-drawer .ant-drawer-content-wrapper {
    width: 100vw !important;
    max-width: 100vw !important;
  }

  .classroom-student-glass-modal .ant-modal {
    max-width: calc(100vw - 24px);
    margin: 12px auto;
  }

  .student-app-shell .classroom-student-page--joined .classroom-student-content,
  .student-app-shell__main .classroom-student-page--joined .classroom-student-content {
    padding-bottom: calc(12px + 72px);
  }
}

/* ========== 横屏进课：顶栏横排，对话优先，任务区双栏 ========== */
@media screen and (orientation: landscape) {
  .classroom-student-page--joined .classroom-student-content,
  .classroom-student-page--landscape.classroom-student-page--joined .classroom-student-content {
    padding: 10px 14px 12px;
    max-width: none;
    width: 100%;
  }

  .classroom-student-page--joined .classroom-student-header-card,
  .classroom-student-page--landscape.classroom-student-page--joined .classroom-student-header-card {
    margin-bottom: 10px;
    width: 100%;
    max-width: 100% !important;
  }

  .classroom-student-page--joined .classroom-student-header-card > .ant-card-body {
    padding: 12px 16px !important;
  }

  /* 顶栏：左标题 + 右操作，禁止竖排单字 */
  .classroom-student-page--joined .classroom-student-header-row,
  .classroom-student-page--landscape.classroom-student-page--joined .classroom-student-header-row {
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: 12px;
  }

  .classroom-student-page--joined .classroom-student-header-main,
  .classroom-student-page--landscape.classroom-student-page--joined .classroom-student-header-main {
    flex: 1 1 auto;
    width: auto;
    min-width: 0;
    max-width: 52% !important;
    -webkit-writing-mode: horizontal-tb !important;
            writing-mode: horizontal-tb !important;
  }

  .classroom-student-page--joined .classroom-student-header-title {
    font-size: 20px !important;
    -webkit-writing-mode: horizontal-tb !important;
            writing-mode: horizontal-tb !important;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
  }

  .classroom-student-page--joined .classroom-student-header-meta {
    margin-top: 6px;
  }

  .classroom-student-page--joined .classroom-student-header-actions,
  .classroom-student-page--landscape.classroom-student-page--joined .classroom-student-header-actions {
    flex: 0 1 auto;
    width: auto;
    max-width: 48% !important;
    flex-direction: row;
    align-items: center;
    flex-wrap: wrap;
    justify-content: flex-end;
    gap: 8px;
  }

  .classroom-student-page--joined .classroom-student-header-emotion {
    width: auto;
    flex: 1 1 220px;
    min-width: 180px;
  }

  .classroom-student-page--joined .classroom-student-header-emotion-select.ant-select {
    width: 132px !important;
    max-width: 40%;
  }

  .classroom-student-page--joined .classroom-student-header-emotion-note.ant-input {
    width: auto !important;
    max-width: none !important;
    min-width: 120px !important;
  }

  .classroom-student-page--joined .classroom-student-header-btns {
    width: auto;
    flex: 0 0 auto;
  }

  .classroom-student-page--joined .classroom-student-header-btns .ant-btn {
    flex: 0 0 auto;
    min-height: 32px;
    padding-left: 12px;
    padding-right: 12px;
  }

  .classroom-student-page--joined .classroom-student-main-card > .ant-card-body {
    padding: 12px !important;
  }

  .classroom-student-page--joined .classroom-student-workspace {
    min-height: calc(100vh - 168px);
    min-height: calc(100dvh - 168px);
  }

  .classroom-student-page--joined .classroom-student-message-area {
    flex: 1 1 auto;
    min-height: 0;
    margin-bottom: 10px;
  }

  .classroom-student-page--joined .classroom-student-input-area {
    margin-bottom: 10px;
  }

  .classroom-student-page--joined .classroom-student-task-area {
    flex: 0 0 auto;
    min-height: 0;
    max-height: 38vh;
    padding: 10px 12px;
  }

  .classroom-student-page--joined .classroom-student-task-panel.ant-card,
  .classroom-student-page--joined .classroom-student-ai-panel.ant-card {
    min-height: 200px;
    height: 100%;
  }

  /* Chrome 80：不用 min() */
  .classroom-student-artifacts-drawer.ant-drawer-right > .ant-drawer-content-wrapper,
  .classroom-student-artifacts-drawer .ant-drawer-content-wrapper {
    width: 56vw !important;
    max-width: 720px !important;
  }

  .student-app-shell .classroom-student-page--joined .classroom-student-content,
  .student-app-shell__main .classroom-student-page--joined .classroom-student-content {
    padding-bottom: calc(12px + 64px);
  }
}

/* 矮横屏（常见平板横放）：进一步压顶栏与任务区 */
@media screen and (orientation: landscape) and (max-height: 720px) {
  .classroom-student-page--joined .classroom-student-content {
    padding: 6px 8px 8px;
  }

  .classroom-student-page--joined .classroom-student-header-card {
    margin-bottom: 6px;
  }

  .classroom-student-page--joined .classroom-student-header-card > .ant-card-body {
    padding: 8px 12px !important;
  }

  .classroom-student-page--joined .classroom-student-header-row {
    flex-wrap: wrap;
  }

  .classroom-student-page--joined .classroom-student-header-main {
    max-width: 100% !important;
    flex: 1 1 100%;
  }

  .classroom-student-page--joined .classroom-student-header-actions {
    max-width: 100% !important;
    width: 100%;
    justify-content: flex-start;
  }

  .classroom-student-page--joined .classroom-student-header-title {
    font-size: 17px !important;
    white-space: normal;
  }

  .classroom-student-page--joined .classroom-student-header-meta {
    margin-top: 4px;
  }

  .classroom-student-page--joined .classroom-student-header-emotion {
    min-width: 0;
    flex: 1 1 200px;
  }

  .classroom-student-page--joined .classroom-student-workspace {
    min-height: calc(100vh - 128px);
    min-height: calc(100dvh - 128px);
  }

  .classroom-student-page--joined .classroom-student-message-area {
    padding: 10px;
    margin-bottom: 8px;
  }

  .classroom-student-page--joined .classroom-student-input-area {
    margin-bottom: 8px;
  }

  .classroom-student-page--joined .classroom-student-task-area {
    max-height: 30vh;
    padding: 8px;
  }

  .classroom-student-page--joined .classroom-student-task-panel.ant-card,
  .classroom-student-page--joined .classroom-student-ai-panel.ant-card {
    min-height: 140px;
  }

  .classroom-student-page--joined .classroom-student-task-panel .ant-card-head,
  .classroom-student-page--joined .classroom-student-ai-panel .ant-card-head {
    min-height: 36px;
    padding: 0 10px;
  }

  .classroom-student-page--joined .classroom-student-task-panel .ant-card-body {
    max-height: calc(30vh - 56px) !important;
    overflow: auto;
  }

  .student-app-shell .classroom-student-page--joined .classroom-student-content,
  .student-app-shell__main .classroom-student-page--joined .classroom-student-content {
    padding-bottom: calc(8px + 56px);
  }
}

/* 宽横屏进课：任务区可略高，标题不必强制单行省略 */
@media screen and (orientation: landscape) and (min-width: 1100px) and (min-height: 721px) {
  .classroom-student-page--joined .classroom-student-header-title {
    white-space: normal;
  }

  .classroom-student-page--joined .classroom-student-task-area {
    max-height: 42vh;
  }
}

/* 窄竖屏（手机 / 小平板竖放） */
@media screen and (orientation: portrait) and (max-width: 767px) {
  .classroom-student-page--joined .classroom-student-header-btns .ant-btn {
    flex: 1 1 auto;
  }

  .classroom-student-page--joined .classroom-student-task-item.ant-list-item {
    padding: 12px !important;
  }

  .classroom-student-page--joined .classroom-student-task-panel .ant-card-extra {
    -webkit-margin-start: 0;
            margin-inline-start: 0;
  }

  .classroom-student-page--joined .classroom-student-task-panel .ant-card-head {
    display: flex;
    flex-wrap: wrap;
    gap: 6px;
  }
}

/* 任务区链接按钮在竖屏更易点 */
.classroom-student-task-panel .ant-btn-link {
  border-radius: 10px;
  padding: 2px 8px;
}

.classroom-student-page--joined .classroom-student-task-panel .ant-card-extra .ant-btn {
  color: var(--asl-accent-deep);
}

/* ========== 沉浸式学习桌面（进课后） ========== */
.classroom-student-page--desk.classroom-student-page--joined {
  min-height: 100vh;
  min-height: 100dvh;
  background:
    radial-gradient(ellipse 80% 50% at 10% -10%, var(--cs-page-spot-a) 0%, transparent 55%),
    radial-gradient(ellipse 70% 45% at 100% 0%, var(--cs-page-spot-b) 0%, transparent 50%),
    linear-gradient(165deg, var(--asl-card-surface) 0%, #fff 42%, var(--asl-card) 100%);
}

.classroom-student-page--desk .classroom-student-content.classroom-student-desk {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  width: 100%;
  max-width: none;
  height: 100vh;
  height: 100dvh;
  min-height: 0;
  padding: 8px 10px 10px;
  box-sizing: border-box;
  overflow: hidden;
  pointer-events: auto;
}

.classroom-student-desk-bar {
  position: relative;
  z-index: 5;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  flex-shrink: 0;
  padding: 6px 10px;
  margin-bottom: 8px;
  border-radius: 16px;
  background: #fff;
  border: 1px solid var(--cs-ink-divider);
  box-shadow: 0 6px 16px var(--cs-accent-shadow-soft);
  /* 勿用 backdrop-filter：旧 WebView 易留幽灵遮罩 */
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  pointer-events: auto;
}

.classroom-student-desk-bar-main {
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
  overflow: hidden;
  position: relative;
  z-index: 1;
  flex: 1 1 auto;
  pointer-events: none;
}

.classroom-student-desk-bar-main .classroom-student-desk-title,
.classroom-student-desk-bar-main .classroom-student-desk-chip {
  pointer-events: auto;
}

.classroom-student-desk-title {
  margin: 0;
  font-size: 15px;
  line-height: 1.25;
  font-weight: 700;
  color: var(--asl-ink, #5c3a2a);
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  min-width: 0;
  flex: 1 1 auto;
}

.classroom-student-desk-chip {
  flex-shrink: 0;
  display: inline-block;
  max-width: 36vw;
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 11px;
  line-height: 1.3;
  color: var(--asl-ink-soft, #8a5a42);
  background: var(--cs-accent-wash);
  border: 1px solid var(--cs-accent-border);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.classroom-student-desk-bar-tools {
  display: flex;
  align-items: center;
  gap: 6px;
  flex-shrink: 0;
  position: relative;
  z-index: 30;
  pointer-events: auto !important;
}

.classroom-student-desk-emotion-native {
  max-width: 112px;
  height: 32px;
  padding: 0 8px;
  border: 1px solid var(--cs-ink-border);
  border-radius: 12px;
  background: #fff;
  color: var(--asl-ink, #5c3a2a);
  font-size: 12px;
  line-height: 30px;
  pointer-events: auto !important;
  z-index: 31;
  -webkit-appearance: menulist;
  -moz-appearance: menulist;
       appearance: menulist;
}

.classroom-student-desk-icon-btn {
  width: 36px;
  height: 36px;
  border: 1px solid var(--cs-ink-border);
  border-radius: 12px;
  background: #fff;
  color: var(--asl-ink, #5c3a2a);
  font-size: 15px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  position: relative;
  z-index: 6;
  pointer-events: auto !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: var(--cs-accent-border);
}

.classroom-student-desk-icon-btn--exit {
  color: var(--asl-accent-deep, #e84f28);
  border-color: var(--cs-accent-border);
}

.classroom-student-desk-text-btn {
  flex-shrink: 0;
  height: 40px;
  padding: 0 12px;
  border: 1px solid var(--cs-accent-border, rgba(232, 79, 40, 0.28));
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.92);
  color: var(--asl-accent-deep, #e84f28);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  z-index: 6;
  pointer-events: auto !important;
  touch-action: manipulation;
}

.classroom-student-desk-tabs {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  margin-bottom: 10px;
}

.classroom-student-desk-tab {
  flex: 1 1 0;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 40px;
  border: 1px solid var(--cs-ink-border);
  border-radius: 14px;
  background: #fff;
  color: var(--asl-ink-soft, #8a5a42);
  font-size: 14px;
  font-weight: 600;
  cursor: pointer;
  position: relative;
  z-index: 4;
  pointer-events: auto !important;
  touch-action: manipulation;
  -webkit-tap-highlight-color: var(--cs-accent-border);
}

.classroom-student-desk-tab em {
  font-style: normal;
  min-width: 20px;
  padding: 0 6px;
  border-radius: 10px;
  font-size: 12px;
  background: var(--cs-accent-wash-strong);
  color: var(--asl-accent-deep, #e84f28);
}

.classroom-student-desk-tab.is-active {
  color: #fff;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  border-color: transparent;
  box-shadow: 0 8px 18px var(--cs-accent-shadow);
}

.classroom-student-desk-tab.is-active em {
  background: rgba(255, 255, 255, 0.28);
  color: #fff;
}

.classroom-student-desk-body {
  flex: 1 1 auto;
  display: flex;
  gap: 12px;
  min-height: 0;
  overflow: hidden;
}

.classroom-student-desk-pane {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: 0;
  border-radius: 24px;
  background: rgba(255, 255, 255, 0.9);
  border: 1px solid var(--asl-glass-border, rgba(255, 255, 255, 0.58));
  box-shadow: var(--cs-shadow-soft, 0 10px 24px var(--cs-accent-shadow-soft));
  overflow: hidden;
}

.classroom-student-desk-pane.is-hidden {
  display: none !important;
}

.classroom-student-desk-pane--tasks {
  flex: 1.15 1 0;
}

.classroom-student-desk-pane--ai {
  flex: 1 1 0;
}

/* 教师未开启 AI 指导 / AI 帮帮我：任务栏占满 */
.classroom-student-page--desk[data-ai-panel='0'] .classroom-student-desk-pane--tasks {
  flex: 1 1 auto;
}

.classroom-student-desk-pane-head {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 10px;
  padding: 14px 16px 10px;
  flex-shrink: 0;
  border-bottom: 1px solid var(--cs-ink-divider);
}

.classroom-student-desk-pane-head h2 {
  margin: 0;
  font-size: 18px;
  font-weight: 700;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-desk-pane-head p {
  margin: 4px 0 0;
  font-size: 12px;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-desk-pane-actions {
  display: flex;
  gap: 8px;
  flex-shrink: 0;
  position: relative;
  z-index: 6;
  pointer-events: auto !important;
}

.classroom-student-desk-pane-actions .ant-btn {
  border-radius: 12px;
}

/* 原生按钮：旧 WebView 上 Ant Button 易只闪 ripple、点不到逻辑 */
.classroom-student-desk-action-btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  min-height: 36px;
  padding: 0 14px;
  border: 1px solid var(--cs-ink-border);
  border-radius: 14px;
  background: #fff;
  color: var(--asl-ink, #5c3a2a);
  font-size: 13px;
  font-weight: 600;
  line-height: 1.2;
  box-shadow: 0 4px 12px var(--cs-accent-shadow-soft);
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
  pointer-events: auto !important;
}

.classroom-student-desk-action-btn--primary {
  color: #fff;
  border-color: var(--asl-accent-deep, #e84f28);
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  box-shadow: 0 6px 14px var(--cs-accent-shadow);
}

.classroom-student-desk-action-btn:active {
  transform: scale(0.97);
}

.classroom-student-desk-action-btn:disabled {
  opacity: 0.55;
  cursor: default;
  transform: none;
}

.classroom-student-desk-task-scroll {
  flex: 1 1 auto;
  overflow: auto;
  padding: 12px 14px 16px;
  -webkit-overflow-scrolling: touch;
}

.classroom-student-desk-task-card {
  padding: 16px;
  margin-bottom: 12px;
  border-radius: 20px;
  background: linear-gradient(180deg, #fff 0%, var(--asl-card-surface, #fff7f1) 100%);
  border: 1px solid var(--cs-accent-wash-strong);
  box-shadow: 0 8px 20px var(--cs-accent-shadow-soft);
}

.classroom-student-desk-task-card:last-child {
  margin-bottom: 0;
}

.classroom-student-desk-task-card-top h3 {
  margin: 0 0 8px;
  font-size: 17px;
  font-weight: 700;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-desk-task-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.classroom-student-desk-tag {
  display: inline-block;
  padding: 2px 10px;
  border-radius: 999px;
  font-size: 12px;
  color: #fff;
  background: var(--asl-accent, #ff6b3d);
}

.classroom-student-desk-tag--soft {
  color: var(--asl-accent-deep, #e84f28);
  background: var(--cs-accent-wash-strong);
}

.classroom-student-desk-task-desc {
  margin: 10px 0 0;
  font-size: 14px;
  line-height: 1.55;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-desk-task-md p {
  margin: 0 0 0.6em;
}

.classroom-student-desk-task-md p:last-child {
  margin-bottom: 0;
}

.classroom-student-desk-task-md img {
  display: block;
  max-width: 100%;
  height: auto;
  margin: 10px 0 4px;
  border-radius: 12px;
  border: 1px solid rgba(20, 24, 32, 0.08);
  background: #fff;
}

.classroom-student-desk-task-insight {
  display: flex;
  gap: 8px;
  margin-top: 12px;
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 13px;
  line-height: 1.45;
  color: var(--asl-ink, #5c3a2a);
  background: rgba(255, 193, 7, 0.12);
  border: 1px solid rgba(255, 167, 38, 0.28);
}

.classroom-student-desk-task-card-foot {
  margin-top: 14px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.classroom-student-desk-task-card-foot .ant-btn {
  min-height: 44px;
  border-radius: 14px;
}

/* AI 指导 / AI 考考我：与「提交成果」同系圆角；教师未开启时按钮不渲染，开启后样式已就绪 */
.classroom-student-desk-ai-btn.ant-btn {
  min-width: 120px;
  height: 44px !important;
  padding: 0 16px !important;
  border-radius: 14px !important;
  font-weight: 600 !important;
  border: 1px solid rgba(232, 79, 40, 0.28) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  background: linear-gradient(
    165deg,
    #ffffff 0%,
    var(--asl-avatar-from, #ffe8d8) 100%
  ) !important;
  box-shadow: 0 4px 12px var(--cs-accent-shadow-soft, rgba(232, 79, 40, 0.12));
}

.classroom-student-desk-ai-btn.ant-btn .anticon {
  color: var(--asl-accent-deep, #e84f28) !important;
}

.classroom-student-desk-ai-btn--quiz.ant-btn {
  border-color: rgba(37, 99, 235, 0.28) !important;
  color: #1d4ed8 !important;
  background: linear-gradient(165deg, #ffffff 0%, #dbeafe 100%) !important;
  box-shadow: 0 4px 12px rgba(37, 99, 235, 0.12);
}

.classroom-student-desk-ai-btn--quiz.ant-btn .anticon {
  color: #1d4ed8 !important;
}

.classroom-student-desk-ai-btn.ant-btn:active {
  transform: scale(0.98);
}

.classroom-student-desk-task-card-foot .ant-btn-primary {
  min-width: 140px;
  height: 44px;
  border-radius: 14px;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  border-color: var(--asl-accent-deep, #e84f28);
}

.classroom-student-desk-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 220px;
  padding: 24px 16px;
  text-align: center;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-desk-empty-icon {
  font-size: 36px;
  color: var(--asl-accent, #ff6b3d);
  margin-bottom: 4px;
}

.classroom-student-desk-empty strong {
  font-size: 16px;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-desk-empty .ant-btn-primary {
  margin-top: 8px;
  border-radius: 14px;
}

.classroom-student-desk-guide {
  flex-shrink: 0;
  margin: 0 12px;
  padding: 12px 14px;
  border-radius: 16px;
  background: linear-gradient(135deg, var(--cs-accent-glow-soft) 0%, var(--asl-card-surface) 100%);
  border: 1px solid var(--cs-accent-border-soft);
}

.classroom-student-desk-guide-title {
  display: flex;
  justify-content: space-between;
  gap: 8px;
  margin-bottom: 8px;
  font-size: 14px;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-desk-guide-title span {
  font-size: 12px;
  color: var(--asl-ink-soft, #8a5a42);
  white-space: nowrap;
}

.classroom-student-desk-guide-steps {
  margin: 0;
  padding-left: 18px;
  font-size: 13px;
  line-height: 1.55;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-desk-guide-tips {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 8px;
}

.classroom-student-desk-guide-tips .classroom-student-ai-tip {
  display: inline-block;
  padding: 4px 10px;
  border-radius: 999px;
  font-size: 12px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid var(--cs-accent-border-soft);
}

.classroom-student-desk-guide-status,
.classroom-student-desk-guide-idle {
  margin-top: 6px;
  font-size: 12px;
  color: var(--asl-accent-deep, #e84f28);
}

.classroom-student-desk-guide-idle {
  margin-top: 0;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-desk-chat {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 10px 12px;
  -webkit-overflow-scrolling: touch;
}

.classroom-student-desk-chat-empty {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-height: 160px;
  text-align: center;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-desk-chat-empty strong {
  font-size: 16px;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-desk-chat-hints {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 6px;
  justify-content: center;
}

.classroom-student-desk-hint-chip {
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid var(--cs-accent-border);
  background: rgba(255, 255, 255, 0.9);
  color: var(--asl-accent-deep, #e84f28);
  font-size: 12px;
}

.classroom-student-desk-input {
  flex-shrink: 0;
  padding: 10px 12px 12px;
  border-top: 1px solid var(--cs-ink-divider);
  background: var(--asl-card-surface);
}

/**
 * 原生键盘顶起：由 App 层 --native-keyboard-inset + .native-keyboard-compose 处理。
 * 课堂底栏仅去掉模糊/固定层，避免旧 WebView 整页发糊。
 */
body.native-keyboard-open .classroom-student-page--desk .classroom-student-desk-input {
  position: relative;
  z-index: 8;
  background: #fff;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
}

body.native-keyboard-open .classroom-student-page--desk .classroom-student-desk-input > div {
  background: #fff !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.classroom-student-desk-compose-hint {
  margin: 0;
  font-size: 12px;
  font-weight: 600;
  color: var(--asl-accent-deep, #e84f28);
}

.classroom-student-desk-compose-back {
  flex-shrink: 0;
  display: inline-flex;
  align-items: center;
  gap: 4px;
  height: 36px;
  padding: 0 12px;
  margin: 0;
  border: 1px solid var(--cs-accent-border, rgba(255, 107, 61, 0.28));
  border-radius: 18px;
  background: var(--cs-accent-wash, rgba(255, 107, 61, 0.1));
  color: var(--asl-accent-deep, #e84f28);
  font-size: 13px;
  font-weight: 700;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.classroom-student-desk-compose-back:active {
  opacity: 0.85;
}

/**
 * AI 对话弹窗（粘性）
 * - 蒙层 + 固定卡片，随 visualViewport 上移/收缩
 * - 输入条贴弹窗底部 → 始终在输入法上方
 * - 实色无 blur，避免旧 WebView 糊字
 * - 仅点「返回」关闭
 */
.classroom-ai-compose-mask {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10000030 !important;
  background: rgba(20, 24, 32, 0.42) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  /* 挡住下层桌面；弹窗 z-index 更高仍可点 */
  pointer-events: auto !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-pane--ai,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-pane--ai {
  position: fixed !important;
  top: calc(var(--cs-compose-top, 0px) + 10px) !important;
  left: 12px !important;
  right: 12px !important;
  width: auto !important;
  max-width: none !important;
  height: calc(var(--cs-compose-height, 100vh) - 20px) !important;
  max-height: calc(var(--cs-compose-height, 100vh) - 20px) !important;
  margin: 0 !important;
  z-index: 10000035 !important;
  display: flex !important;
  flex-direction: column !important;
  background: #fff !important;
  border: 1px solid #e5e5e5 !important;
  border-radius: 18px !important;
  box-shadow: 0 16px 40px rgba(0, 0, 0, 0.22) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
  overflow: hidden !important;
  transform: translateZ(0);
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-guide,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-guide {
  display: none !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-pane-head--ai,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-pane-head--ai {
  order: 1;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px 12px;
  border-bottom: 1px solid #eee;
  background: #fff;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-pane-head-text,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-pane-head-text {
  min-width: 0;
  flex: 1 1 auto;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-pane-head--ai h2,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-pane-head--ai h2 {
  margin: 0;
  font-size: 16px;
}

/* 消息区：占满弹窗中部，可滚动 */
.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-chat,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-chat {
  order: 2;
  flex: 1 1 auto;
  width: 100%;
  max-width: none;
  max-height: none;
  min-height: 0;
  margin: 0;
  padding: 10px 14px;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
  background: #fff;
}

/* 输入条：贴弹窗底，随 VV 高度上移，不被输入法压住 */
.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-input,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input {
  order: 3;
  flex-shrink: 0;
  width: 100%;
  max-width: none;
  margin: 0;
  padding: 8px 10px 10px;
  position: relative;
  z-index: 2;
  background: #fff;
  border: none;
  border-top: 1px solid #eee;
  box-shadow: none;
  box-sizing: border-box;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-input > div,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input > div {
  position: relative !important;
  top: auto !important;
  bottom: auto !important;
  padding: 8px 10px !important;
  border: 1.5px solid #d0d0d0 !important;
  border-radius: 14px !important;
  background: #fff !important;
  box-shadow: none !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  -webkit-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
  z-index: 2 !important;
  transform: none !important;
  -webkit-transform: none !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-input .ant-btn,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input .ant-btn {
  box-shadow: none !important;
  -webkit-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
  background: #fff !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-input .ant-btn-primary,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input .ant-btn-primary {
  background: var(--asl-accent, #ff6b3d) !important;
  border-color: var(--asl-accent-deep, #e84f28) !important;
  color: #fff !important;
  box-shadow: none !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-input .anticon,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input .anticon {
  opacity: 1 !important;
  -webkit-filter: none !important;
  filter: none !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-input textarea.ant-input,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input textarea.ant-input {
  min-height: 44px !important;
  max-height: 120px !important;
  height: auto !important;
  font-size: 16px !important;
  line-height: 1.45 !important;
  color: #1f1f1f !important;
  background: #fff !important;
  -webkit-text-fill-color: #1f1f1f !important;
  opacity: 1 !important;
  overflow-y: auto !important;
  resize: vertical !important;
  -webkit-filter: none !important;
  filter: none !important;
  box-shadow: none !important;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-chat-empty,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-chat-empty {
  display: flex !important;
  flex-direction: column !important;
  align-items: center !important;
  justify-content: center !important;
  gap: 6px;
  min-height: 120px !important;
  padding: 16px 8px !important;
  text-align: center;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-chat-empty strong,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-chat-empty strong {
  font-size: 17px;
}

.classroom-student-page--desk.classroom-student-page--ai-compose .classroom-student-desk-chat-hints,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-chat-hints {
  margin-top: 4px;
}

/* 课堂 AI 输入：隐藏应用内麦克风（平板 WebView 录音无效；请用安卓输入法语音） */
.classroom-student-desk-input .ant-space > .ant-space-item:first-child {
  display: none !important;
}

/* 课堂页内美化 EnhancedChatInput（不改组件源码） */
.classroom-student-desk-input .enhanced-chat-input {
  width: 100%;
}

.classroom-student-desk-input .enhanced-chat-input__row {
  display: flex !important;
  align-items: center !important;
  gap: 10px !important;
}

.classroom-student-desk-input .enhanced-chat-input__row .ant-space {
  display: flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  gap: 8px !important;
}

.classroom-student-desk-input .enhanced-chat-input__row .ant-space-item {
  margin: 0 !important;
}

.classroom-student-desk-input .enhanced-chat-input__row .ant-btn {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  padding: 0 !important;
  border-radius: 16px !important;
  border: 1.5px solid var(--cs-accent-border) !important;
  background: #fff !important;
  color: var(--asl-accent-deep, #e84f28) !important;
  box-shadow: 0 4px 12px var(--cs-accent-shadow-soft);
}

/* 对话专注态：覆盖上方美化阴影，防止糊字（须写在通用按钮阴影之后） */
.classroom-student-page--ai-compose .classroom-student-desk-input .ant-btn,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input .ant-btn,
.classroom-student-page--ai-compose .classroom-student-desk-input .enhanced-chat-input__row .ant-btn,
.classroom-student-page--desk[data-ai-compose='1'] .classroom-student-desk-input .enhanced-chat-input__row .ant-btn {
  box-shadow: none !important;
  -webkit-filter: none !important;
  filter: none !important;
  opacity: 1 !important;
}

.classroom-student-desk-input .enhanced-chat-input__row .ant-btn .anticon {
  font-size: 18px;
}

.classroom-student-desk-input .enhanced-chat-input__row .ant-btn-primary,
.classroom-student-desk-input .enhanced-chat-input__row .ant-btn-dangerous {
  color: #fff !important;
  border: none !important;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
}

.classroom-student-desk-input .enhanced-chat-input__row textarea.ant-input {
  min-height: 46px !important;
  border-radius: 16px !important;
  border-color: var(--cs-ink-border) !important;
  padding: 10px 12px !important;
  font-size: 14px !important;
  background: #fff !important;
}

.classroom-student-desk-input .enhanced-chat-input__row > .ant-btn-primary {
  width: 46px !important;
  min-width: 46px !important;
  height: 46px !important;
  border-radius: 16px !important;
  border: none !important;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  box-shadow: 0 8px 16px var(--cs-accent-shadow);
}

/* 竖屏：单栏切换 */
@media screen and (orientation: portrait) {
  .classroom-student-page--desk .classroom-student-desk-body {
    flex-direction: column;
  }

  .classroom-student-desk-pane--tasks,
  .classroom-student-desk-pane--ai {
    flex: 1 1 auto;
    height: 100%;
  }

  .classroom-student-desk-bar {
    flex-wrap: nowrap;
  }

  .classroom-student-desk-bar-tools {
    width: auto;
    justify-content: flex-end;
  }

  .student-app-shell .classroom-student-page--desk .classroom-student-desk,
  .student-app-shell__main .classroom-student-page--desk .classroom-student-desk {
    padding-bottom: calc(10px + 72px);
    height: auto;
    min-height: calc(100vh - 0px);
    min-height: calc(100dvh - 0px);
  }
}

/* 横屏：任务左 / AI 右；加大提问区 */
@media screen and (orientation: landscape) {
  .classroom-student-page--desk .classroom-student-desk-body {
    flex-direction: row;
  }

  .classroom-student-desk-title {
    font-size: 16px;
  }

  .classroom-student-desk-pane--ai .classroom-student-desk-pane-head {
    padding: 8px 12px 6px;
  }

  .classroom-student-desk-pane--ai .classroom-student-desk-pane-head h2 {
    font-size: 16px;
  }

  .classroom-student-desk-pane--ai .classroom-student-desk-pane-head p {
    display: none;
  }

  .classroom-student-desk-guide {
    max-height: 18vh;
    overflow: auto;
    margin: 0 10px;
    padding: 8px 10px;
  }

  .classroom-student-desk-pane--tasks {
    flex: 1 1 0;
  }

  .classroom-student-desk-pane--ai {
    flex: 1.15 1 0;
  }

  .classroom-student-desk-chat {
    flex: 1.2 1 auto;
    min-height: 120px;
  }

  .classroom-student-desk-input {
    padding: 12px 12px 14px;
    background: var(--asl-card);
  }

  .classroom-student-desk-input .enhanced-chat-input__row .ant-btn {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
    border-radius: 16px !important;
  }

  .classroom-student-desk-input .enhanced-chat-input__row textarea.ant-input {
    min-height: 72px !important;
    max-height: 120px !important;
    font-size: 15px !important;
    padding: 12px 14px !important;
  }

  .classroom-student-desk-input .enhanced-chat-input__row > .ant-btn-primary {
    width: 48px !important;
    min-width: 48px !important;
    height: 48px !important;
  }

  .student-app-shell .classroom-student-page--desk .classroom-student-desk,
  .student-app-shell__main .classroom-student-page--desk .classroom-student-desk {
    padding-bottom: 10px;
  }
}

@media screen and (orientation: landscape) and (max-height: 720px) {
  .classroom-student-desk-kicker {
    display: none;
  }

  .classroom-student-desk-bar {
    padding: 6px 10px;
    margin-bottom: 6px;
  }

  .classroom-student-desk-pane-head {
    padding: 8px 10px 6px;
  }

  .classroom-student-desk-guide {
    max-height: 14vh;
    margin: 0 8px;
    padding: 6px 8px;
  }

  .classroom-student-desk-input .enhanced-chat-input__row textarea.ant-input {
    min-height: 64px !important;
  }
}

/* ========== 固体 Portal Sheet（提交成果 / 成果墙）========== */
.classroom-student-sheet {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10000020 !important;
  display: flex !important;
  flex-direction: column;
  justify-content: flex-end;
  width: 100vw !important;
  max-width: 100vw !important;
  height: 100vh !important;
  margin: 0 !important;
  padding: 0 !important;
  background: rgba(0, 0, 0, 0.45) !important;
  overflow: hidden !important;
  pointer-events: auto !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
}

.classroom-student-sheet__panel {
  display: flex;
  flex-direction: column;
  width: 100%;
  max-height: 90vh;
  background: var(--asl-card-surface);
  color: var(--asl-ink, #5c3a2a);
  border-radius: 20px 20px 0 0;
  overflow: hidden;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}

.classroom-student-sheet__panel--full {
  max-height: 100vh;
  height: 100vh;
  border-radius: 0;
  background: #fff;
}

.classroom-student-sheet__header {
  position: relative;
  flex-shrink: 0;
  display: flex;
  align-items: center;
  min-height: 52px;
  padding: 12px 56px 12px 16px;
  font-size: 16px;
  font-weight: 600;
  color: #fff;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
}

.classroom-student-sheet__close {
  position: absolute;
  top: 8px;
  right: 8px;
  width: 40px;
  height: 40px;
  border: none;
  border-radius: 20px;
  color: #fff;
  background: rgba(0, 0, 0, 0.28);
  cursor: pointer;
  pointer-events: auto !important;
  z-index: 2;
}

.classroom-student-sheet__body {
  flex: 1 1 auto;
  min-height: 0;
  overflow: auto;
  padding: 16px;
  -webkit-overflow-scrolling: touch;
}

.classroom-student-sheet__footer {
  flex-shrink: 0;
  display: flex;
  gap: 10px;
  padding: 12px 16px 16px;
  background: #fff;
  border-top: 1px solid var(--cs-ink-divider);
}

.classroom-student-sheet__footer .ant-btn {
  border-radius: 14px;
  height: 44px;
}

.classroom-student-sheet__footer .ant-btn-primary {
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  border-color: var(--asl-accent-deep, #e84f28);
}

.classroom-student-artifacts-sheet .classroom-student-artifact-card.ant-card {
  border-radius: 16px !important;
}

.classroom-student-artifact-media {
  width: 100%;
  max-width: 100%;
}

.classroom-student-artifact-thumb {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  margin: 0;
  padding: 0;
  border: 1px solid var(--cs-ink-border, #e8e8e8);
  border-radius: 12px;
  background: #f7f4f0;
  overflow: hidden;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.classroom-student-artifact-thumb__img {
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: 300px;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  vertical-align: middle;
  background: #f7f4f0;
}

.classroom-student-artifact-thumb__mask {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  padding: 8px 10px;
  font-size: 13px;
  font-weight: 600;
  color: #fff;
  text-align: center;
  background: rgba(0, 0, 0, 0.45);
  pointer-events: none;
}

.classroom-student-artifact-lightbox {
  position: fixed !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  z-index: 10000050 !important;
  display: flex !important;
  align-items: center;
  justify-content: center;
  padding: 48px 16px 16px;
  box-sizing: border-box;
  background: rgba(0, 0, 0, 0.88) !important;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
  pointer-events: auto !important;
}

.classroom-student-artifact-lightbox__close {
  position: absolute;
  top: 12px;
  right: 12px;
  width: 44px;
  height: 44px;
  border: none;
  border-radius: 22px;
  color: #fff;
  background: rgba(255, 255, 255, 0.18);
  cursor: pointer;
  z-index: 2;
  pointer-events: auto !important;
}

.classroom-student-artifact-lightbox__img {
  display: block;
  max-width: 100%;
  max-height: calc(100vh - 72px);
  width: auto;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 8px;
  background: transparent;
}

/* —— 提交成果：上下左右居中卡片（横竖屏分流） —— */
.classroom-student-submit-sheet.classroom-student-sheet {
  justify-content: center !important;
  align-items: center !important;
  padding: 20px 16px !important;
  box-sizing: border-box !important;
  background: rgba(40, 22, 12, 0.48) !important;
}

.classroom-student-submit-sheet__panel.classroom-student-sheet__panel {
  width: 92vw;
  max-width: 520px;
  max-height: 88vh;
  margin: 0 auto;
  border-radius: 22px;
  background: var(--asl-card-surface);
  border: 1px solid rgba(255, 255, 255, 0.65);
  box-shadow: 0 22px 48px rgba(60, 24, 8, 0.28);
  overflow: hidden;
}

.classroom-student-submit-sheet__header.classroom-student-sheet__header {
  min-height: 64px;
  padding: 14px 56px 14px 18px;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 52%,
    var(--asl-accent-deep, #e84f28) 100%
  );
}

.classroom-student-submit-sheet__title-wrap {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.classroom-student-submit-sheet__eyebrow {
  font-size: 12px;
  font-weight: 600;
  letter-spacing: 0.06em;
  color: rgba(255, 255, 255, 0.88);
}

.classroom-student-submit-sheet__title {
  font-size: 17px;
  font-weight: 700;
  line-height: 1.3;
  color: #fff;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.classroom-student-submit-sheet__body.classroom-student-sheet__body {
  padding: 16px 16px 8px;
}

.classroom-student-submit-sheet__layout {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.classroom-student-submit-sheet__label {
  display: block;
  margin-bottom: 8px;
  font-size: 13px;
  font-weight: 700;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-submit-sheet__label em {
  margin-left: 6px;
  font-style: normal;
  font-size: 11px;
  font-weight: 600;
  color: var(--asl-accent-deep, #e84f28);
  background: var(--cs-accent-wash-strong);
  border-radius: 999px;
  padding: 1px 8px;
}

.classroom-student-submit-sheet__label em.is-required {
  color: #fff;
  background: var(--asl-accent, #ff6b3d);
}

.classroom-student-submit-sheet__hint {
  margin: 6px 0 0;
  font-size: 12px;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-submit-sheet__upload-zone {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  width: 100%;
  min-height: 148px;
  padding: 18px 16px;
  border: 2px dashed var(--cs-accent-border);
  border-radius: 20px;
  background: linear-gradient(165deg, var(--cs-upload-from) 0%, var(--cs-upload-mid) 55%, var(--cs-upload-to) 100%);
  color: var(--asl-accent-deep, #e84f28);
  cursor: pointer;
  -webkit-appearance: none;
  -moz-appearance: none;
       appearance: none;
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.9), 0 8px 20px var(--cs-accent-shadow-soft);
  transition: transform 0.15s ease, border-color 0.15s ease;
}

.classroom-student-submit-sheet__upload-zone:active {
  transform: scale(0.985);
  border-color: var(--asl-accent, #ff6b3d);
  background: linear-gradient(165deg, var(--asl-card-surface) 0%, var(--asl-avatar-from) 100%);
}

.classroom-student-submit-sheet__upload-zone .anticon {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 52px;
  height: 52px;
  font-size: 24px;
  color: #fff;
  border-radius: 18px;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  );
  box-shadow: 0 8px 16px var(--cs-accent-shadow);
}

.classroom-student-submit-sheet__upload-zone span {
  font-size: 16px;
  font-weight: 700;
  color: var(--asl-ink, #5c3a2a);
}

.classroom-student-submit-sheet__upload-zone small {
  font-size: 12px;
  color: var(--asl-ink-soft, #8a5a42);
}

.classroom-student-submit-sheet__preview {
  display: block;
  width: 100%;
  max-height: 180px;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 14px;
}

.classroom-student-submit-sheet__remove-img {
  margin-top: 4px;
  padding-left: 0 !important;
}

.classroom-student-submit-sheet__input.ant-select .ant-select-selector,
.classroom-student-submit-sheet__input.ant-select-auto-complete .ant-select-selector {
  border-radius: 14px !important;
  min-height: 44px !important;
  border-color: var(--cs-ink-border) !important;
}

.classroom-student-submit-sheet__textarea.ant-input,
.classroom-student-submit-sheet__textarea.ant-input-textarea textarea {
  border-radius: 14px !important;
  border-color: var(--cs-ink-border) !important;
  font-size: 14px;
  background: #fff;
}

.classroom-student-submit-sheet__tip {
  padding: 10px 12px;
  border-radius: 14px;
  font-size: 12px;
  line-height: 1.45;
  color: var(--asl-ink-soft, #8a5a42);
  background: var(--cs-accent-wash);
  border: 1px solid var(--cs-accent-wash-strong);
}

.classroom-student-submit-sheet__footer.classroom-student-sheet__footer {
  justify-content: flex-end;
  gap: 12px;
  padding: 12px 16px 16px;
  background: #fff;
  border-top: 1px solid var(--cs-ink-divider);
}

.classroom-student-submit-sheet__footer .ant-btn {
  min-width: 112px;
  height: 46px;
  border-radius: 16px;
  font-weight: 600;
}

.classroom-student-submit-sheet__btn-cancel.ant-btn {
  min-width: 112px;
  color: var(--asl-ink, #5c3a2a) !important;
  background: #fff !important;
  border: 1.5px solid var(--cs-ink-border) !important;
  box-shadow: 0 4px 12px var(--cs-ink-divider);
}

.classroom-student-submit-sheet__btn-cancel.ant-btn:active {
  background: #fff7f1 !important;
  border-color: var(--cs-accent-border) !important;
  color: var(--asl-accent-deep, #e84f28) !important;
}

.classroom-student-submit-sheet__btn-ok.ant-btn-primary {
  min-width: 148px;
  color: #fff !important;
  border: none !important;
  background: linear-gradient(
    135deg,
    var(--asl-accent-soft, #ff8f5c) 0%,
    var(--asl-accent, #ff6b3d) 55%,
    var(--asl-accent-deep, #e84f28) 100%
  ) !important;
  box-shadow: 0 10px 22px var(--cs-accent-shadow);
}

.classroom-student-submit-sheet__btn-ok.ant-btn-primary:active {
  transform: translateY(1px);
  box-shadow: 0 6px 14px var(--cs-accent-shadow);
}

/* 竖屏：上传区在上，表单在下 */
@media screen and (orientation: portrait) {
  .classroom-student-submit-sheet__panel.classroom-student-sheet__panel {
    width: 92vw;
    max-width: 480px;
    max-height: 86vh;
  }

  .classroom-student-submit-sheet__upload-zone {
    min-height: 128px;
  }
}

/* 横屏：左右居中双栏，控制高度避免顶出屏幕 */
@media screen and (orientation: landscape) {
  .classroom-student-submit-sheet.classroom-student-sheet {
    padding: 12px 20px !important;
  }

  .classroom-student-submit-sheet__panel.classroom-student-sheet__panel {
    width: 86vw;
    max-width: 760px;
    max-height: 92vh;
  }

  .classroom-student-submit-sheet__header.classroom-student-sheet__header {
    min-height: 56px;
    padding: 10px 56px 10px 16px;
  }

  .classroom-student-submit-sheet__title {
    font-size: 16px;
  }

  .classroom-student-submit-sheet__body.classroom-student-sheet__body {
    padding: 12px 14px 6px;
  }

  .classroom-student-submit-sheet__layout {
    flex-direction: row;
    align-items: stretch;
    gap: 16px;
  }

  .classroom-student-submit-sheet__media {
    flex: 0 0 38%;
    max-width: 38%;
  }

  .classroom-student-submit-sheet__fields {
    flex: 1 1 auto;
    min-width: 0;
    display: flex;
    flex-direction: column;
    gap: 10px;
  }

  .classroom-student-submit-sheet__upload-zone {
    min-height: 160px;
    height: calc(100% - 28px);
  }

  .classroom-student-submit-sheet__preview {
    max-height: 200px;
  }

  .classroom-student-submit-sheet__textarea.ant-input,
  .classroom-student-submit-sheet__textarea.ant-input-textarea textarea {
    min-height: 72px !important;
  }

  .classroom-student-submit-sheet__footer.classroom-student-sheet__footer {
    padding: 10px 14px 12px;
  }
}

@media screen and (orientation: landscape) and (max-height: 560px) {
  .classroom-student-submit-sheet__eyebrow {
    display: none;
  }

  .classroom-student-submit-sheet__upload-zone {
    min-height: 120px;
  }

  .classroom-student-submit-sheet__tip {
    display: none;
  }
}
.task-ref-canvas-modal .ant-modal {
  max-width: calc(100vw - 24px);
  padding-bottom: 0;
}

.task-ref-canvas-modal .ant-modal-content {
  display: flex;
  flex-direction: column;
  max-height: calc(100dvh - 24px);
}

.task-ref-canvas-modal .ant-modal-header {
  flex-shrink: 0;
  margin-bottom: 0;
  padding: 12px 16px;
}

.task-ref-canvas-modal .ant-modal-body {
  flex: 1 1 auto;
  min-height: 0;
  padding: 10px 12px 12px;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.task-ref-canvas-modal-root {
  display: flex;
  flex-direction: column;
  flex: 1 1 auto;
  min-height: 0;
  height: calc(100dvh - 108px);
  max-height: calc(100dvh - 108px);
}

.task-ref-canvas-action-bar {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  padding-bottom: 8px;
  border-bottom: 1px solid #f0f0f0;
}

.task-ref-canvas-action-bar .task-ref-canvas-title-input {
  flex: 1 1 220px;
  min-width: 180px;
  max-width: 360px;
}

.task-ref-canvas-action-bar .task-ref-canvas-ref-select {
  min-width: 160px;
}

.task-ref-canvas-tools {
  flex-shrink: 0;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 8px;
  padding: 8px 0;
  border-bottom: 1px solid #f5f5f5;
}

.task-ref-canvas-tools .ant-slider {
  margin: 0;
}

.task-ref-canvas-wrap {
  flex: 1 1 auto;
  min-height: 0;
  overflow: hidden;
  border-radius: 8px;
  position: relative;
  border: 1px solid #eee;
  touch-action: none;
  background: #1a1a1a;
}

/* 仅 Fabric 主画布；避免把笔顺 hanzi-writer canvas 拉成全幅导致“不动画” */
.task-ref-canvas-wrap > canvas {
  display: block;
  width: 100%;
  height: 100%;
  touch-action: none;
}

.task-ref-canvas-mini-toolbar {
  position: absolute;
  left: 50%;
  bottom: 12px;
  transform: translateX(-50%);
  z-index: 6;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.96);
  border: 1px solid #e8e8e8;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
  max-width: calc(100% - 24px);
}

.task-ref-canvas-mini-toolbar .ant-btn {
  padding-inline: 10px;
}

.task-ref-canvas-tips {
  flex-shrink: 0;
  margin-top: 8px;
  font-size: 12px;
  color: #888;
  line-height: 1.5;
}

@media (max-width: 768px) {
  .task-ref-canvas-modal-root {
    height: calc(100dvh - 96px);
    max-height: calc(100dvh - 96px);
  }

  .task-ref-canvas-action-bar .task-ref-canvas-title-input {
    flex: 1 1 100%;
    max-width: none;
  }
}
.encouragement-praise-modal .ant-modal-content {
  border-radius: 16px;
  overflow: hidden;
}

.encouragement-praise-modal__body {
  text-align: center;
  padding: 8px 8px 4px;
}

.encouragement-praise-modal__icon-wrap {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 88px;
  height: 88px;
  margin: 0 auto 16px;
  border-radius: 50%;
  background: linear-gradient(145deg, #fff7e6 0%, #ffe7ba 100%);
  box-shadow: 0 8px 24px rgba(250, 173, 20, 0.25);
  animation: encouragement-praise-pop 0.45s ease-out;
}

.encouragement-praise-modal__icon {
  font-size: 44px;
  color: #fa8c16;
  transform: rotate(-8deg);
}

.encouragement-praise-modal__headline {
  margin-bottom: 12px !important;
  color: #d48806 !important;
}

.encouragement-praise-modal__message {
  font-size: 16px;
  line-height: 1.65;
  margin-bottom: 8px !important;
  color: #434343;
}

.encouragement-praise-modal__sub {
  display: block;
  font-size: 13px;
}

@keyframes encouragement-praise-pop {
  0% {
    transform: scale(0.6);
    opacity: 0;
  }
  70% {
    transform: scale(1.08);
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
.chw-sg-webgl-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 180px;
  background: #0f172a;
  overflow: hidden;
}

.chw-sg-webgl-canvas {
  width: 100%;
  height: 100%;
  display: block;
  touch-action: none;
  cursor: -webkit-grab;
  cursor: grab;
}

.chw-sg-webgl-canvas:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.chw-sg-webgl-canvas.is-edit {
  cursor: crosshair;
}

.chw-sg-webgl-toolbar {
  position: absolute;
  top: 6px;
  left: 6px;
  right: 6px;
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  z-index: 2;
  pointer-events: none;
}

.chw-sg-webgl-toolbar button {
  pointer-events: auto;
  border: 1px solid rgba(148, 163, 184, 0.45);
  background: rgba(15, 23, 42, 0.82);
  color: #e2e8f0;
  font-size: 11px;
  line-height: 1.2;
  padding: 3px 7px;
  border-radius: 4px;
  cursor: pointer;
}

.chw-sg-webgl-toolbar button.is-active {
  border-color: #38bdf8;
  color: #7dd3fc;
  background: rgba(14, 116, 144, 0.45);
}

.chw-sg-webgl-toolbar button:disabled {
  opacity: 0.4;
  cursor: not-allowed;
}

.chw-sg-webgl-label.is-selected {
  color: #fdba74;
}

.chw-sg-webgl-labels {
  position: absolute;
  inset: 0;
  pointer-events: none;
  overflow: hidden;
}

.chw-sg-webgl-label {
  position: absolute;
  color: #f8fafc;
  font-size: 11px;
  font-weight: 600;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.85);
  white-space: nowrap;
}

.chw-sg-webgl-hint {
  position: absolute;
  left: 8px;
  bottom: 6px;
  font-size: 11px;
  color: rgba(148, 163, 184, 0.95);
  pointer-events: none;
}
.chw-dock-ggb-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  min-height: 180px;
  background: #f8fafc;
  overflow: hidden;
}

.chw-dock-ggb-caption {
  position: absolute;
  top: 4px;
  left: 8px;
  z-index: 2;
  font-size: 12px;
  color: #64748b;
  max-width: 70%;
}

.chw-dock-ggb-spin {
  position: absolute;
  inset: 0;
  z-index: 3;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.78);
}

.chw-dock-ggb-error {
  position: absolute;
  left: 8px;
  right: 8px;
  bottom: 8px;
  z-index: 2;
  font-size: 12px;
  color: #b45309;
  background: #fffbeb;
  border: 1px solid #fcd34d;
  border-radius: 6px;
  padding: 6px 8px;
}

.chw-dock-ggb-host {
  width: 100%;
  height: 100%;
}
.chw-interactive-dock {
  position: absolute;
  z-index: 36;
  display: flex;
  flex-direction: column;
  background: #fff;
  border: 1px solid var(--chw-border, #e8edf2);
  border-radius: 10px;
  box-shadow: 0 10px 36px rgba(15, 23, 42, 0.14);
  overflow: hidden;
  min-width: 260px;
}

.chw-interactive-dock.is-minimized {
  height: 44px !important;
}

.chw-interactive-dock-head {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 6px 8px 6px 12px;
  border-bottom: 1px solid var(--chw-border, #e8edf2);
  background: linear-gradient(180deg, #fbfcfd 0%, #f4f6f8 100%);
  cursor: -webkit-grab;
  cursor: grab;
  touch-action: none;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.chw-interactive-dock-head:active {
  cursor: -webkit-grabbing;
  cursor: grabbing;
}

.chw-interactive-dock-title {
  font-size: 13px;
  font-weight: 600;
  color: #1f1f1f;
  min-width: 0;
  flex: 1;
  pointer-events: none;
}

.chw-interactive-dock-body {
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  background: #fafafa;
}

.chw-interactive-dock-spin {
  position: absolute;
  inset: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.72);
}

.chw-interactive-dock-iframe {
  width: 100%;
  height: 100%;
  border: 0;
  display: block;
  background: #fff;
}

.chw-interactive-dock-answer {
  flex-shrink: 0;
  max-height: 72px;
  overflow: auto;
  padding: 6px 10px;
  font-size: 12px;
  line-height: 1.45;
  color: #1f2937;
  background: #f0f7ff;
  border-top: 1px solid #d6e4ff;
}

.chw-interactive-dock-answer-label {
  display: inline-block;
  margin-right: 6px;
  padding: 0 6px;
  border-radius: 4px;
  font-size: 11px;
  font-weight: 600;
  color: #1677ff;
  background: #e6f4ff;
}

.chw-interactive-dock-foot {
  flex-shrink: 0;
  display: flex;
  justify-content: flex-end;
  gap: 8px;
  padding: 8px 10px;
  border-top: 1px solid var(--chw-border, #e8edf2);
  background: #fff;
}

.chw-interactive-dock-resize {
  position: absolute;
  right: 2px;
  bottom: 2px;
  width: 16px;
  height: 16px;
  cursor: nwse-resize;
  touch-action: none;
  background:
    linear-gradient(
      135deg,
      transparent 50%,
      rgba(22, 119, 255, 0.55) 50%,
      rgba(22, 119, 255, 0.55) 62%,
      transparent 62%
    ),
    linear-gradient(
      135deg,
      transparent 68%,
      rgba(22, 119, 255, 0.55) 68%,
      rgba(22, 119, 255, 0.55) 80%,
      transparent 80%
    );
  border-radius: 2px;
}
.teacher-whiteboard-root {
  --chw-rail-w: 56px;
  --chw-rail-w-expanded: 148px;
  --chw-chrome-h: 44px;
  --chw-accent: #1677ff;
  --chw-surface: #ffffff;
  --chw-muted: #8c8c8c;
  --chw-border: #e8edf2;
  --chw-bg: #eef1f4;

  position: fixed;
  inset: 0;
  display: flex;
  flex-direction: column;
  background: var(--chw-bg);
  z-index: 100;
  color: #1f1f1f;
}

/* 授课台内嵌：勿 fixed 铺满视口，否则会盖住右侧「返回」与底栏 */
.live-whiteboard-wrap .teacher-whiteboard-root {
  position: absolute;
  inset: 0;
  z-index: 1;
  border-radius: inherit;
}

.teacher-whiteboard-root.rail-expanded {
  --chw-rail-w: var(--chw-rail-w-expanded);
}

.teacher-whiteboard-top-chrome {
  flex-shrink: 0;
  height: var(--chw-chrome-h);
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 0 12px 0 16px;
  background: linear-gradient(180deg, #fbfcfd 0%, #f4f6f8 100%);
  border-bottom: 1px solid var(--chw-border);
}

.teacher-whiteboard-top-chrome-left {
  display: flex;
  align-items: baseline;
  gap: 12px;
  min-width: 0;
}

.teacher-whiteboard-brand {
  font-weight: 650;
  font-size: 15px;
  letter-spacing: 0.02em;
  color: #141414;
  flex-shrink: 0;
}

.teacher-whiteboard-top-hint {
  font-size: 12px;
  color: var(--chw-muted);
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.teacher-whiteboard-window-controls {
  display: flex;
  align-items: center;
  gap: 2px;
  flex-shrink: 0;
}

.teacher-whiteboard-window-controls .chw-win-close:hover {
  background: #e81123 !important;
  color: #fff !important;
}

.teacher-whiteboard-main {
  flex: 1 1 auto;
  min-height: 0;
  display: flex;
  flex-direction: row;
  align-items: stretch;
}

.teacher-whiteboard-stage {
  flex: 1 1 auto;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  position: relative;
}

.teacher-whiteboard-canvas-wrap {
  flex: 1 1 auto;
  min-height: 0;
  position: relative;
  overflow: hidden;
  touch-action: none;
  background: #fff;
}

.teacher-whiteboard-canvas-wrap .chw-ai-draft-toolbar {
  z-index: 40;
}

/* 仅 Fabric 主画布；勿命中选区笔顺 hanzi-writer 的 canvas */
.teacher-whiteboard-canvas-wrap > canvas {
  display: block;
}

.teacher-whiteboard-page-bar {
  position: absolute;
  left: 50%;
  bottom: 14px;
  transform: translateX(-50%);
  z-index: 8;
  display: flex;
  align-items: center;
  gap: 4px;
  padding: 4px 10px;
  background: rgba(255, 255, 255, 0.92);
  border: 1px solid var(--chw-border);
  border-radius: 999px;
  box-shadow: 0 4px 16px rgba(15, 23, 42, 0.08);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
  font-size: 13px;
}

.teacher-whiteboard-page-indicator {
  min-width: 48px;
  text-align: center;
  font-variant-numeric: tabular-nums;
  color: #434343;
  font-weight: 500;
}

/* —— 右侧工具轨 —— */
.teacher-whiteboard-right-rail {
  flex: 0 0 var(--chw-rail-w);
  width: var(--chw-rail-w);
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 10px 8px 12px;
  background: var(--chw-surface);
  border-left: 1px solid var(--chw-border);
  box-shadow: -4px 0 20px rgba(15, 23, 42, 0.04);
  overflow-x: hidden;
  overflow-y: auto;
  z-index: 20;
  transition: width 0.18s ease, flex-basis 0.18s ease;
}

.chw-rail-section {
  display: flex;
  flex-direction: column;
  gap: 4px;
  padding-bottom: 8px;
  margin-bottom: 6px;
  border-bottom: 1px solid #f0f2f5;
}

.chw-rail-section:last-of-type {
  border-bottom: none;
}

.chw-rail-section-title {
  min-height: 14px;
  font-size: 11px;
  font-weight: 600;
  color: #bfbfbf;
  letter-spacing: 0.06em;
  text-transform: uppercase;
  padding: 0 4px 2px;
}

.chw-rail-btn {
  display: flex;
  align-items: center;
  gap: 8px;
  width: 100%;
  min-height: 40px;
  margin: 0;
  padding: 8px;
  border: 1px solid transparent;
  border-radius: 10px;
  background: transparent;
  color: #434343;
  cursor: pointer;
  font-size: 13px;
  line-height: 1.2;
  text-align: left;
  transition: background 0.15s, border-color 0.15s, color 0.15s, box-shadow 0.15s;
}

.teacher-whiteboard-root.rail-collapsed .chw-rail-btn {
  justify-content: center;
  padding: 8px 0;
}

.chw-rail-btn:hover:not(:disabled) {
  background: #f5f8fc;
  border-color: #d6e4ff;
  color: var(--chw-accent);
}

.chw-rail-btn.is-active {
  background: #e6f4ff;
  border-color: #91caff;
  color: var(--chw-accent);
  font-weight: 600;
  box-shadow: inset 0 0 0 1px rgba(22, 119, 255, 0.08);
}

.chw-rail-btn.is-primary {
  background: linear-gradient(160deg, #3c8cff 0%, #1677ff 100%);
  border-color: transparent;
  color: #fff;
  font-weight: 600;
  box-shadow: 0 4px 12px rgba(22, 119, 255, 0.28);
}

.chw-rail-btn.is-primary:hover:not(:disabled) {
  -webkit-filter: brightness(1.04);
          filter: brightness(1.04);
  color: #fff;
  border-color: transparent;
}

.chw-rail-btn.is-danger:hover:not(:disabled) {
  background: #fff1f0;
  border-color: #ffa39e;
  color: #cf1322;
}

.chw-rail-btn:disabled {
  opacity: 0.45;
  cursor: not-allowed;
}

.chw-rail-btn-icon {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 22px;
  height: 22px;
  font-size: 17px;
  flex-shrink: 0;
}

.chw-rail-btn-label {
  flex: 1 1 auto;
  min-width: 0;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.chw-rail-ai-wrap {
  width: 100%;
}

.chw-rail-ai-wrap .ant-dropdown-trigger {
  display: block;
  width: 100%;
}

.chw-rail-slider {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  padding: 4px 2px 8px;
}

.teacher-whiteboard-root.rail-expanded .chw-rail-slider {
  flex-direction: row;
  align-items: center;
  gap: 8px;
  padding: 4px 6px 8px;
}

.chw-rail-slider.is-disabled {
  opacity: 0.4;
  pointer-events: none;
}

.chw-rail-slider-icon {
  color: var(--chw-muted);
  font-size: 14px;
}

.chw-rail-slider-val {
  font-size: 11px;
  color: var(--chw-muted);
  min-width: 18px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.chw-rail-zoom-slider {
  padding: 0 4px 4px;
}

.chw-rail-zoom-slider .ant-slider {
  margin: 4px 0 0;
}

.chw-rail-footer {
  margin-top: auto;
  padding-top: 8px;
  border-top: 1px solid #f0f2f5;
}

.chw-rail-help {
  width: 100%;
  margin: 2px 0 4px;
}

.chw-rail-help-body {
  margin-top: 6px;
  padding: 8px;
  border-radius: 8px;
  background: #fafbfc;
  border: 1px solid #f0f2f5;
  font-size: 11px;
  line-height: 1.45;
  color: #595959;
}

.chw-rail-help-body p {
  margin: 0 0 6px;
}

.chw-rail-help-body p:last-child {
  margin-bottom: 0;
}

.chw-rail-help-muted {
  color: #bfbfbf;
}

.chw-rail-help-solid {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px dashed #e8e8e8;
}

.chw-rail-help-solid-title {
  font-weight: 600;
  color: #262626;
  margin-bottom: 2px;
}

.chw-rail-help-solid-topic {
  color: #1677ff;
  margin-bottom: 4px;
  word-break: break-word;
}

.chw-rail-help-solid ul {
  margin: 0;
  padding-left: 1.1em;
}

.chw-rail-help-solid li {
  margin: 2px 0;
}

.chw-text-style-fold {
  width: 100%;
  margin: 2px 0 4px;
}

.chw-text-style-fold-head {
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
  border: 1px solid var(--chw-border);
  background: #fafbfc;
  border-radius: 8px;
  padding: 6px 8px;
  cursor: pointer;
  color: #434343;
  font-size: 12px;
  line-height: 1.2;
}

.chw-text-style-fold-head:hover {
  border-color: #91caff;
  background: #f0f7ff;
}

.chw-text-style-fold-left {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  min-width: 0;
}

.chw-text-style-fold-sum {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  color: var(--chw-muted);
  font-size: 11px;
  flex-shrink: 0;
}

.chw-text-style-fold-sum i {
  width: 10px;
  height: 10px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.15);
  display: inline-block;
}

.chw-text-style-panel {
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding: 8px 4px 6px;
}

.chw-text-style-row {
  display: flex;
  align-items: center;
  gap: 6px;
}

.chw-text-style-ico {
  color: var(--chw-muted);
  font-size: 13px;
  flex-shrink: 0;
}

.chw-text-style-val {
  font-size: 11px;
  color: var(--chw-muted);
  min-width: 20px;
  text-align: right;
  font-variant-numeric: tabular-nums;
}

.chw-text-style-sizes {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
}

.chw-text-size-chip {
  border: 1px solid var(--chw-border);
  background: #fff;
  border-radius: 4px;
  font-size: 11px;
  line-height: 1;
  padding: 3px 5px;
  cursor: pointer;
  color: #595959;
}

.chw-text-size-chip.is-active {
  border-color: var(--chw-accent);
  color: var(--chw-accent);
  background: #e6f4ff;
}

.chw-text-style-actions {
  gap: 8px;
}

.chw-text-style-toggle {
  width: 28px;
  height: 28px;
  border: 1px solid var(--chw-border);
  border-radius: 6px;
  background: #fff;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
  color: #595959;
  padding: 0;
}

.chw-text-style-toggle.is-active {
  border-color: var(--chw-accent);
  color: var(--chw-accent);
  background: #e6f4ff;
}

.chw-text-style-toggle.is-static {
  cursor: default;
  opacity: 0.85;
}

.chw-text-style-colors {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.chw-text-style-colors.is-compact {
  margin-top: 4px;
}

.chw-text-color-swatch {
  width: 18px;
  height: 18px;
  border-radius: 50%;
  border: 1px solid rgba(0, 0, 0, 0.12);
  padding: 0;
  cursor: pointer;
}

.chw-text-color-swatch.is-sm {
  width: 14px;
  height: 14px;
}

.chw-text-color-swatch.is-light {
  border-color: #bfbfbf;
}

.chw-text-color-swatch.is-active {
  outline: 2px solid var(--chw-accent);
  outline-offset: 1px;
}

.chw-text-style-hint {
  font-size: 11px;
  color: var(--chw-muted);
}

.chw-text-style-btns {
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.chw-text-style-foot {
  font-size: 10px;
  color: #bfbfbf;
  line-height: 1.35;
}

/* 兼容旧类名（若外部仍引用） */
.teacher-whiteboard-toolbar,
.teacher-whiteboard-mini-toolbar {
  display: none !important;
}

@media screen and (max-width: 900px) {
  .teacher-whiteboard-top-hint {
    display: none;
  }

  .teacher-whiteboard-root.rail-expanded {
    --chw-rail-w: 120px;
  }
}
.live-rail {
  position: absolute;
  right: 12px;
  top: 50%;
  transform: translateY(-50%);
  width: 148px;
  max-height: calc(100vh - 96px);
  overflow-y: auto;
  background: rgba(255, 255, 255, 0.94);
  border-radius: 16px;
  box-shadow: 0 8px 28px rgba(0, 0, 0, 0.18);
  padding: 10px 8px 12px;
  z-index: 40;
  scrollbar-width: thin;
}

.live-rail-presence {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  font-weight: 600;
  font-size: 14px;
  margin-bottom: 8px;
  color: #262626;
}

.live-rail-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 8px 6px;
}

.live-rail-btn {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 4px;
  border: none;
  background: transparent;
  cursor: pointer;
  padding: 4px;
  border-radius: 10px;
}

.live-rail-btn:hover {
  background: rgba(22, 119, 255, 0.08);
}

.live-rail-btn.is-active .live-rail-icon {
  background: #1677ff;
  color: #fff;
}

.live-rail-btn.is-danger .live-rail-icon {
  background: #ff4d4f;
  color: #fff;
}

.live-rail-icon {
  width: 48px;
  height: 48px;
  border-radius: 50%;
  background: #f5f5f5;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 22px;
  color: #434343;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.08);
}

.live-rail-label {
  font-size: 12px;
  color: #595959;
  line-height: 1.2;
}

.live-rail-collapsed-tab {
  position: absolute;
  right: 0;
  top: 40%;
  z-index: 40;
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
  border: none;
  background: #1677ff;
  color: #fff;
  padding: 16px 8px;
  border-radius: 8px 0 0 8px;
  cursor: pointer;
  font-size: 13px;
}
.live-bottom-bar {
  position: absolute;
  left: 16px;
  right: 170px;
  bottom: 12px;
  z-index: 35;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 10px 16px;
  background: rgba(255, 255, 255, 0.92);
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.12);
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}
.live-page {
  position: relative;
  width: 100vw;
  height: 100vh;
  overflow: hidden;
  background: linear-gradient(160deg, #e8f3ff 0%, #f7f9fc 45%, #eef2f7 100%);
}

.live-page--loading {
  display: flex;
  align-items: center;
  justify-content: center;
}

.live-center {
  position: absolute;
  inset: 0;
  padding: 12px 168px 72px 12px;
}

.live-whiteboard-wrap {
  position: relative;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  background: #fff;
  box-shadow: 0 4px 24px rgba(0, 0, 0, 0.08);
}

.live-ppt-stage {
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}

.live-ppt-card {
  width: min(560px, 92%);
  text-align: center;
  padding: 40px 28px;
  background: rgba(255, 255, 255, 0.95);
  border-radius: 20px;
  box-shadow: 0 12px 40px rgba(22, 119, 255, 0.12);
}

.live-buzz-banner,
.live-timer-banner {
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 16px;
  z-index: 50;
  padding: 10px 24px;
  border-radius: 999px;
  font-size: 20px;
  font-weight: 700;
  background: rgba(0, 0, 0, 0.75);
  color: #fff;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.2);
}

.live-timer-banner {
  top: 64px;
  background: rgba(22, 119, 255, 0.9);
  font-variant-numeric: tabular-nums;
}
.teacher-workspace {
  position: relative;
  min-height: 100vh;
  background-color: transparent !important; /* 确保在幻灯片模式下背景透明 */
}

/* 确保Layout和Content在幻灯片模式下背景透明 */
.teacher-workspace.ant-layout {
  background-color: transparent !important;
}

.teacher-workspace .ant-layout-content {
  background-color: transparent !important;
}

.workspace-overlay {
  /* 样式由内联样式控制，这里只保留基础样式 */
  pointer-events: none;
}

.teacher-workspace .ant-layout-content {
  position: relative;
  z-index: 0;
}

.welcome-card {
  background: linear-gradient(135deg, rgba(102, 126, 234, 0.9) 0%, rgba(118, 75, 162, 0.9) 100%);
  color: white;
  border: none;
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
}

.welcome-card .ant-card-body {
  color: white;
}

.welcome-card .ant-typography {
  color: white !important;
}

.welcome-card .ant-typography-title {
  color: white !important;
}

/* 文字界面卡片样式（提高不透明度，确保文字清晰） */
.teacher-workspace .ant-card {
  background: rgba(255, 255, 255, 1) !important; /* 完全不透明，确保文字清晰 */
  -webkit-backdrop-filter: blur(10px);
  backdrop-filter: blur(10px);
  border: 1px solid rgba(0, 0, 0, 0.1);
  box-shadow: 0 4px 20px rgba(0, 0, 0, 0.15);
  z-index: 0 !important; /* 确保卡片在对话窗口下方 */
  position: relative;
}

/* 确保卡片内所有文字颜色清晰可见 */
.teacher-workspace .ant-card .ant-card-head-title,
.teacher-workspace .ant-card .ant-card-body,
.teacher-workspace .ant-card .ant-typography,
.teacher-workspace .ant-card .ant-list-item,
.teacher-workspace .ant-card .ant-list-item-meta-title,
.teacher-workspace .ant-card .ant-list-item-meta-description {
  color: rgba(0, 0, 0, 0.85) !important;
}

/* 卡片标题文字 */
.teacher-workspace .ant-card .ant-card-head-title {
  color: rgba(0, 0, 0, 0.9) !important;
  font-weight: 600;
}

/* 次要文字颜色 */
.teacher-workspace .ant-card .ant-typography-secondary,
.teacher-workspace .ant-card .ant-list-item-meta-description {
  color: rgba(0, 0, 0, 0.65) !important;
}

/* 文字界面淡入动画 */
.teacher-workspace .ant-card:not(.welcome-card) {
  animation: fadeIn 0.5s ease;
}

@keyframes fadeIn {
  from {
    opacity: 0;
    transform: translateY(10px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* 确保body和html背景透明，让背景层可见 */
html, body, #root {
  background-color: transparent !important;
}

/* 确保Ant Design Layout默认背景透明（幻灯片模式） */
.ant-layout {
  background-color: transparent !important;
}

.ant-layout-content {
  background-color: transparent !important;
}

/* 幻灯片背景容器 */
.slideshow-background-container {
  position: fixed !important;
  z-index: -10 !important;
  pointer-events: none !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100vw !important;
  height: 100vh !important;
  /* 确保在最底层 */
  isolation: isolate !important;
}

/* 幻灯片背景层样式 */
.slideshow-background-layer {
  position: absolute !important;
  z-index: -10 !important;
  pointer-events: none !important;
  top: 0 !important;
  left: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  width: 100% !important;
  height: 100% !important;
  background-color: transparent !important;
  isolation: isolate !important; /* 创建新的层叠上下文，防止父元素opacity影响 */
  background-attachment: fixed !important; /* 确保背景图片固定 */
  background-size: cover !important;
  background-position: center !important;
  background-repeat: no-repeat !important;
}

.agent-visual-editor {
  padding: 20px;
  background: #f5f5f5;
  min-height: 100vh;
}

.agent-visual-editor .ant-card {
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.1);
  transition: box-shadow 0.3s;
}

.agent-visual-editor .ant-card:hover {
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.15);
}

.template-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 12px;
  margin-bottom: 16px;
}

.template-item {
  cursor: pointer;
  border: 2px solid #e8e8e8;
  border-radius: 8px;
  padding: 8px;
  transition: all 0.3s;
  text-align: center;
}

.template-item:hover {
  border-color: #1890ff;
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(24, 144, 255, 0.15);
}

.template-preview {
  width: 100%;
  height: 80px;
  border-radius: 4px;
  display: flex;
  align-items: center;
  justify-content: center;
  margin-bottom: 8px;
  background: #f5f5f5;
  position: relative;
  overflow: hidden;
  transition: transform 0.2s;
}

.template-item:hover .template-preview {
  transform: scale(1.05);
}

.template-name {
  font-size: 12px;
  color: #666;
  font-weight: 500;
}

/* 颜色选择器样式优化 */
.ant-color-picker {
  width: 100%;
}

/* 预览容器动画 */
.preview-container {
  position: relative;
}

.preview-container::before {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background: linear-gradient(45deg, transparent 30%, rgba(255, 255, 255, 0.1) 50%, transparent 70%);
  background-size: 200% 200%;
  animation: shimmer 3s infinite;
  pointer-events: none;
}

@keyframes shimmer {
  0% {
    background-position: -200% 0;
  }
  100% {
    background-position: 200% 0;
  }
}

/* 颜色预设按钮hover效果 */
.ant-popover-content .ant-space-item {
  transition: transform 0.2s;
}

.ant-popover-content .ant-space-item:hover {
  transform: scale(1.1);
}

/* 响应式设计 */
@media (max-width: 768px) {
  .agent-visual-editor {
    padding: 12px;
  }
  
  .template-grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 8px;
  }
  
  .template-preview {
    height: 60px;
  }
  
  .agent-visual-editor .ant-card-body {
    padding: 12px;
  }
}
/* 修复工作台标签页文字可读性问题 */

/* 非激活状态的标签页 - 使用浅色背景和深色文字 */
.workspace-tabs .ant-tabs-tab:not(.ant-tabs-tab-active) {
  background: #fafafa !important;
  border-color: #d9d9d9 !important;
}

.workspace-tabs .ant-tabs-tab:not(.ant-tabs-tab-active) .ant-tabs-tab-btn {
  color: rgba(0, 0, 0, 0.85) !important;
}

.workspace-tabs .ant-tabs-tab:not(.ant-tabs-tab-active) .anticon {
  color: rgba(0, 0, 0, 0.65) !important;
}

.workspace-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):hover {
  background: #f0f0f0 !important;
}

.workspace-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):hover .ant-tabs-tab-btn {
  color: rgba(0, 0, 0, 0.95) !important;
}

.workspace-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):hover .anticon {
  color: rgba(0, 0, 0, 0.85) !important;
}

/* 激活状态的标签页 - 使用白色背景和蓝色文字 */
.workspace-tabs .ant-tabs-tab-active {
  background: #fff !important;
  border-color: #1890ff !important;
  border-bottom-color: #fff !important;
}

.workspace-tabs .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: #1890ff !important;
  font-weight: 500;
}

.workspace-tabs .ant-tabs-tab-active .anticon {
  color: #1890ff !important;
}

/* 确保所有标签页文字都有足够的对比度 */
.workspace-tabs .ant-tabs-tab {
  transition: all 0.3s ease;
}

.workspace-tabs .ant-tabs-nav {
  flex-wrap: nowrap;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.workspace-tabs .ant-tabs-tab span {
  color: inherit;
}
.bell-schedule-card {
  border-radius: 12px;
}

.bell-schedule-title {
  text-align: center;
  margin: 0 0 4px !important;
  letter-spacing: 0.12em;
}

.bell-schedule-paste {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 16px 20px;
  border: 1px dashed #91caff;
  border-radius: 12px;
  background: #f5f9ff;
  outline: none;
}

.bell-schedule-paste:focus {
  border-color: #1677ff;
  box-shadow: 0 0 0 2px rgba(22, 119, 255, 0.15);
}

.bell-schedule-table-wrap {
  overflow-x: auto;
  max-width: 920px;
  margin: 0 auto;
}

.bell-schedule-table .ant-table-thead > tr > th {
  text-align: center;
  background: #fafafa;
}

.bell-schedule-table .ant-table-thead > tr:first-child > th {
  font-weight: 600;
}

.bell-block-label {
  -webkit-writing-mode: vertical-rl;
          writing-mode: vertical-rl;
  letter-spacing: 0.35em;
  font-weight: 600;
  color: rgba(0, 0, 0, 0.75);
}
* {
  margin: 0;
  padding: 0;
}

/* 不在此修改全局 html/body，避免嵌入「智慧校园 / 学校数据」等 Tabs 时锁死滚动、底部露出白底 */

.dashboard-container {
  box-sizing: border-box;
  width: 100%;
  min-height: 100vh;
  min-height: 100dvh;
  background-color: var(--dash-bg, #0a1524);
  background-image: url(/images/53bg.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center top;
  overflow-x: hidden;
  overflow-y: hidden;
  position: relative;
  --dash-primary: #09c4ca;
  --dash-accent: #f6c85f;
  --dash-bg: #0a1524;
}

.dashboard-container--bg-darker {
  background-color: #060e18;
}

.dashboard-container--bg-lighter {
  background-color: #122033;
}

.dashboard-customize-btn {
  position: absolute;
  top: 10px;
  right: 12px;
  z-index: 20;
  opacity: 0.92;
}

.dashboard-header-with-logo {
  display: flex !important;
  align-items: center;
  justify-content: center;
  gap: 0.6rem;
}

.dashboard-org-logo {
  height: 2.2rem;
  width: auto;
  max-width: 3.2rem;
  -o-object-fit: contain;
     object-fit: contain;
  vertical-align: middle;
}

/* 宽屏固定一屏布局：高度用视口，避免子元素百分比高度失效 */
@media (min-width: 768px) {
  .dashboard-container:not(.dashboard-container--compact) {
    height: 100vh;
    height: 100dvh;
    min-height: 0;
    overflow: hidden;
  }
}
ul,
li {
  list-style: none;
}
@font-face {
  font-family: 'LCdd';
  src: url('/fonts/LCdd.TTF');
}
header {
  height: 12%;
  width: 100%;
  background-color: #fff;
  background: url(/images/53titlebg.png) no-repeat top center;
  background-size: 100%;
  text-align: center;
}
header h1 {
  font-size: 2rem;
  height: 50%;
  margin: auto;
  display: table;
  font-weight: 500;
  background-image: -webkit-linear-gradient(bottom, #86919e, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
header h1 span {
  display: table-cell;
  vertical-align: middle;
}
header p {
  font-size: 1rem;
  background-image: -webkit-linear-gradient(bottom, #86919e, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}
.main {
  width: 100%;
  height: 78%;
  padding: 0 2.5%;
  box-sizing: border-box;
  position: relative;
}
.main .top5 {
  width: 17.5%;
  height: 70%;
  float: left;
}
.main .top5 .top5-title {
  width: 100%;
  height: 10%;
  background: url(/images/title.png) no-repeat center;
  background-size: 100%;
  color: #fff;
  text-align: center;
  display: table;
  font-size: 0.9rem;
}
.main .top5 .top5-title span {
  display: table-cell;
  vertical-align: middle;
}
.main .top5 .top5-content {
  width: 100%;
  height: 80%;
}
.main .top5 .top5-content ul {
  width: 100%;
  height: 100%;
}
.main .top5 .top5-content ul li {
  width: 100%;
  height: 15%;
  margin-top: 5%;
  position: relative;
}
.main .top5 .top5-content ul li .li-content {
  width: 90%;
  height: 100%;
  margin-left: 5%;
  background: url(/images/border.png) no-repeat center;
  background-size: contain;
  font-size: 0.7rem;
  padding-left: 15%;
  padding-top: 6%;
  color: #fff;
  box-sizing: border-box;
}
.main .top5 .top5-content ul li .li-content span {
  margin-right: 2%;
}
.main .top5 .top5-content ul li .cicle {
  content: '';
  display: block;
  position: absolute;
  width: 1.7rem;
  height: 1.7rem;
  background: url(/images/green.png) no-repeat center;
  background-size: 100%;
  left: 0;
  bottom: 0;
}
.main .top5 .top5-content ul li:nth-of-type(1) .li-content {
  background: url(/images/border2.png) no-repeat center;
  background-size: contain;
}
.main .top5 .top5-content ul li:nth-of-type(1) .cicle {
  background: url(/images/orange.png) no-repeat center;
  background-size: 100%;
}
.main .total {
  width: 65%;
  height: 100%;
  float: left;
  position: relative;
}
.main .total .rain {
  position: absolute;
  left: 0;
  top: 0;
  z-index: 1;
  pointer-events: none;
}
.main .total .data1,
.main .total .data2,
.main .total .data3,
.main .total .data4 {
  width: 8rem;
  height: 4rem;
  position: absolute;
}
.main .total .data1 span,
.main .total .data2 span,
.main .total .data3 span,
.main .total .data4 span {
  color: #0ac1c7;
  font-size: 0.8rem;
  font-family: '宋体';
}
.main .total .data1 p,
.main .total .data2 p,
.main .total .data3 p,
.main .total .data4 p {
  font-family: 'LCdd';
  font-size: 1.5rem;
  color: #f29701;
}
.main .total .data1 {
  left: 10%;
  top: 12%;
}
.main .total .data2 {
  left: 42%;
  top: 3%;
}
.main .total .data3 {
  left: 62%;
  top: 5%;
}
.main .total .data4 {
  left: 73%;
  top: 28%;
}
.main .total .dashed {
  position: absolute;
  left: 0;
  top: 0;
}
.main .total .sphere {
  width: 20rem;
  height: 20rem;
  position: relative;
  margin: 14% auto 0;
}
.main .total .sphere .sphere-bg {
  position: absolute;
  z-index: 100;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url(/images/53earth.png) no-repeat center;
  background-size: contain;
}
.main .total .sphere .sum {
  position: absolute;
  z-index: 100;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background: url(/images/53cloud.png) no-repeat center;
  background-size: 55%;
}
.main .total .sphere .sum span {
  display: block;
  margin-top: 30%;
  padding-left: 32%;
  color: #005a79;
  font-size: 0.9rem;
}
.main .total .sphere .sum p {
  margin-top: 2%;
  text-align: center;
  color: #003c63;
  font-family: 'LCdd';
  font-size: 2rem;
}
.main .total .cicle3 {
  width: 35rem;
  height: 35rem;
  background: url(/images/circle.png) no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 20%;
  left: 50%;
  transform-style: preserve-3d;
  transform: translateX(-50%) rotateX(75deg);
  animation: rotate3 20s linear infinite;
}
.main .total .cicle4 {
  width: 15rem;
  height: 15rem;
  position: absolute;
  top: 60%;
  left: 50%;
  transform-style: preserve-3d;
  background: url(/images/53gqright.png) no-repeat center;
  background-size: 100%;
  transform: translateX(-50%) rotateX(75deg);
  animation: rotate3 2s linear infinite;
}
.main .total .cicle5 {
  width: 15rem;
  height: 15rem;
  position: absolute;
  top: 62%;
  left: 50%;
  transform-style: preserve-3d;
  background: url(/images/53gqleft.png) no-repeat center;
  background-size: 100%;
  transform: translateX(-50%) rotateX(75deg);
  animation: rotate4 2s linear infinite;
}
.main .total .cicle6 {
  width: 12rem;
  height: 12rem;
  position: absolute;
  top: 70%;
  left: 50%;
  transform-style: preserve-3d;
  background: url(/images/535gqbottomright.png) no-repeat center;
  background-size: 100%;
  transform: translateX(-50%) rotateX(75deg);
  animation: rotate3 2s linear infinite;
}
.main .total .cicle7 {
  width: 12rem;
  height: 12rem;
  position: absolute;
  top: 72%;
  left: 50%;
  transform-style: preserve-3d;
  background: url(/images/53gqbottomleft.png) no-repeat center;
  background-size: 100%;
  transform: translateX(-50%) rotateX(75deg);
  animation: rotate4 2s linear infinite;
}
.main .total .cicle8,
.main .total .cicle9,
.main .total .cicle10,
.main .total .cicle11 {
  width: 5rem;
  height: 5rem;
  position: absolute;
  top: 50%;
  left: 50%;
  z-index: 100;
  margin-left: -2.5rem;
  border-radius: 50%;
}
.main .total .cicle8 span,
.main .total .cicle9 span,
.main .total .cicle10 span,
.main .total .cicle11 span {
  font-family: 'LCdd';
  display: block;
  margin-left: 25%;
  font-size: 1.5rem;
  margin-top: 20%;
}
.main .total .cicle8 p,
.main .total .cicle9 p,
.main .total .cicle10 p,
.main .total .cicle11 p {
  text-align: center;
  font-size: 0.7rem;
}
.main .total .cicle8 {
  background: url(/images/circle1.png) no-repeat;
  background-size: 100%;
  animation: rotate5 20s linear infinite;
  color: #f29701;
}
.main .total .cicle9 {
  background: url(/images/circle2.png) no-repeat;
  background-size: 100%;
  animation: rotate6 20s linear infinite;
  color: #0ac1c7;
}
.main .total .cicle10 {
  background: url(/images/circle1.png) no-repeat;
  background-size: 100%;
  animation: rotate7 20s linear infinite;
  color: #f29701;
}
.main .total .cicle11 {
  background: url(/images/circle2.png) no-repeat;
  background-size: 100%;
  color: #0ac1c7;
  animation: rotate8 20s linear infinite;
}
.main .analyse {
  width: 17.5%;
  height: 70%;
  float: left;
}
.main .analyse .analyse-title {
  width: 100%;
  height: 10%;
  background: url(/images/title.png) no-repeat center;
  background-size: 100%;
  color: #fff;
  text-align: center;
  display: table;
  font-size: 0.9rem;
}
.main .analyse .analyse-title span {
  display: table-cell;
  vertical-align: middle;
}
.main .analyse ul {
  width: 100%;
  height: 60%;
}
.main .analyse ul li {
  width: 100%;
  height: 30%;
  margin: 3% 0;
}
.main .analyse ul li img {
  height: 80%;
  float: left;
  vertical-align: 0%;
}
.main .analyse ul li h5 {
  float: left;
  color: #fff;
  margin-left: 5%;
}
.main .analyse ul li span {
  font-size: 0.5rem;
  float: left;
  color: #fff;
  margin-left: 5%;
}
.main .analyse ul li em {
  font-style: normal;
  font-size: 1.3rem;
  margin-left: 5%;
  color: #0ac1c7;
}
.main .analyse ul li:nth-of-type(1) em {
  color: #f29701;
}
.main .analyse .execution {
  width: 100%;
  height: 30%;
  background: url(/images/execution.png) no-repeat;
  background-size: contain;
  overflow: hidden;
  position: relative;
}
.main .analyse .execution .title {
  -webkit-writing-mode: vertical-lr;
          writing-mode: vertical-lr;
  font-size: 0.7rem;
  margin-left: 3%;
  margin-top: 3%;
  color: #fff;
}
.main .analyse .execution .cicle1,
.main .analyse .execution .cicle2 {
  position: absolute;
  width: 4rem;
  height: 4rem;
  background: url(/images/2222.png) no-repeat center;
  background-size: 100%;
  transform-style: preserve-3d;
  transform: rotateX(75deg);
  animation: rotate2 1s linear infinite;
}
.main .analyse .execution .cicle1 {
  top: 47%;
  left: 20%;
}
.main .analyse .execution .cicle2 {
  top: 47%;
  left: 63%;
}
.main .analyse .execution .waterChart1,
.main .analyse .execution .waterChart2 {
  position: absolute;
  width: 4rem;
  height: 5rem;
}
.main .analyse .execution .waterChart1 .chart-title,
.main .analyse .execution .waterChart2 .chart-title {
  height: 20%;
  font-size: 0.6rem;
  text-align: center;
  color: #fff;
}
.main .analyse .execution .waterChart1 .chart1,
.main .analyse .execution .waterChart2 .chart1,
.main .analyse .execution .waterChart1 .chart2,
.main .analyse .execution .waterChart2 .chart2 {
  width: 100%;
  height: 80%;
}
.main .analyse .execution .waterChart1 {
  top: 0%;
  left: 20%;
}
.main .analyse .execution .waterChart2 {
  top: 0%;
  left: 63%;
}
.main .sale {
  width: 27.5%;
  height: 30%;
  position: absolute;
  bottom: 0;
  left: 2.5%;
}
.main .sale ul {
  width: 100%;
  height: 100%;
  overflow: hidden;
}
.main .sale ul li {
  width: 100%;
  height: 30%;
  margin-top: 1%;
  display: flex;
  flex-direction: row;
  align-items: center;
  box-sizing: border-box;
}
.main .sale ul li .showImg {
  flex: 0 0 8%;
  height: 100%;
  text-align: center;
}
.main .sale ul li .showImg img {
  vertical-align: 0%;
  width: 70%;
  margin-top: 30%;
}
.main .sale ul li .data {
  flex: 0 0 26%;
  min-width: 0;
  height: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: flex-start;
  padding: 0 0.15rem 0 0.1rem;
  box-sizing: border-box;
  text-align: left;
}
.main .sale ul li .data span {
  color: #fff;
  font-size: 0.55rem;
  line-height: 1.25;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 100%;
}
.main .sale ul li .data span:nth-of-type(2) {
  color: #0ac1c7;
  font-size: 0.65rem;
  font-weight: 600;
}
.main .sale ul li .shoeChart,
.main .sale ul li .clothesChart,
.main .sale ul li .mzChart {
  height: 100%;
  flex: 1 1 58%;
  min-width: 0;
}
.main .lineChart {
  width: 27.5%;
  height: 30%;
  position: absolute;
  bottom: 0;
  right: 2.5%;
}

/* ── 教师档案概览卡片（底部中间区域） ── */
.main .teacherStats {
  width: 42.5%;
  height: 30%;
  position: absolute;
  bottom: 0;
  left: 30%;
  background: rgba(9, 21, 36, 0.85);
  border: 1px solid rgba(9, 196, 202, 0.25);
  border-radius: 4px;
  box-sizing: border-box;
  overflow: hidden;
  display: flex;
  flex-direction: column;
}

.main .teacherStats-header {
  display: flex;
  align-items: center;
  gap: 0.6rem;
  padding: 0.2rem 0.5rem;
  border-bottom: 1px solid rgba(9, 196, 202, 0.2);
  flex-shrink: 0;
}

.main .teacherStats-title {
  color: #09c4ca;
  font-size: 0.7rem;
  font-weight: 600;
}

.main .teacherStats-count {
  color: rgba(255, 255, 255, 0.75);
  font-size: 0.55rem;
  margin-left: auto;
}

.main .teacherStats-count strong {
  color: #f6c85f;
  font-size: 0.7rem;
}

.main .teacherStats-config-btn {
  background: transparent;
  border: 1px solid rgba(9, 196, 202, 0.35);
  color: rgba(255, 255, 255, 0.6);
  font-size: 0.55rem;
  cursor: pointer;
  border-radius: 3px;
  padding: 0.1rem 0.3rem;
  transition: all 0.2s;
}

.main .teacherStats-config-btn:hover {
  color: #09c4ca;
  border-color: #09c4ca;
}

/* 图表自定义设置面板 */
.main .teacherStats-config-panel {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3rem 0.8rem;
  padding: 0.15rem 0.5rem;
  background: rgba(0, 0, 0, 0.3);
  border-bottom: 1px solid rgba(9, 196, 202, 0.15);
  flex-shrink: 0;
}

.main .teacherStats-config-panel label {
  display: flex;
  align-items: center;
  gap: 0.15rem;
  color: rgba(255, 255, 255, 0.7);
  font-size: 0.5rem;
  cursor: pointer;
}

.main .teacherStats-config-panel label input[type="checkbox"] {
  accent-color: #09c4ca;
  cursor: pointer;
}

/* 饼图网格 */
.main .teacherStats-grid {
  flex: 1;
  display: flex;
  flex-wrap: wrap;
  padding: 0.15rem;
  min-height: 0;
}

.main .teacherStats-chart-item {
  flex: 0 0 50%;
  height: 50%;
  box-sizing: border-box;
  padding: 0.1rem;
}

.main .teacherStats-chart {
  width: 100%;
  height: 100%;
}

/* 当只有 1 个图表时占满 */
.main .teacherStats-grid.single .teacherStats-chart-item {
  flex: 0 0 100%;
  height: 100%;
}
/* 当只有 2 个图表时并排 */
.main .teacherStats-grid.double .teacherStats-chart-item {
  flex: 0 0 50%;
  height: 100%;
}
.bottom {
  width: 100%;
  height: 10%;
  background: url(/images/53bottomsjbg.png) no-repeat bottom center;
  background-size: 100%;
  text-align: center;
}
.bottom h5 {
  background-image: -webkit-linear-gradient(bottom, #86919e, #fff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  height: 40%;
  display: table;
  margin: auto;
}
.bottom h5 span {
  display: table-cell;
  vertical-align: middle;
}
.bottom p {
  color: #0ac1c7;
  font-size: 0.6rem;
}
@keyframes rotate {
  0% {
    transform: rotate(0);
  }
  100% {
    transform: rotate(360deg);
  }
}
@keyframes rotate2 {
  0% {
    transform: rotateX(75deg) rotateZ(0);
  }
  100% {
    transform: rotateX(75deg) rotateZ(360deg);
  }
}
@keyframes rotate3 {
  0% {
    transform: translateX(-50%) rotateX(75deg) rotateZ(0);
  }
  100% {
    transform: translateX(-50%) rotateX(75deg) rotateZ(360deg);
  }
}
@keyframes rotate4 {
  0% {
    transform: translateX(-50%) rotateX(75deg) rotateZ(0);
  }
  100% {
    transform: translateX(-50%) rotateX(75deg) rotateZ(-360deg);
  }
}
@keyframes rotate5 {
  0% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, 270, 0, 0, 1);
    z-index: 100;
  }
  1% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, 269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  2% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, 267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  3% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, 265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  4% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, 261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  5% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, 256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  6% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, 251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  7% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, 244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  8% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, 236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  9% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, 227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  10% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, 218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  11% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, 208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  12% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, 196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  13% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, 184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  14% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, 172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  15% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, 158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  16% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, 144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  17% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, 130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  18% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, 114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  19% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, 99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  20% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, 83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  21% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, 67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  22% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, 50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  23% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, 33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  24% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, 16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  25% {
    transform: matrix3d(1.23333, 0, 0, 0, 0, 1.23333, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1);
    z-index: 101;
  }
  26% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, -16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  27% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, -33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  28% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, -50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  29% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, -67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  30% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, -83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  31% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, -99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  32% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, -114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  33% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, -130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  34% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, -144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  35% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, -158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  36% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, -172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  37% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, -184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  38% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, -196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  39% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, -208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  40% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, -218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  41% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, -227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  42% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, -236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  43% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, -244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  44% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, -251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  45% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, -256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  46% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, -261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  47% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, -265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  48% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, -267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  49% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, -269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  50% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, -270, 0, 0, 1);
    z-index: 100;
  }
  51% {
    transform: matrix3d(0.87907, 0, 0, 0, 0, 0.87907, 0, 0, 0, 0, 1, 0, -269.46722, -6.27905, 0, 1);
    z-index: 99.93721;
  }
  52% {
    transform: matrix3d(0.85822, 0, 0, 0, 0, 0.85822, 0, 0, 0, 0, 1, 0, -267.87097, -12.53332, 0, 1);
    z-index: 99.87467;
  }
  53% {
    transform: matrix3d(0.83754, 0, 0, 0, 0, 0.83754, 0, 0, 0, 0, 1, 0, -265.21756, -18.73813, 0, 1);
    z-index: 99.81262;
  }
  54% {
    transform: matrix3d(0.8171, 0, 0, 0, 0, 0.8171, 0, 0, 0, 0, 1, 0, -261.51745, -24.86899, 0, 1);
    z-index: 99.75131;
  }
  55% {
    transform: matrix3d(0.79699, 0, 0, 0, 0, 0.79699, 0, 0, 0, 0, 1, 0, -256.78526, -30.9017, 0, 1);
    z-index: 99.69098;
  }
  56% {
    transform: matrix3d(0.77729, 0, 0, 0, 0, 0.77729, 0, 0, 0, 0, 1, 0, -251.03965, -36.81246, 0, 1);
    z-index: 99.63188;
  }
  57% {
    transform: matrix3d(0.75807, 0, 0, 0, 0, 0.75807, 0, 0, 0, 0, 1, 0, -244.3033, -42.57793, 0, 1);
    z-index: 99.57422;
  }
  58% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, -236.6028, -48.17537, 0, 1);
    z-index: 99.51825;
  }
  59% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, -227.96854, -53.58268, 0, 1);
    z-index: 99.46417;
  }
  60% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, -218.43459, -58.77853, 0, 1);
    z-index: 99.41221;
  }
  61% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, -208.03857, -63.7424, 0, 1);
    z-index: 99.36258;
  }
  62% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, -196.82153, -68.45471, 0, 1);
    z-index: 99.31545;
  }
  63% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, -184.82772, -72.89686, 0, 1);
    z-index: 99.27103;
  }
  64% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, -172.10447, -77.05132, 0, 1);
    z-index: 99.22949;
  }
  65% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, -158.70201, -80.9017, 0, 1);
    z-index: 99.19098;
  }
  66% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, -144.67323, -84.43279, 0, 1);
    z-index: 99.15567;
  }
  67% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, -130.07348, -87.63067, 0, 1);
    z-index: 99.12369;
  }
  68% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, -114.96039, -90.4827, 0, 1);
    z-index: 99.09517;
  }
  69% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, -99.39361, -92.97765, 0, 1);
    z-index: 99.07022;
  }
  70% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, -83.43456, -95.10565, 0, 1);
    z-index: 99.04894;
  }
  71% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, -67.14622, -96.85831, 0, 1);
    z-index: 99.03142;
  }
  72% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, -50.59289, -98.22872, 0, 1);
    z-index: 99.01771;
  }
  73% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, -33.83989, -99.21146, 0, 1);
    z-index: 99.00789;
  }
  74% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, -16.95333, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  75% {
    transform: matrix3d(0.56667, 0, 0, 0, 0, 0.56667, 0, 0, 0, 0, 1, 0, 0.00015, -99.99999, 0, 1);
    z-index: 99;
  }
  76% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, 16.95364, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  77% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, 33.84024, -99.21145, 0, 1);
    z-index: 99.00789;
  }
  78% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, 50.59331, -98.2287, 0, 1);
    z-index: 99.01771;
  }
  79% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, 67.14674, -96.85828, 0, 1);
    z-index: 99.03142;
  }
  80% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, 83.4352, -95.1056, 0, 1);
    z-index: 99.04894;
  }
  81% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, 99.39444, -92.97758, 0, 1);
    z-index: 99.07022;
  }
  82% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, 114.96147, -90.48262, 0, 1);
    z-index: 99.09517;
  }
  83% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, 130.07487, -87.63055, 0, 1);
    z-index: 99.12369;
  }
  84% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, 144.67503, -84.43264, 0, 1);
    z-index: 99.15567;
  }
  85% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, 158.70434, -80.9015, 0, 1);
    z-index: 99.19099;
  }
  86% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, 172.10748, -77.05106, 0, 1);
    z-index: 99.22949;
  }
  87% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, 184.83158, -72.89652, 0, 1);
    z-index: 99.27103;
  }
  88% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, 196.82649, -68.45427, 0, 1);
    z-index: 99.31546;
  }
  89% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, 208.04493, -63.74182, 0, 1);
    z-index: 99.36258;
  }
  90% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, 218.4427, -58.77778, 0, 1);
    z-index: 99.41222;
  }
  91% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, 227.97887, -53.58172, 0, 1);
    z-index: 99.46418;
  }
  92% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, 236.61593, -48.17414, 0, 1);
    z-index: 99.51826;
  }
  93% {
    transform: matrix3d(0.75808, 0, 0, 0, 0, 0.75808, 0, 0, 0, 0, 1, 0, 244.31993, -42.57636, 0, 1);
    z-index: 99.57424;
  }
  94% {
    transform: matrix3d(0.7773, 0, 0, 0, 0, 0.7773, 0, 0, 0, 0, 1, 0, 251.06067, -36.81045, 0, 1);
    z-index: 99.6319;
  }
  95% {
    transform: matrix3d(0.797, 0, 0, 0, 0, 0.797, 0, 0, 0, 0, 1, 0, 256.81175, -30.89914, 0, 1);
    z-index: 99.69101;
  }
  96% {
    transform: matrix3d(0.81711, 0, 0, 0, 0, 0.81711, 0, 0, 0, 0, 1, 0, 261.55076, -24.86574, 0, 1);
    z-index: 99.75134;
  }
  97% {
    transform: matrix3d(0.83755, 0, 0, 0, 0, 0.83755, 0, 0, 0, 0, 1, 0, 265.25934, -18.73401, 0, 1);
    z-index: 99.81266;
  }
  98% {
    transform: matrix3d(0.85824, 0, 0, 0, 0, 0.85824, 0, 0, 0, 0, 1, 0, 267.92326, -12.52811, 0, 1);
    z-index: 99.87472;
  }
  99% {
    transform: matrix3d(0.87909, 0, 0, 0, 0, 0.87909, 0, 0, 0, 0, 1, 0, 269.5325, -6.27248, 0, 1);
    z-index: 99.93728;
  }
  100% {
    transform: matrix3d(0.90003, 0, 0, 0, 0, 0.90003, 0, 0, 0, 0, 1, 0, 270.08133, 0.00827, 0, 1);
    z-index: 100.00008;
  }
}
@keyframes rotate6 {
  0% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, -16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  1% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, -33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  2% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, -50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  3% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, -67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  4% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, -83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  5% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, -99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  6% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, -114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  7% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, -130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  8% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, -144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  9% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, -158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  10% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, -172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  11% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, -184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  12% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, -196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  13% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, -208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  14% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, -218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  15% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, -227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  16% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, -236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  17% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, -244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  18% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, -251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  19% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, -256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  20% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, -261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  21% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, -265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  22% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, -267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  23% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, -269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  24% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, -270, 0, 0, 1);
    z-index: 100;
  }
  25% {
    transform: matrix3d(0.87907, 0, 0, 0, 0, 0.87907, 0, 0, 0, 0, 1, 0, -269.46722, -6.27905, 0, 1);
    z-index: 99.93721;
  }
  26% {
    transform: matrix3d(0.85822, 0, 0, 0, 0, 0.85822, 0, 0, 0, 0, 1, 0, -267.87097, -12.53332, 0, 1);
    z-index: 99.87467;
  }
  27% {
    transform: matrix3d(0.83754, 0, 0, 0, 0, 0.83754, 0, 0, 0, 0, 1, 0, -265.21756, -18.73813, 0, 1);
    z-index: 99.81262;
  }
  28% {
    transform: matrix3d(0.8171, 0, 0, 0, 0, 0.8171, 0, 0, 0, 0, 1, 0, -261.51745, -24.86899, 0, 1);
    z-index: 99.75131;
  }
  29% {
    transform: matrix3d(0.79699, 0, 0, 0, 0, 0.79699, 0, 0, 0, 0, 1, 0, -256.78526, -30.9017, 0, 1);
    z-index: 99.69098;
  }
  30% {
    transform: matrix3d(0.77729, 0, 0, 0, 0, 0.77729, 0, 0, 0, 0, 1, 0, -251.03965, -36.81246, 0, 1);
    z-index: 99.63188;
  }
  31% {
    transform: matrix3d(0.75807, 0, 0, 0, 0, 0.75807, 0, 0, 0, 0, 1, 0, -244.3033, -42.57793, 0, 1);
    z-index: 99.57422;
  }
  32% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, -236.6028, -48.17537, 0, 1);
    z-index: 99.51825;
  }
  33% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, -227.96854, -53.58268, 0, 1);
    z-index: 99.46417;
  }
  34% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, -218.43459, -58.77853, 0, 1);
    z-index: 99.41221;
  }
  35% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, -208.03857, -63.7424, 0, 1);
    z-index: 99.36258;
  }
  36% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, -196.82153, -68.45471, 0, 1);
    z-index: 99.31545;
  }
  37% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, -184.82772, -72.89686, 0, 1);
    z-index: 99.27103;
  }
  38% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, -172.10447, -77.05132, 0, 1);
    z-index: 99.22949;
  }
  39% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, -158.70201, -80.9017, 0, 1);
    z-index: 99.19098;
  }
  40% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, -144.67323, -84.43279, 0, 1);
    z-index: 99.15567;
  }
  41% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, -130.07348, -87.63067, 0, 1);
    z-index: 99.12369;
  }
  42% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, -114.96039, -90.4827, 0, 1);
    z-index: 99.09517;
  }
  43% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, -99.39361, -92.97765, 0, 1);
    z-index: 99.07022;
  }
  44% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, -83.43456, -95.10565, 0, 1);
    z-index: 99.04894;
  }
  45% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, -67.14622, -96.85831, 0, 1);
    z-index: 99.03142;
  }
  46% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, -50.59289, -98.22872, 0, 1);
    z-index: 99.01771;
  }
  47% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, -33.83989, -99.21146, 0, 1);
    z-index: 99.00789;
  }
  48% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, -16.95333, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  49% {
    transform: matrix3d(0.56667, 0, 0, 0, 0, 0.56667, 0, 0, 0, 0, 1, 0, 0.00015, -99.99999, 0, 1);
    z-index: 99;
  }
  50% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, 16.95364, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  51% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, 33.84024, -99.21145, 0, 1);
    z-index: 99.00789;
  }
  52% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, 50.59331, -98.2287, 0, 1);
    z-index: 99.01771;
  }
  53% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, 67.14674, -96.85828, 0, 1);
    z-index: 99.03142;
  }
  54% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, 83.4352, -95.1056, 0, 1);
    z-index: 99.04894;
  }
  55% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, 99.39444, -92.97758, 0, 1);
    z-index: 99.07022;
  }
  56% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, 114.96147, -90.48262, 0, 1);
    z-index: 99.09517;
  }
  57% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, 130.07487, -87.63055, 0, 1);
    z-index: 99.12369;
  }
  58% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, 144.67503, -84.43264, 0, 1);
    z-index: 99.15567;
  }
  59% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, 158.70434, -80.9015, 0, 1);
    z-index: 99.19099;
  }
  60% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, 172.10748, -77.05106, 0, 1);
    z-index: 99.22949;
  }
  61% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, 184.83158, -72.89652, 0, 1);
    z-index: 99.27103;
  }
  62% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, 196.82649, -68.45427, 0, 1);
    z-index: 99.31546;
  }
  63% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, 208.04493, -63.74182, 0, 1);
    z-index: 99.36258;
  }
  64% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, 218.4427, -58.77778, 0, 1);
    z-index: 99.41222;
  }
  65% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, 227.97887, -53.58172, 0, 1);
    z-index: 99.46418;
  }
  66% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, 236.61593, -48.17414, 0, 1);
    z-index: 99.51826;
  }
  67% {
    transform: matrix3d(0.75808, 0, 0, 0, 0, 0.75808, 0, 0, 0, 0, 1, 0, 244.31993, -42.57636, 0, 1);
    z-index: 99.57424;
  }
  68% {
    transform: matrix3d(0.7773, 0, 0, 0, 0, 0.7773, 0, 0, 0, 0, 1, 0, 251.06067, -36.81045, 0, 1);
    z-index: 99.6319;
  }
  69% {
    transform: matrix3d(0.797, 0, 0, 0, 0, 0.797, 0, 0, 0, 0, 1, 0, 256.81175, -30.89914, 0, 1);
    z-index: 99.69101;
  }
  70% {
    transform: matrix3d(0.81711, 0, 0, 0, 0, 0.81711, 0, 0, 0, 0, 1, 0, 261.55076, -24.86574, 0, 1);
    z-index: 99.75134;
  }
  71% {
    transform: matrix3d(0.83755, 0, 0, 0, 0, 0.83755, 0, 0, 0, 0, 1, 0, 265.25934, -18.73401, 0, 1);
    z-index: 99.81266;
  }
  72% {
    transform: matrix3d(0.85824, 0, 0, 0, 0, 0.85824, 0, 0, 0, 0, 1, 0, 267.92326, -12.52811, 0, 1);
    z-index: 99.87472;
  }
  73% {
    transform: matrix3d(0.87909, 0, 0, 0, 0, 0.87909, 0, 0, 0, 0, 1, 0, 269.5325, -6.27248, 0, 1);
    z-index: 99.93728;
  }
  74% {
    transform: matrix3d(0.90003, 0, 0, 0, 0, 0.90003, 0, 0, 0, 0, 1, 0, 270.08133, 0.00827, 0, 1);
    z-index: 100.00008;
  }
  75% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, 270, 0, 0, 1);
    z-index: 100;
  }
  76% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, 269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  77% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, 267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  78% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, 265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  79% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, 261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  80% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, 256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  81% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, 251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  82% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, 244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  83% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, 236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  84% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, 227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  85% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, 218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  86% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, 208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  87% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, 196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  88% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, 184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  89% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, 172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  90% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, 158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  91% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, 144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  92% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, 130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  93% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, 114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  94% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, 99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  95% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, 83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  96% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, 67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  97% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, 50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  98% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, 33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  99% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, 16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  100% {
    transform: matrix3d(1.23333, 0, 0, 0, 0, 1.23333, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1);
    z-index: 101;
  }
}
@keyframes rotate7 {
  0% {
    transform: matrix3d(0.85822, 0, 0, 0, 0, 0.85822, 0, 0, 0, 0, 1, 0, -267.87097, -12.53332, 0, 1);
    z-index: 99.87467;
  }
  1% {
    transform: matrix3d(0.83754, 0, 0, 0, 0, 0.83754, 0, 0, 0, 0, 1, 0, -265.21756, -18.73813, 0, 1);
    z-index: 99.81262;
  }
  2% {
    transform: matrix3d(0.8171, 0, 0, 0, 0, 0.8171, 0, 0, 0, 0, 1, 0, -261.51745, -24.86899, 0, 1);
    z-index: 99.75131;
  }
  3% {
    transform: matrix3d(0.79699, 0, 0, 0, 0, 0.79699, 0, 0, 0, 0, 1, 0, -256.78526, -30.9017, 0, 1);
    z-index: 99.69098;
  }
  4% {
    transform: matrix3d(0.77729, 0, 0, 0, 0, 0.77729, 0, 0, 0, 0, 1, 0, -251.03965, -36.81246, 0, 1);
    z-index: 99.63188;
  }
  5% {
    transform: matrix3d(0.75807, 0, 0, 0, 0, 0.75807, 0, 0, 0, 0, 1, 0, -244.3033, -42.57793, 0, 1);
    z-index: 99.57422;
  }
  6% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, -236.6028, -48.17537, 0, 1);
    z-index: 99.51825;
  }
  7% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, -227.96854, -53.58268, 0, 1);
    z-index: 99.46417;
  }
  8% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, -218.43459, -58.77853, 0, 1);
    z-index: 99.41221;
  }
  9% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, -208.03857, -63.7424, 0, 1);
    z-index: 99.36258;
  }
  10% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, -196.82153, -68.45471, 0, 1);
    z-index: 99.31545;
  }
  11% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, -184.82772, -72.89686, 0, 1);
    z-index: 99.27103;
  }
  12% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, -172.10447, -77.05132, 0, 1);
    z-index: 99.22949;
  }
  13% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, -158.70201, -80.9017, 0, 1);
    z-index: 99.19098;
  }
  14% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, -144.67323, -84.43279, 0, 1);
    z-index: 99.15567;
  }
  15% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, -130.07348, -87.63067, 0, 1);
    z-index: 99.12369;
  }
  16% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, -114.96039, -90.4827, 0, 1);
    z-index: 99.09517;
  }
  17% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, -99.39361, -92.97765, 0, 1);
    z-index: 99.07022;
  }
  18% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, -83.43456, -95.10565, 0, 1);
    z-index: 99.04894;
  }
  19% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, -67.14622, -96.85831, 0, 1);
    z-index: 99.03142;
  }
  20% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, -50.59289, -98.22872, 0, 1);
    z-index: 99.01771;
  }
  21% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, -33.83989, -99.21146, 0, 1);
    z-index: 99.00789;
  }
  22% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, -16.95333, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  23% {
    transform: matrix3d(0.56667, 0, 0, 0, 0, 0.56667, 0, 0, 0, 0, 1, 0, 0.00015, -99.99999, 0, 1);
    z-index: 99;
  }
  24% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, 16.95364, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  25% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, 33.84024, -99.21145, 0, 1);
    z-index: 99.00789;
  }
  26% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, 50.59331, -98.2287, 0, 1);
    z-index: 99.01771;
  }
  27% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, 67.14674, -96.85828, 0, 1);
    z-index: 99.03142;
  }
  28% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, 83.4352, -95.1056, 0, 1);
    z-index: 99.04894;
  }
  29% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, 99.39444, -92.97758, 0, 1);
    z-index: 99.07022;
  }
  30% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, 114.96147, -90.48262, 0, 1);
    z-index: 99.09517;
  }
  31% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, 130.07487, -87.63055, 0, 1);
    z-index: 99.12369;
  }
  32% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, 144.67503, -84.43264, 0, 1);
    z-index: 99.15567;
  }
  33% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, 158.70434, -80.9015, 0, 1);
    z-index: 99.19099;
  }
  34% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, 172.10748, -77.05106, 0, 1);
    z-index: 99.22949;
  }
  35% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, 184.83158, -72.89652, 0, 1);
    z-index: 99.27103;
  }
  36% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, 196.82649, -68.45427, 0, 1);
    z-index: 99.31546;
  }
  37% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, 208.04493, -63.74182, 0, 1);
    z-index: 99.36258;
  }
  38% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, 218.4427, -58.77778, 0, 1);
    z-index: 99.41222;
  }
  39% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, 227.97887, -53.58172, 0, 1);
    z-index: 99.46418;
  }
  40% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, 236.61593, -48.17414, 0, 1);
    z-index: 99.51826;
  }
  41% {
    transform: matrix3d(0.75808, 0, 0, 0, 0, 0.75808, 0, 0, 0, 0, 1, 0, 244.31993, -42.57636, 0, 1);
    z-index: 99.57424;
  }
  42% {
    transform: matrix3d(0.7773, 0, 0, 0, 0, 0.7773, 0, 0, 0, 0, 1, 0, 251.06067, -36.81045, 0, 1);
    z-index: 99.6319;
  }
  43% {
    transform: matrix3d(0.797, 0, 0, 0, 0, 0.797, 0, 0, 0, 0, 1, 0, 256.81175, -30.89914, 0, 1);
    z-index: 99.69101;
  }
  44% {
    transform: matrix3d(0.81711, 0, 0, 0, 0, 0.81711, 0, 0, 0, 0, 1, 0, 261.55076, -24.86574, 0, 1);
    z-index: 99.75134;
  }
  45% {
    transform: matrix3d(0.83755, 0, 0, 0, 0, 0.83755, 0, 0, 0, 0, 1, 0, 265.25934, -18.73401, 0, 1);
    z-index: 99.81266;
  }
  46% {
    transform: matrix3d(0.85824, 0, 0, 0, 0, 0.85824, 0, 0, 0, 0, 1, 0, 267.92326, -12.52811, 0, 1);
    z-index: 99.87472;
  }
  47% {
    transform: matrix3d(0.87909, 0, 0, 0, 0, 0.87909, 0, 0, 0, 0, 1, 0, 269.5325, -6.27248, 0, 1);
    z-index: 99.93728;
  }
  48% {
    transform: matrix3d(0.90003, 0, 0, 0, 0, 0.90003, 0, 0, 0, 0, 1, 0, 270.08133, 0.00827, 0, 1);
    z-index: 100.00008;
  }
  49% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, 270, 0, 0, 1);
    z-index: 100;
  }
  50% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, 269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  51% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, 267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  52% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, 265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  53% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, 261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  54% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, 256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  55% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, 251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  56% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, 244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  57% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, 236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  58% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, 227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  59% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, 218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  60% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, 208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  61% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, 196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  62% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, 184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  63% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, 172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  64% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, 158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  65% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, 144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  66% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, 130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  67% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, 114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  68% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, 99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  69% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, 83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  70% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, 67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  71% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, 50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  72% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, 33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  73% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, 16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  74% {
    transform: matrix3d(1.23333, 0, 0, 0, 0, 1.23333, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1);
    z-index: 101;
  }
  75% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, -16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  76% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, -33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  77% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, -50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  78% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, -67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  79% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, -83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  80% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, -99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  81% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, -114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  82% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, -130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  83% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, -144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  84% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, -158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  85% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, -172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  86% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, -184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  87% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, -196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  88% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, -208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  89% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, -218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  90% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, -227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  91% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, -236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  92% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, -244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  93% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, -251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  94% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, -256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  95% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, -261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  96% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, -265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  97% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, -267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  98% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, -269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  99% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, -270, 0, 0, 1);
    z-index: 100;
  }
  100% {
    transform: matrix3d(0.87907, 0, 0, 0, 0, 0.87907, 0, 0, 0, 0, 1, 0, -269.46722, -6.27905, 0, 1);
    z-index: 99.93721;
  }
}
@keyframes rotate8 {
  0% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, 50.59331, -98.2287, 0, 1);
    z-index: 99.01771;
  }
  1% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, 67.14674, -96.85828, 0, 1);
    z-index: 99.03142;
  }
  2% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, 83.4352, -95.1056, 0, 1);
    z-index: 99.04894;
  }
  3% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, 99.39444, -92.97758, 0, 1);
    z-index: 99.07022;
  }
  4% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, 114.96147, -90.48262, 0, 1);
    z-index: 99.09517;
  }
  5% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, 130.07487, -87.63055, 0, 1);
    z-index: 99.12369;
  }
  6% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, 144.67503, -84.43264, 0, 1);
    z-index: 99.15567;
  }
  7% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, 158.70434, -80.9015, 0, 1);
    z-index: 99.19099;
  }
  8% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, 172.10748, -77.05106, 0, 1);
    z-index: 99.22949;
  }
  9% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, 184.83158, -72.89652, 0, 1);
    z-index: 99.27103;
  }
  10% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, 196.82649, -68.45427, 0, 1);
    z-index: 99.31546;
  }
  11% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, 208.04493, -63.74182, 0, 1);
    z-index: 99.36258;
  }
  12% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, 218.4427, -58.77778, 0, 1);
    z-index: 99.41222;
  }
  13% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, 227.97887, -53.58172, 0, 1);
    z-index: 99.46418;
  }
  14% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, 236.61593, -48.17414, 0, 1);
    z-index: 99.51826;
  }
  15% {
    transform: matrix3d(0.75808, 0, 0, 0, 0, 0.75808, 0, 0, 0, 0, 1, 0, 244.31993, -42.57636, 0, 1);
    z-index: 99.57424;
  }
  16% {
    transform: matrix3d(0.7773, 0, 0, 0, 0, 0.7773, 0, 0, 0, 0, 1, 0, 251.06067, -36.81045, 0, 1);
    z-index: 99.6319;
  }
  17% {
    transform: matrix3d(0.797, 0, 0, 0, 0, 0.797, 0, 0, 0, 0, 1, 0, 256.81175, -30.89914, 0, 1);
    z-index: 99.69101;
  }
  18% {
    transform: matrix3d(0.81711, 0, 0, 0, 0, 0.81711, 0, 0, 0, 0, 1, 0, 261.55076, -24.86574, 0, 1);
    z-index: 99.75134;
  }
  19% {
    transform: matrix3d(0.83755, 0, 0, 0, 0, 0.83755, 0, 0, 0, 0, 1, 0, 265.25934, -18.73401, 0, 1);
    z-index: 99.81266;
  }
  20% {
    transform: matrix3d(0.85824, 0, 0, 0, 0, 0.85824, 0, 0, 0, 0, 1, 0, 267.92326, -12.52811, 0, 1);
    z-index: 99.87472;
  }
  21% {
    transform: matrix3d(0.87909, 0, 0, 0, 0, 0.87909, 0, 0, 0, 0, 1, 0, 269.5325, -6.27248, 0, 1);
    z-index: 99.93728;
  }
  22% {
    transform: matrix3d(0.90003, 0, 0, 0, 0, 0.90003, 0, 0, 0, 0, 1, 0, 270.08133, 0.00827, 0, 1);
    z-index: 100.00008;
  }
  23% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, 270, 0, 0, 1);
    z-index: 100;
  }
  24% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, 269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  25% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, 267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  26% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, 265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  27% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, 261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  28% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, 256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  29% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, 251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  30% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, 244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  31% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, 236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  32% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, 227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  33% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, 218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  34% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, 208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  35% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, 196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  36% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, 184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  37% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, 172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  38% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, 158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  39% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, 144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  40% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, 130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  41% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, 114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  42% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, 99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  43% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, 83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  44% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, 67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  45% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, 50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  46% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, 33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  47% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, 16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  48% {
    transform: matrix3d(1.23333, 0, 0, 0, 0, 1.23333, 0, 0, 0, 0, 1, 0, 0, 100, 0, 1);
    z-index: 101;
  }
  49% {
    transform: matrix3d(1.23268, 0, 0, 0, 0, 1.23268, 0, 0, 0, 0, 1, 0, -16.95344, 99.80267, 0, 1);
    z-index: 100.99803;
  }
  50% {
    transform: matrix3d(1.2307, 0, 0, 0, 0, 1.2307, 0, 0, 0, 0, 1, 0, -33.83997, 99.21147, 0, 1);
    z-index: 100.99211;
  }
  51% {
    transform: matrix3d(1.22743, 0, 0, 0, 0, 1.22743, 0, 0, 0, 0, 1, 0, -50.59295, 98.22873, 0, 1);
    z-index: 100.98229;
  }
  52% {
    transform: matrix3d(1.22286, 0, 0, 0, 0, 1.22286, 0, 0, 0, 0, 1, 0, -67.14627, 96.85832, 0, 1);
    z-index: 100.96858;
  }
  53% {
    transform: matrix3d(1.21702, 0, 0, 0, 0, 1.21702, 0, 0, 0, 0, 1, 0, -83.43459, 95.10565, 0, 1);
    z-index: 100.95106;
  }
  54% {
    transform: matrix3d(1.20993, 0, 0, 0, 0, 1.20993, 0, 0, 0, 0, 1, 0, -99.39363, 92.97765, 0, 1);
    z-index: 100.92978;
  }
  55% {
    transform: matrix3d(1.20161, 0, 0, 0, 0, 1.20161, 0, 0, 0, 0, 1, 0, -114.96041, 90.48271, 0, 1);
    z-index: 100.90483;
  }
  56% {
    transform: matrix3d(1.1921, 0, 0, 0, 0, 1.1921, 0, 0, 0, 0, 1, 0, -130.07349, 87.63067, 0, 1);
    z-index: 100.87631;
  }
  57% {
    transform: matrix3d(1.18144, 0, 0, 0, 0, 1.18144, 0, 0, 0, 0, 1, 0, -144.67323, 84.43279, 0, 1);
    z-index: 100.84433;
  }
  58% {
    transform: matrix3d(1.16967, 0, 0, 0, 0, 1.16967, 0, 0, 0, 0, 1, 0, -158.70202, 80.9017, 0, 1);
    z-index: 100.80902;
  }
  59% {
    transform: matrix3d(1.15684, 0, 0, 0, 0, 1.15684, 0, 0, 0, 0, 1, 0, -172.10448, 77.05132, 0, 1);
    z-index: 100.77051;
  }
  60% {
    transform: matrix3d(1.14299, 0, 0, 0, 0, 1.14299, 0, 0, 0, 0, 1, 0, -184.82772, 72.89686, 0, 1);
    z-index: 100.72897;
  }
  61% {
    transform: matrix3d(1.12818, 0, 0, 0, 0, 1.12818, 0, 0, 0, 0, 1, 0, -196.82153, 68.45471, 0, 1);
    z-index: 100.68455;
  }
  62% {
    transform: matrix3d(1.11247, 0, 0, 0, 0, 1.11247, 0, 0, 0, 0, 1, 0, -208.03858, 63.7424, 0, 1);
    z-index: 100.63742;
  }
  63% {
    transform: matrix3d(1.09593, 0, 0, 0, 0, 1.09593, 0, 0, 0, 0, 1, 0, -218.43459, 58.77853, 0, 1);
    z-index: 100.58779;
  }
  64% {
    transform: matrix3d(1.07861, 0, 0, 0, 0, 1.07861, 0, 0, 0, 0, 1, 0, -227.96854, 53.58268, 0, 1);
    z-index: 100.53583;
  }
  65% {
    transform: matrix3d(1.06058, 0, 0, 0, 0, 1.06058, 0, 0, 0, 0, 1, 0, -236.6028, 48.17537, 0, 1);
    z-index: 100.48175;
  }
  66% {
    transform: matrix3d(1.04193, 0, 0, 0, 0, 1.04193, 0, 0, 0, 0, 1, 0, -244.3033, 42.57793, 0, 1);
    z-index: 100.42578;
  }
  67% {
    transform: matrix3d(1.02271, 0, 0, 0, 0, 1.02271, 0, 0, 0, 0, 1, 0, -251.03965, 36.81246, 0, 1);
    z-index: 100.36812;
  }
  68% {
    transform: matrix3d(1.00301, 0, 0, 0, 0, 1.00301, 0, 0, 0, 0, 1, 0, -256.78526, 30.9017, 0, 1);
    z-index: 100.30902;
  }
  69% {
    transform: matrix3d(0.9829, 0, 0, 0, 0, 0.9829, 0, 0, 0, 0, 1, 0, -261.51745, 24.86899, 0, 1);
    z-index: 100.24869;
  }
  70% {
    transform: matrix3d(0.96246, 0, 0, 0, 0, 0.96246, 0, 0, 0, 0, 1, 0, -265.21756, 18.73813, 0, 1);
    z-index: 100.18738;
  }
  71% {
    transform: matrix3d(0.94178, 0, 0, 0, 0, 0.94178, 0, 0, 0, 0, 1, 0, -267.87097, 12.53332, 0, 1);
    z-index: 100.12533;
  }
  72% {
    transform: matrix3d(0.92093, 0, 0, 0, 0, 0.92093, 0, 0, 0, 0, 1, 0, -269.46722, 6.27905, 0, 1);
    z-index: 100.06279;
  }
  73% {
    transform: matrix3d(0.9, 0, 0, 0, 0, 0.9, 0, 0, 0, 0, 1, 0, -270, 0, 0, 1);
    z-index: 100;
  }
  74% {
    transform: matrix3d(0.87907, 0, 0, 0, 0, 0.87907, 0, 0, 0, 0, 1, 0, -269.46722, -6.27905, 0, 1);
    z-index: 99.93721;
  }
  75% {
    transform: matrix3d(0.85822, 0, 0, 0, 0, 0.85822, 0, 0, 0, 0, 1, 0, -267.87097, -12.53332, 0, 1);
    z-index: 99.87467;
  }
  76% {
    transform: matrix3d(0.83754, 0, 0, 0, 0, 0.83754, 0, 0, 0, 0, 1, 0, -265.21756, -18.73813, 0, 1);
    z-index: 99.81262;
  }
  77% {
    transform: matrix3d(0.8171, 0, 0, 0, 0, 0.8171, 0, 0, 0, 0, 1, 0, -261.51745, -24.86899, 0, 1);
    z-index: 99.75131;
  }
  78% {
    transform: matrix3d(0.79699, 0, 0, 0, 0, 0.79699, 0, 0, 0, 0, 1, 0, -256.78526, -30.9017, 0, 1);
    z-index: 99.69098;
  }
  79% {
    transform: matrix3d(0.77729, 0, 0, 0, 0, 0.77729, 0, 0, 0, 0, 1, 0, -251.03965, -36.81246, 0, 1);
    z-index: 99.63188;
  }
  80% {
    transform: matrix3d(0.75807, 0, 0, 0, 0, 0.75807, 0, 0, 0, 0, 1, 0, -244.3033, -42.57793, 0, 1);
    z-index: 99.57422;
  }
  81% {
    transform: matrix3d(0.73942, 0, 0, 0, 0, 0.73942, 0, 0, 0, 0, 1, 0, -236.6028, -48.17537, 0, 1);
    z-index: 99.51825;
  }
  82% {
    transform: matrix3d(0.72139, 0, 0, 0, 0, 0.72139, 0, 0, 0, 0, 1, 0, -227.96854, -53.58268, 0, 1);
    z-index: 99.46417;
  }
  83% {
    transform: matrix3d(0.70407, 0, 0, 0, 0, 0.70407, 0, 0, 0, 0, 1, 0, -218.43459, -58.77853, 0, 1);
    z-index: 99.41221;
  }
  84% {
    transform: matrix3d(0.68753, 0, 0, 0, 0, 0.68753, 0, 0, 0, 0, 1, 0, -208.03857, -63.7424, 0, 1);
    z-index: 99.36258;
  }
  85% {
    transform: matrix3d(0.67182, 0, 0, 0, 0, 0.67182, 0, 0, 0, 0, 1, 0, -196.82153, -68.45471, 0, 1);
    z-index: 99.31545;
  }
  86% {
    transform: matrix3d(0.65701, 0, 0, 0, 0, 0.65701, 0, 0, 0, 0, 1, 0, -184.82772, -72.89686, 0, 1);
    z-index: 99.27103;
  }
  87% {
    transform: matrix3d(0.64316, 0, 0, 0, 0, 0.64316, 0, 0, 0, 0, 1, 0, -172.10447, -77.05132, 0, 1);
    z-index: 99.22949;
  }
  88% {
    transform: matrix3d(0.63033, 0, 0, 0, 0, 0.63033, 0, 0, 0, 0, 1, 0, -158.70201, -80.9017, 0, 1);
    z-index: 99.19098;
  }
  89% {
    transform: matrix3d(0.61856, 0, 0, 0, 0, 0.61856, 0, 0, 0, 0, 1, 0, -144.67323, -84.43279, 0, 1);
    z-index: 99.15567;
  }
  90% {
    transform: matrix3d(0.6079, 0, 0, 0, 0, 0.6079, 0, 0, 0, 0, 1, 0, -130.07348, -87.63067, 0, 1);
    z-index: 99.12369;
  }
  91% {
    transform: matrix3d(0.59839, 0, 0, 0, 0, 0.59839, 0, 0, 0, 0, 1, 0, -114.96039, -90.4827, 0, 1);
    z-index: 99.09517;
  }
  92% {
    transform: matrix3d(0.59007, 0, 0, 0, 0, 0.59007, 0, 0, 0, 0, 1, 0, -99.39361, -92.97765, 0, 1);
    z-index: 99.07022;
  }
  93% {
    transform: matrix3d(0.58298, 0, 0, 0, 0, 0.58298, 0, 0, 0, 0, 1, 0, -83.43456, -95.10565, 0, 1);
    z-index: 99.04894;
  }
  94% {
    transform: matrix3d(0.57714, 0, 0, 0, 0, 0.57714, 0, 0, 0, 0, 1, 0, -67.14622, -96.85831, 0, 1);
    z-index: 99.03142;
  }
  95% {
    transform: matrix3d(0.57257, 0, 0, 0, 0, 0.57257, 0, 0, 0, 0, 1, 0, -50.59289, -98.22872, 0, 1);
    z-index: 99.01771;
  }
  96% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, -33.83989, -99.21146, 0, 1);
    z-index: 99.00789;
  }
  97% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, -16.95333, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  98% {
    transform: matrix3d(0.56667, 0, 0, 0, 0, 0.56667, 0, 0, 0, 0, 1, 0, 0.00015, -99.99999, 0, 1);
    z-index: 99;
  }
  99% {
    transform: matrix3d(0.56732, 0, 0, 0, 0, 0.56732, 0, 0, 0, 0, 1, 0, 16.95364, -99.80266, 0, 1);
    z-index: 99.00197;
  }
  100% {
    transform: matrix3d(0.5693, 0, 0, 0, 0, 0.5693, 0, 0, 0, 0, 1, 0, 33.84024, -99.21145, 0, 1);
    z-index: 99.00789;
  }
}

/* ========== 窄屏：与 useResponsiveLayout（md 以下）联动，由 SchoolDashboard 根节点加类 ========== */
.dashboard-container.dashboard-container--compact {
  height: auto;
  min-height: 100vh;
  max-height: none;
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  box-sizing: border-box;
}

.dashboard-container.dashboard-container--compact .main {
  height: auto !important;
  min-height: 0;
  padding: 0 2% 16px;
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.dashboard-container.dashboard-container--compact .main .top5,
.dashboard-container.dashboard-container--compact .main .total,
.dashboard-container.dashboard-container--compact .main .analyse {
  width: 100% !important;
  float: none !important;
  height: auto !important;
}

.dashboard-container.dashboard-container--compact .main .top5 {
  min-height: 240px;
  order: 1;
}

.dashboard-container.dashboard-container--compact .main .total {
  min-height: 360px;
  order: 2;
  overflow: hidden;
}

.dashboard-container.dashboard-container--compact .main .analyse {
  min-height: 380px;
  order: 3;
}

.dashboard-container.dashboard-container--compact .main .sale {
  position: relative !important;
  left: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 180px;
  order: 4;
  display: flex;
  flex-direction: column;
}

.dashboard-container.dashboard-container--compact .main .sale ul {
  height: auto;
  min-height: 160px;
  flex: 1;
}

.dashboard-container.dashboard-container--compact .main .sale ul li {
  height: auto;
  min-height: 3.2rem;
  margin-top: 3%;
}

.dashboard-container.dashboard-container--compact .main .lineChart {
  position: relative !important;
  left: auto !important;
  right: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: 200px !important;
  margin-top: 4px;
  order: 5;
  flex-shrink: 0;
}

.dashboard-container.dashboard-container--compact header {
  height: auto;
  min-height: 2.8rem;
  padding: 6px 0 10px;
}

.dashboard-container.dashboard-container--compact .bottom {
  height: auto;
  min-height: 3rem;
  padding: 12px 0 20px;
}

/* 教师档案概览 - 窄屏适配 */
.dashboard-container.dashboard-container--compact .main .teacherStats {
  position: relative !important;
  left: auto !important;
  bottom: auto !important;
  width: 100% !important;
  height: auto !important;
  min-height: 280px;
  order: 6;
  margin-top: 8px;
}

.dashboard-container.dashboard-container--compact .main .teacherStats-grid {
  min-height: 240px;
}

/* 学科分布：窄屏下学科名独占一行，避免与课程/教案数字挤成一团 */
.dashboard-container.dashboard-container--compact
  .top5
  .top5-content
  ul
  li
  .li-content.subject-distribution-row {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  align-content: flex-start;
  gap: 4px 8px;
  padding-top: 8%;
  padding-bottom: 5%;
  line-height: 1.35;
  min-height: 2.8rem;
}
.dashboard-container.dashboard-container--compact
  .subject-distribution-row
  .subject-distribution-name {
  flex: 0 0 100%;
  font-weight: 600;
}
.dashboard-container.dashboard-container--compact .subject-distribution-row span:not(.subject-distribution-name) {
  font-size: 0.62rem;
  white-space: nowrap;
}

.dashboard-container.dashboard-container--compact .main .sale .sale-hint {
  font-size: 11px;
  line-height: 1.4;
  color: rgba(255, 255, 255, 0.55);
  margin: 0 0 6px 4px;
  flex-shrink: 0;
}
.dashboard-container.dashboard-container--compact .main .sale > ul {
  flex: 1;
  min-height: 150px;
}

/* 嵌入学校数据管理 Tabs：铺底避免 Ant 内容区默认白底露出 */
.school-dashboard-tab-shell {
  background-color: #0a1524;
  min-height: calc(100vh - 200px);
  min-height: calc(100dvh - 200px);
  margin: -12px -16px;
  padding: 12px 16px 24px;
  box-sizing: border-box;
}
/* 教师档案统计 — 教务展示页 */

.teacher-stats-page {
  width: 100%;
  margin-bottom: 16px;
}

.teacher-stats-page-header {
  display: flex;
  align-items: baseline;
  flex-wrap: wrap;
  gap: 12px 20px;
  margin-bottom: 14px;
  padding: 4px 2px;
}

.teacher-stats-card-title {
  color: #0d9488;
  font-size: 20px;
  font-weight: 700;
  letter-spacing: 0.02em;
}

.teacher-stats-card-count {
  color: rgba(30, 58, 95, 0.72);
  font-size: 16px;
}

.teacher-stats-card-count strong {
  color: #d97706;
  font-size: 22px;
  font-weight: 700;
}

/* 展示字段：常显，不折叠 */
.teacher-stats-card-config-panel {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px 22px;
  padding: 12px 16px;
  margin-bottom: 16px;
  background: rgba(13, 148, 136, 0.06);
  border: 1px solid rgba(13, 148, 136, 0.18);
  border-radius: 8px;
}

.teacher-stats-card-config-hint {
  color: rgba(30, 58, 95, 0.65);
  font-size: 14px;
  font-weight: 600;
  margin-right: 4px;
}

.teacher-stats-card-config-panel label {
  display: flex;
  align-items: center;
  gap: 6px;
  color: rgba(30, 58, 95, 0.88);
  font-size: 15px;
  cursor: pointer;
  -webkit-user-select: none;
     -moz-user-select: none;
          user-select: none;
}

.teacher-stats-card-config-panel label input[type="checkbox"] {
  width: 16px;
  height: 16px;
  accent-color: #0d9488;
  cursor: pointer;
}

/* 独立卡片网格 */
.teacher-stats-card-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
  width: 100%;
}

.teacher-stats-card.teacher-stats-card--chart {
  border: 1px solid rgba(13, 148, 136, 0.22);
  border-radius: 10px;
  overflow: hidden;
  box-shadow: 0 6px 20px rgba(30, 58, 95, 0.06);
  margin: 0;
  background: #0a1524;
}

.teacher-stats-card--chart .ant-card-head {
  background: rgba(9, 21, 36, 0.85);
  border-bottom: 1px solid rgba(9, 196, 202, 0.2);
  min-height: auto;
  padding: 0 16px;
}

.teacher-stats-card--chart .ant-card-head-title {
  padding: 12px 0;
}

.teacher-stats-card--chart .ant-card-body {
  padding: 8px 12px 14px;
  background: rgba(9, 21, 36, 0.55);
  min-height: 260px;
}

.teacher-stats-card-chart-label {
  color: #09c4ca;
  font-size: 16px;
  font-weight: 650;
}

.teacher-stats-card-chart {
  width: 100%;
  height: 260px;
  min-height: 240px;
}

.teacher-stats-card--chart .ant-empty {
  margin: 48px 0;
}

.teacher-stats-card--chart .ant-empty-description {
  color: rgba(255, 255, 255, 0.55);
  font-size: 14px;
}

/* 仅 1 个图表：单列全宽 */
.teacher-stats-card-grid.single {
  grid-template-columns: 1fr;
}

.teacher-stats-card-grid.single .teacher-stats-card-chart {
  height: 320px;
}

/* 仅 2 个图表：一行两列 */
.teacher-stats-card-grid.double {
  grid-template-columns: repeat(2, minmax(0, 1fr));
}

.teacher-stats-card-grid.double .teacher-stats-card-chart {
  height: 280px;
}

/* 加载/空态外层卡片（浅色页内兼容） */
.teacher-stats-card:not(.teacher-stats-card--chart) {
  border: 1px solid rgba(13, 148, 136, 0.2);
  width: 100%;
}

@media (max-width: 900px) {
  .teacher-stats-card-grid,
  .teacher-stats-card-grid.double {
    grid-template-columns: 1fr;
  }

  .teacher-stats-card-chart,
  .teacher-stats-card-grid.double .teacher-stats-card-chart {
    height: 260px;
  }

  .teacher-stats-card-title {
    font-size: 18px;
  }

  .teacher-stats-card-config-panel label {
    font-size: 14px;
  }
}
/* 学校数据管理 · 左侧导航产品壳（对齐 Product UI --product-*） */

.sdm-page {
  min-height: 100vh;
  background:
    radial-gradient(
      ellipse 80% 50% at 10% -10%,
      color-mix(in srgb, var(--product-primary, #2563eb) 12%, transparent) 0%,
      transparent 55%
    ),
    radial-gradient(
      ellipse 60% 40% at 100% 0%,
      color-mix(in srgb, var(--product-accent, #0ea5e9) 10%, transparent) 0%,
      transparent 50%
    ),
    var(--product-surface, #f0f4f8);
}

.sdm-page--embedded {
  min-height: 0;
  background: transparent;
}

.sdm-page--embedded .sdm-content {
  min-height: 0;
  padding-top: 4px;
}

.sdm-page--embedded .sdm-panel-head {
  margin-bottom: 18px;
}

.sdm-page--embedded .sdm-panel-head h4 {
  font-size: 22px !important;
  letter-spacing: 0.02em;
}

.sdm-page--embedded .sdm-panel-body {
  box-shadow: var(
    --product-shadow-card,
    0 8px 28px color-mix(in srgb, var(--product-deep, #1e3a5f) 5%, transparent)
  );
  padding: 20px 24px 28px;
}

.sdm-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  height: 64px !important;
  line-height: 1.3 !important;
  padding: 0 20px 0 12px !important;
  background: color-mix(in srgb, var(--product-surface-card, #fff) 92%, transparent) !important;
  -webkit-backdrop-filter: blur(10px);
          backdrop-filter: blur(10px);
  border-bottom: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 8%, transparent);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, 0.8),
    0 4px 16px color-mix(in srgb, var(--product-deep, #1e3a5f) 4%, transparent);
  z-index: 20;
  overflow: hidden;
}

.sdm-header__left {
  display: flex;
  align-items: center;
  gap: 8px;
  flex: 1;
  min-width: 0;
}

.sdm-header__titles {
  min-width: 0;
}

.sdm-header__titles h4 {
  margin: 0 !important;
  color: var(--product-deep, #1e3a5f) !important;
  font-weight: 650 !important;
  letter-spacing: 0.02em;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sdm-header__titles .ant-typography {
  display: block;
  font-size: 12px;
  color: var(--product-text-secondary, #64748b) !important;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

.sdm-body {
  flex: 1;
  min-height: 0;
  background: transparent;
}

.sdm-sider {
  background: var(--product-surface-card, #fff) !important;
  border-right: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 8%, transparent);
  box-shadow: 4px 0 24px color-mix(in srgb, var(--product-deep, #1e3a5f) 3%, transparent);
}

.sdm-sider .ant-layout-sider-children {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}

.sdm-sider__brand {
  flex-shrink: 0;
  padding: 16px 16px 12px;
  border-bottom: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 6%, transparent);
}

.sdm-sider__brand-kicker {
  font-size: 11px;
  font-weight: 600;
  letter-spacing: 0.08em;
  text-transform: uppercase;
  color: var(--product-text-secondary, #94a3b8);
  margin-bottom: 4px;
}

.sdm-sider__brand-title {
  font-size: 15px;
  font-weight: 650;
  color: var(--product-deep, #1e3a5f);
  line-height: 1.35;
}

.sdm-sider__menu-wrap {
  flex: 1;
  overflow: auto;
  padding: 8px 0 24px;
}

.sdm-sider .ant-menu {
  -webkit-border-end: none !important;
          border-inline-end: none !important;
  background: transparent;
}

.sdm-sider .ant-menu-submenu-title {
  margin: 2px 8px !important;
  width: calc(100% - 16px) !important;
  border-radius: 8px;
  color: var(--product-deep, #1e3a5f);
  font-weight: 650;
}

.sdm-sider .ant-menu-submenu-title:hover {
  color: var(--product-primary, #2563eb) !important;
}

.sdm-sider .ant-menu-submenu-open > .ant-menu-submenu-title {
  color: var(--product-primary, #2563eb);
}

.sdm-sider .ant-menu-item {
  margin: 2px 8px !important;
  width: calc(100% - 16px) !important;
  border-radius: 8px;
  height: 36px;
  line-height: 36px;
  color: var(--product-text, #334155);
}

.sdm-sider .ant-menu-item-selected {
  background: var(--product-primary-light, #dbeafe) !important;
  color: var(--product-primary, #2563eb) !important;
  font-weight: 600;
  box-shadow: inset 3px 0 0 var(--product-primary, #2563eb);
}

.sdm-sider .ant-menu-item:hover {
  color: var(--product-primary, #2563eb) !important;
}

.sdm-sider .ant-menu-sub.ant-menu-inline {
  background: transparent !important;
}

.sdm-sider .ant-menu-sub.ant-menu-inline .ant-menu-item {
  padding-left: 40px !important;
}

.sdm-sider.ant-layout-sider-collapsed .sdm-sider__brand {
  padding: 12px 8px;
  text-align: center;
}

.sdm-sider.ant-layout-sider-collapsed .sdm-sider__brand-kicker,
.sdm-sider.ant-layout-sider-collapsed .sdm-sider__brand-title {
  display: none;
}

.sdm-content {
  display: flex;
  flex-direction: column;
  min-width: 0;
  min-height: calc(100vh - 64px);
  box-sizing: border-box;
}

.sdm-toolbar {
  display: flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 12px;
}

.sdm-panel-head {
  margin-bottom: 16px;
}

.sdm-panel-head h4 {
  margin: 0 0 4px !important;
  color: var(--product-deep, #1e3a5f) !important;
  font-weight: 650 !important;
}

.sdm-panel-head .ant-typography-secondary {
  font-size: 13px;
}

.sdm-panel-body {
  flex: 1;
  background: var(--product-surface-card, #fff);
  border-radius: var(--product-radius-md, 12px);
  border: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 6%, transparent);
  box-shadow: var(
    --product-shadow-card,
    0 8px 28px color-mix(in srgb, var(--product-deep, #1e3a5f) 5%, transparent)
  );
  padding: 16px 20px 24px;
  min-height: 320px;
}

.sdm-panel-body > .sdm-stats-slot {
  margin-bottom: 12px;
}

/* 由左侧菜单驱动，隐藏 Ant Tabs 顶栏 */
.sdm-hidden-tabs > .ant-tabs-nav {
  display: none !important;
}

.sdm-hidden-tabs .ant-tabs-content-holder,
.sdm-hidden-tabs .ant-tabs-content,
.sdm-hidden-tabs .ant-tabs-tabpane {
  outline: none;
}

.sdm-nav-drawer .ant-drawer-body {
  padding: 12px 0 24px;
}

.sdm-nav-drawer .ant-menu-submenu-title {
  margin: 2px 10px !important;
  width: calc(100% - 20px) !important;
  border-radius: 8px;
  font-weight: 650;
  color: var(--product-deep, #1e3a5f);
}

.sdm-nav-drawer .ant-menu-item {
  margin: 2px 10px !important;
  width: calc(100% - 20px) !important;
  border-radius: 8px;
}

.sdm-nav-drawer .ant-menu-item-selected {
  background: var(--product-primary-light, #dbeafe) !important;
  color: var(--product-primary, #2563eb) !important;
  box-shadow: inset 3px 0 0 var(--product-primary, #2563eb);
}

@media (max-width: 767px) {
  .sdm-panel-body {
    padding: 12px;
    border-radius: 10px;
  }

  .sdm-header {
    padding: 0 12px 0 4px !important;
  }
}
/**
 * SaaS 平台运营控制台 · 视觉（对齐 product-ui 蓝海军教育管理色板）
 */
.platform-console-page {
  --pc-primary: var(--product-primary, #2563eb);
  --pc-primary-hover: var(--product-primary-hover, #1d4ed8);
  --pc-accent: var(--product-accent, #0ea5e9);
  --pc-deep: var(--product-deep, #1e3a5f);
  --pc-surface: var(--product-surface, #f0f4f8);
  --pc-card: var(--product-surface-card, #ffffff);
  --pc-text: var(--product-text, #1e293b);
  --pc-muted: var(--product-text-secondary, #64748b);
  --pc-radius: var(--product-radius-md, 12px);
  --pc-radius-lg: var(--product-radius-lg, 16px);
  --pc-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  --pc-hero: var(
    --product-gradient-hero,
    linear-gradient(135deg, #1e3a5f 0%, #2563eb 52%, #0ea5e9 100%)
  );

  min-height: 100vh;
  background:
    radial-gradient(ellipse 80% 50% at 10% -10%, rgba(37, 99, 235, 0.12) 0%, transparent 55%),
    radial-gradient(ellipse 60% 40% at 100% 0%, rgba(14, 165, 233, 0.1) 0%, transparent 50%),
    var(--pc-surface);
  color: var(--pc-text);
  font-family: 'PingFang SC', 'Hiragino Sans GB', 'Microsoft YaHei', 'Noto Sans SC', sans-serif;
}

.platform-console-page .platform-console-hero {
  position: relative;
  overflow: hidden;
  background: var(--pc-hero);
  padding: 28px 28px 36px;
  box-shadow: 0 12px 32px rgba(30, 58, 95, 0.28);
}

.platform-console-page .platform-console-hero::before {
  content: '';
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 88% 20%, rgba(255, 255, 255, 0.18) 0%, transparent 42%),
    radial-gradient(circle at 12% 80%, rgba(56, 189, 248, 0.22) 0%, transparent 45%);
  pointer-events: none;
}

.platform-console-page .platform-console-hero-inner {
  position: relative;
  z-index: 1;
  max-width: 1400px;
  margin: 0 auto;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 20px;
  flex-wrap: wrap;
}

.platform-console-page .platform-console-brand {
  display: flex;
  align-items: flex-start;
  gap: 14px;
  min-width: 0;
}

.platform-console-page .platform-console-brand-icon {
  width: 48px;
  height: 48px;
  border-radius: 14px;
  display: flex;
  align-items: center;
  justify-content: center;
  background: rgba(255, 255, 255, 0.18);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font-size: 22px;
  flex-shrink: 0;
  -webkit-backdrop-filter: blur(8px);
          backdrop-filter: blur(8px);
}

.platform-console-page .platform-console-brand-text h1 {
  margin: 0 0 6px;
  color: #fff !important;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.02em;
  line-height: 1.3;
}

.platform-console-page .platform-console-brand-text p {
  margin: 0;
  color: rgba(255, 255, 255, 0.82) !important;
  font-size: 13px;
  line-height: 1.55;
  max-width: 520px;
}

.platform-console-page .platform-console-hero-meta {
  display: flex;
  align-items: center;
  gap: 10px;
  flex-wrap: wrap;
}

.platform-console-page .platform-console-pill {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 12px;
  border-radius: 999px;
  background: rgba(255, 255, 255, 0.16);
  border: 1px solid rgba(255, 255, 255, 0.28);
  color: #fff;
  font-size: 13px;
  -webkit-backdrop-filter: blur(6px);
          backdrop-filter: blur(6px);
}

.platform-console-page .platform-console-nav-link {
  color: #fff !important;
  font-size: 13px;
  padding: 6px 12px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.28);
  background: rgba(255, 255, 255, 0.1);
  transition: background 0.2s ease, border-color 0.2s ease;
}

.platform-console-page .platform-console-nav-link:hover {
  background: rgba(255, 255, 255, 0.22);
  border-color: rgba(255, 255, 255, 0.45);
  color: #fff !important;
}

.platform-console-page .platform-console-body {
  max-width: 1400px;
  margin: -18px auto 0;
  padding: 0 20px 40px;
  width: 100%;
  box-sizing: border-box;
  position: relative;
  z-index: 2;
}

.platform-console-page .platform-console-intro {
  margin-bottom: 16px !important;
  border-radius: var(--pc-radius) !important;
  border: 1px solid rgba(37, 99, 235, 0.12) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  box-shadow: var(--pc-shadow);
}

.platform-console-page .platform-console-tabs.ant-tabs {
  background: transparent;
}

.platform-console-page .platform-console-tabs > .ant-tabs-nav {
  margin-bottom: 16px;
  background: var(--pc-card);
  border-radius: var(--pc-radius);
  padding: 6px 10px 0;
  box-shadow: var(--pc-shadow);
  border: 1px solid rgba(30, 58, 95, 0.06);
}

.platform-console-page .platform-console-tabs > .ant-tabs-nav::before {
  border-bottom-color: rgba(30, 58, 95, 0.08) !important;
}

.platform-console-page .platform-console-tabs .ant-tabs-tab {
  padding: 10px 14px;
  border-radius: 10px 10px 0 0;
  color: var(--pc-muted);
  transition: color 0.2s ease;
}

.platform-console-page .platform-console-tabs .ant-tabs-tab:hover {
  color: var(--pc-primary);
}

.platform-console-page .platform-console-tabs .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--pc-deep) !important;
  font-weight: 600;
}

.platform-console-page .platform-console-tabs .ant-tabs-ink-bar {
  background: linear-gradient(90deg, var(--pc-primary), var(--pc-accent));
  height: 3px;
  border-radius: 3px 3px 0 0;
}

.platform-console-page .platform-console-panel.ant-card,
.platform-console-page .platform-console-body .ant-card {
  border-radius: var(--pc-radius-lg) !important;
  border: 1px solid rgba(30, 58, 95, 0.06) !important;
  box-shadow: var(--pc-shadow);
  overflow: hidden;
}

.platform-console-page .platform-console-body .ant-card-head {
  border-bottom: 1px solid rgba(30, 58, 95, 0.06);
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 100%);
  min-height: 52px;
}

.platform-console-page .platform-console-body .ant-card-head-title {
  color: var(--pc-deep);
  font-weight: 600;
}

.platform-console-page .platform-console-body .ant-table-wrapper {
  border-radius: var(--pc-radius);
}

.platform-console-page .platform-console-body .ant-table-thead > tr > th {
  background: #f5f8fc !important;
  color: var(--pc-deep);
  font-weight: 600;
}

.platform-console-page .platform-console-body .ant-btn-primary {
  background: linear-gradient(135deg, var(--pc-primary) 0%, var(--pc-accent) 100%);
  border: none;
  box-shadow: 0 6px 16px rgba(37, 99, 235, 0.28);
}

.platform-console-page .platform-console-body .ant-btn-primary:hover {
  background: linear-gradient(135deg, var(--pc-primary-hover) 0%, var(--pc-primary) 100%);
}

.platform-console-page .platform-console-body .ant-tag {
  border-radius: 6px;
}

.platform-console-page .platform-console-section-alert {
  border-radius: var(--pc-radius) !important;
  margin-bottom: 16px !important;
}

/* 开通学校 · 宽幅分栏 */
.platform-console-page .platform-provision-card {
  width: 100%;
}

.platform-console-page .platform-provision-form .platform-form-section {
  margin-bottom: 8px;
  padding: 16px 18px 4px;
  border-radius: var(--pc-radius);
  background: linear-gradient(180deg, #f8fbff 0%, #ffffff 70%);
  border: 1px solid rgba(30, 58, 95, 0.06);
}

.platform-console-page .platform-provision-form .platform-form-section + .platform-form-section {
  margin-top: 14px;
}

.platform-console-page .platform-provision-form .platform-form-section-title {
  margin: 0 0 12px !important;
  color: var(--pc-deep) !important;
  font-size: 14px !important;
  font-weight: 650 !important;
  letter-spacing: 0.02em;
  position: relative;
  padding-left: 12px;
}

.platform-console-page .platform-provision-form .platform-form-section-title::before {
  content: '';
  position: absolute;
  left: 0;
  top: 0.2em;
  bottom: 0.2em;
  width: 3px;
  border-radius: 2px;
  background: linear-gradient(180deg, var(--pc-primary), var(--pc-accent));
}

.platform-console-page .platform-provision-form .ant-form-item {
  margin-bottom: 14px;
}

.platform-console-page .platform-provision-form .ant-form-item-extra {
  font-size: 12px;
}

.platform-console-page .platform-provision-actions {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 14px;
  margin-top: 18px;
  padding-top: 16px;
  border-top: 1px dashed rgba(30, 58, 95, 0.12);
}

.platform-console-page .platform-multischool-panel {
  width: 100%;
}

@media (max-width: 768px) {
  .platform-console-page .platform-console-hero {
    padding: 20px 16px 28px;
  }

  .platform-console-page .platform-console-brand-text h1 {
    font-size: 18px;
  }

  .platform-console-page .platform-console-body {
    padding: 0 12px 28px;
    margin-top: -14px;
  }

  .platform-console-page .platform-provision-form .platform-form-section {
    padding: 12px 12px 2px;
  }
}
/* 顶栏：Ant Design Header 默认 64px 固定高度 + line-height 会裁切多行标题 */
.smart-campus-page > .ant-layout-header.smart-campus-header {
  height: auto;
  min-height: 64px;
  line-height: 1.45;
  padding: 14px 24px 16px;
  display: flex;
  align-items: flex-start;
  gap: 12px;
  flex-wrap: nowrap;
  background: linear-gradient(90deg, #0d2847 0%, #132f4f 100%);
  border-bottom: 1px solid rgba(64, 169, 255, 0.25);
}

.smart-campus-page .smart-campus-header__icon {
  font-size: 22px;
  color: #69c0ff;
  margin-top: 4px;
  flex-shrink: 0;
}

.smart-campus-page .smart-campus-header__text {
  min-width: 0;
  flex: 1;
}

.smart-campus-page .smart-campus-header__title {
  color: #e6f7ff !important;
  margin: 0 0 4px !important;
  line-height: 1.35 !important;
  font-size: 18px !important;
  font-weight: 600 !important;
}

.smart-campus-page .smart-campus-header__subtitle {
  display: block;
  color: rgba(230, 247, 255, 0.65);
  font-size: 12px;
  line-height: 1.5;
}

/* 深色内容区上的 Tabs：未选中标签用浅色字，选中后与浅色面板一致 */

/* 能源大屏内嵌 */
.smart-campus-page .smart-campus-energy-embed {
  display: flex;
  flex-direction: column;
  min-height: min(78vh, 820px);
}

.smart-campus-page .smart-campus-energy-embed__toolbar {
  margin-bottom: 8px;
}

.smart-campus-page .smart-campus-energy-embed__iframe {
  flex: 1;
  width: 100%;
  min-height: 560px;
  height: min(72vh, 760px);
  border: 0;
  border-radius: 8px;
  background: #0a1628;
  box-shadow: inset 0 0 0 1px rgba(0, 0, 0, 0.12);
}

/* NH2 自建电能看板 */
.smart-campus-page .nh-energy-dashboard {
  color: #262626;
}

.smart-campus-page .nh-energy-dashboard__stat-card {
  min-height: 132px;
}

.smart-campus-page .nh-energy-dashboard__chart {
  width: 100%;
  height: 300px;
}

.smart-campus-page .nh-energy-dashboard__chart--tall {
  height: 340px;
}

.smart-campus-page.smart-campus-page--compact .nh-energy-dashboard__chart {
  height: 260px;
}

.smart-campus-page.smart-campus-page--compact .nh-energy-dashboard__chart--tall {
  height: 280px;
}

/* NH2 用水看板 */
.smart-campus-page .nh-water-dashboard {
  color: #262626;
}

.smart-campus-page .nh-water-dashboard__stat-card {
  min-height: 132px;
}

.smart-campus-page .nh-water-dashboard__chart {
  width: 100%;
  height: 300px;
}

.smart-campus-page .nh-water-dashboard__chart--tall {
  height: 340px;
}

.smart-campus-page.smart-campus-page--compact .nh-water-dashboard__chart {
  height: 260px;
}

.smart-campus-page.smart-campus-page--compact .nh-water-dashboard__chart--tall {
  height: 280px;
}

.smart-campus-page .nh-hvac-dashboard__overview {
  margin-top: 12px;
  border-radius: 10px;
  border: 1px solid rgba(35, 122, 98, 0.12);
  box-shadow: 0 1px 4px rgba(15, 40, 32, 0.06);
}

.smart-campus-page .nh-hvac-dashboard__overview > .ant-card-body {
  padding: 12px 14px;
}

.smart-campus-page .nh-hvac-dashboard__overview-inner {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  gap: 12px 16px;
}

.smart-campus-page .nh-hvac-dashboard__overview-stats {
  flex: 0 0 auto;
  min-width: 200px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.smart-campus-page .nh-hvac-dashboard__overview-title,
.smart-campus-page .nh-hvac-dashboard__overview-chart-title {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #124536;
  line-height: 1.2;
}

.smart-campus-page .nh-hvac-stat-strip {
  display: grid;
  grid-template-columns: repeat(2, minmax(88px, 1fr));
  gap: 8px;
}

.smart-campus-page .nh-hvac-stat-chip {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 6px 10px;
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.85);
  border: 1px solid rgba(35, 122, 98, 0.1);
  border-left-width: 3px;
}

.smart-campus-page .nh-hvac-stat-chip__label {
  font-size: 11px;
  color: #5b8a7a;
  line-height: 1.2;
}

.smart-campus-page .nh-hvac-stat-chip__value {
  font-size: 20px;
  font-weight: 700;
  line-height: 1.1;
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  color: #262626;
}

.smart-campus-page .nh-hvac-stat-chip--total {
  border-left-color: #597ef7;
}

.smart-campus-page .nh-hvac-stat-chip--on {
  border-left-color: #52c41a;
}

.smart-campus-page .nh-hvac-stat-chip--on .nh-hvac-stat-chip__value {
  color: #389e0d;
}

.smart-campus-page .nh-hvac-stat-chip--off {
  border-left-color: #8c8c8c;
}

.smart-campus-page .nh-hvac-stat-chip--unknown {
  border-left-color: #faad14;
}

.smart-campus-page .nh-hvac-stat-chip--unknown .nh-hvac-stat-chip__value {
  color: #d48806;
}

.smart-campus-page .nh-hvac-dashboard__overview-chart {
  flex: 1 1 180px;
  min-width: 160px;
  display: flex;
  flex-direction: column;
  gap: 4px;
}

.smart-campus-page .nh-hvac-dashboard__pie {
  width: 100%;
  height: 148px;
  min-height: 132px;
}

.smart-campus-page .nh-hvac-dashboard__control-panel {
  margin-top: 16px;
  border-radius: 12px;
  border: 1px solid rgba(35, 122, 98, 0.18);
  background: linear-gradient(180deg, #f4fbf8 0%, #ffffff 48%, #fafdfe 100%);
  box-shadow: 0 4px 18px rgba(18, 69, 54, 0.08);
}

.smart-campus-page .nh-hvac-dashboard__control-panel > .ant-card-body {
  padding: 16px 18px 18px;
}

.smart-campus-page .nh-hvac-dashboard__section-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 8px 12px;
  margin-bottom: 4px;
  padding-bottom: 10px;
  border-bottom: 1px solid rgba(35, 122, 98, 0.12);
}

.smart-campus-page .nh-hvac-dashboard__section-head h5 {
  margin: 0 !important;
  font-size: 16px !important;
  font-weight: 700 !important;
  color: #124536 !important;
}

.smart-campus-page .nh-hvac-dashboard__section-head .ant-typography-secondary {
  font-size: 12px;
  color: #5b8a7a !important;
}

.smart-campus-page .nh-hvac-dashboard .ant-alert {
  border-radius: 10px;
}

.smart-campus-page .nh-hvac-dashboard__toolbar-text {
  color: #5b8a7a !important;
  font-size: 13px;
}

.smart-campus-page .smart-campus-tab-panel {
  border-radius: 0 8px 8px 8px;
  box-shadow: 0 4px 16px rgba(0, 0, 0, 0.12);
}

.smart-campus-page .smart-campus-tab-panel--hvac {
  background: linear-gradient(180deg, #f7fcfa 0%, #f5f8fc 100%) !important;
}

.smart-campus-page.smart-campus-page--compact .nh-hvac-dashboard__pie {
  height: 132px;
  min-height: 120px;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-nav {
  margin-bottom: 0;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-nav::before {
  border-bottom-color: rgba(255, 255, 255, 0.22);
}

/* 未选中：每个页签独立底色 + 高对比白字，便于不点击即可辨认 */
.smart-campus-page .smart-campus-tabs .ant-tabs-tab {
  border-color: rgba(255, 255, 255, 0.28) !important;
  border-bottom-color: transparent !important;
  padding: 10px 16px !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab .smart-campus-tab-label {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  font-weight: 700;
  font-size: 13px;
  letter-spacing: 0.03em;
  color: #ffffff !important;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab .anticon {
  font-size: 15px;
  color: #ffffff !important;
  opacity: 0.95;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-energy) {
  background: linear-gradient(180deg, #1d5a8a 0%, #0f3d63 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-fire) {
  background: linear-gradient(180deg, #a61f24 0%, #6b1014 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-water) {
  background: linear-gradient(180deg, #1766ad 0%, #0e4070 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-power) {
  background: linear-gradient(180deg, #b8860b 0%, #7a5a08 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-hvac) {
  background: linear-gradient(180deg, #237a62 0%, #124536 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-iot) {
  background: linear-gradient(180deg, #e86a00 0%, #a84800 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-alerts) {
  background: linear-gradient(180deg, #5b2d86 0%, #351752 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:not(.ant-tabs-tab-active):has(.smart-campus-tab-label--tone-monitor) {
  background: linear-gradient(180deg, #1d4ed8 0%, #0f2d6e 100%) !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:hover:not(.ant-tabs-tab-active) {
  -webkit-filter: brightness(1.12);
          filter: brightness(1.12);
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab:hover:not(.ant-tabs-tab-active) .smart-campus-tab-label,
.smart-campus-page .smart-campus-tabs .ant-tabs-tab:hover:not(.ant-tabs-tab-active) .anticon {
  color: #ffffff !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab-active {
  color: #0b1220 !important;
  background: #f5f8fc !important;
  border-color: rgba(255, 255, 255, 0.45) !important;
  border-bottom-color: #f5f8fc !important;
  box-shadow: 0 -2px 12px rgba(0, 0, 0, 0.12);
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab-active .smart-campus-tab-label {
  color: #0b1220 !important;
  text-shadow: none;
  font-weight: 800;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab-active .anticon {
  color: #0958d9 !important;
  opacity: 1;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-ink-bar {
  display: none;
}

/* card 类型下选中 tab 与内容区无缝 */
.smart-campus-page .smart-campus-tabs.ant-tabs-card > .ant-tabs-nav .ant-tabs-tab-active {
  border-bottom-color: #f5f8fc !important;
}

/* 小屏：Tab 可横向滑动，避免标签换行挤占竖向空间 */
.smart-campus-page--compact .smart-campus-tabs .ant-tabs-nav-wrap {
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  touch-action: pan-x pan-y;
}

.smart-campus-page--compact .smart-campus-tabs .ant-tabs-nav-list {
  flex-wrap: nowrap !important;
}

.smart-campus-page--compact .smart-campus-tabs .ant-tabs-tab {
  flex-shrink: 0;
}

/* 环境 Tab：选中时图标用品牌青绿 */
.smart-campus-page .smart-campus-tabs .ant-tabs-tab-active:has(.smart-campus-tab-label--tone-hvac) .anticon {
  color: #237a62 !important;
}

/* 米家 Tab：选中时图标用品牌橙 */
.smart-campus-page .smart-campus-tabs .ant-tabs-tab-active:has(.smart-campus-tab-label--tone-iot) .anticon {
  color: #e86a00 !important;
}

.smart-campus-page .smart-campus-tabs .ant-tabs-tab-active:has(.smart-campus-tab-label--tone-monitor) .anticon {
  color: #1d4ed8 !important;
}

.smart-campus-monitor__layout {
  display: grid;
  grid-template-columns: minmax(280px, 420px) 1fr;
  gap: 12px;
  align-items: start;
}

@media (max-width: 960px) {
  .smart-campus-monitor__layout {
    grid-template-columns: 1fr;
  }
}

.smart-campus-monitor__preview-wrap {
  min-height: 280px;
}

.smart-campus-monitor__video {
  display: block;
  width: 100%;
  max-height: min(62vh, 520px);
  -o-object-fit: contain;
     object-fit: contain;
  background: #0b1220;
  border-radius: 6px;
}

/* 米家设备卡片 */
.smart-campus-page .xiaomi-iot-card {
  border-radius: 8px;
  box-shadow: 0 1px 4px rgba(0, 0, 0, 0.08);
  min-height: 180px;
}

.smart-campus-page .xiaomi-iot-card .ant-card-head-title {
  font-weight: 600;
}
/* kongtiao2 室内机 · 智慧校园环境 Tab 青绿主题 */
.kongtiao-rpc-indoor {
  margin-top: 8px;
  --hvac-accent: #237a62;
  --hvac-accent-deep: #124536;
  --hvac-surface: #ffffff;
  --hvac-muted: #5b8a7a;
  --hvac-border: rgba(35, 122, 98, 0.16);
  --hvac-ok: #22c55e;
  --hvac-off: #94a3b8;
  --hvac-warn: #f59e0b;
  --hvac-danger: #ef4444;
}

.kongtiao-rpc-indoor__hint {
  color: var(--hvac-muted);
  font-size: 12px;
  line-height: 1.5;
  margin: 0 0 12px;
  padding: 8px 12px;
  border-radius: 8px;
  background: rgba(35, 122, 98, 0.06);
  border: 1px dashed var(--hvac-border);
}

.kongtiao-rpc-indoor__filters {
  display: flex;
  flex-wrap: wrap;
  gap: 12px 16px;
  align-items: center;
  margin-bottom: 14px;
  padding: 10px 12px;
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.72);
  border: 1px solid var(--hvac-border);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.8);
}

.kongtiao-rpc-indoor__filters label {
  display: flex;
  align-items: center;
  gap: 8px;
  font-size: 13px;
  font-weight: 600;
  color: var(--hvac-accent-deep);
}

.kongtiao-rpc-indoor__filters .ant-select-selector {
  border-color: var(--hvac-border) !important;
  border-radius: 8px !important;
}

.kongtiao-rpc-indoor__filters .ant-btn-default {
  border-color: rgba(35, 122, 98, 0.28);
  color: var(--hvac-accent-deep);
  border-radius: 8px;
}

.kongtiao-rpc-indoor__filters .ant-btn-primary.ant-btn-background-ghost {
  border-color: var(--hvac-ok);
  color: #15803d;
}

.kongtiao-rpc-indoor__grid {
  display: flex;
  flex-direction: column;
  gap: 0;
}

.kongtiao-rpc-indoor .ant-collapse {
  background: transparent;
  border: none;
}

.kongtiao-rpc-indoor .ant-collapse-item {
  margin-bottom: 10px;
  border: 1px solid var(--hvac-border) !important;
  border-radius: 10px !important;
  overflow: hidden;
  background: var(--hvac-surface);
  box-shadow: 0 2px 8px rgba(18, 69, 54, 0.06);
}

.kongtiao-rpc-indoor .ant-collapse-header {
  font-size: 13px !important;
  font-weight: 700 !important;
  color: #eafff8 !important;
  padding: 11px 14px !important;
  background: linear-gradient(90deg, #237a62 0%, #2d9a78 55%, #1a6b55 100%) !important;
  align-items: center !important;
}

.kongtiao-rpc-indoor .ant-collapse-header .ant-collapse-expand-icon {
  color: rgba(255, 255, 255, 0.85) !important;
}

.kongtiao-rpc-indoor .ant-collapse-content {
  border-top: 1px solid var(--hvac-border) !important;
  background: linear-gradient(180deg, #f8fdfb 0%, #ffffff 100%) !important;
}

.kongtiao-rpc-indoor .ant-collapse-content-box {
  padding: 14px !important;
}

.kongtiao-rpc-indoor__group-meta {
  margin-left: auto;
  font-size: 11px;
  font-weight: 600;
  color: rgba(234, 255, 248, 0.88);
  padding: 2px 8px;
  border-radius: 999px;
  background: rgba(0, 0, 0, 0.14);
}

.kongtiao-rpc-unit-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(148px, 1fr));
  gap: 10px;
}

.kongtiao-rpc-unit-card {
  background: #fff;
  border: 1px solid var(--hvac-border);
  border-radius: 10px;
  padding: 9px 10px 8px;
  font-size: 12px;
  display: flex;
  flex-direction: column;
  gap: 5px;
  transition: transform 0.15s ease, box-shadow 0.15s ease, border-color 0.15s ease;
}

.kongtiao-rpc-unit-card:hover {
  transform: translateY(-1px);
  box-shadow: 0 4px 12px rgba(18, 69, 54, 0.1);
}

/* 开机：整卡按运行模式着色，便于远距离辨认 */
.kongtiao-rpc-unit-card.rpc-on {
  border-left-width: 3px;
  border-left-style: solid;
}

.kongtiao-rpc-unit-card.rpc-on.rpc-mode-cool {
  background: #dbeafe;
  border-color: rgba(59, 130, 246, 0.38);
  border-left-color: #2563eb;
}

.kongtiao-rpc-unit-card.rpc-on.rpc-mode-heat {
  background: #fee2e2;
  border-color: rgba(239, 68, 68, 0.38);
  border-left-color: #dc2626;
}

.kongtiao-rpc-unit-card.rpc-on.rpc-mode-fan {
  background: #dcfce7;
  border-color: rgba(34, 197, 94, 0.38);
  border-left-color: #16a34a;
}

.kongtiao-rpc-unit-card.rpc-on.rpc-mode-dry {
  background: #f3e8ff;
  border-color: rgba(168, 85, 247, 0.38);
  border-left-color: #9333ea;
}

.kongtiao-rpc-unit-card.rpc-on.rpc-mode-auto {
  background: #fef9c3;
  border-color: rgba(234, 179, 8, 0.42);
  border-left-color: #ca8a04;
}

.kongtiao-rpc-unit-card.rpc-on.rpc-mode-unknown {
  background: #f0fdf4;
  border-color: rgba(34, 197, 94, 0.35);
  border-left-color: var(--hvac-ok);
}

.kongtiao-rpc-unit-card.rpc-off {
  border-left: 3px solid var(--hvac-off);
  background: #fafbfc;
  opacity: 0.96;
}

.kongtiao-rpc-unit-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 6px;
}

.kongtiao-rpc-unit-id {
  font-family: ui-monospace, SFMono-Regular, Menlo, Consolas, monospace;
  font-weight: 700;
  font-size: 11px;
  color: var(--hvac-accent);
  background: rgba(35, 122, 98, 0.08);
  padding: 1px 6px;
  border-radius: 4px;
}

.kongtiao-rpc-unit-name {
  font-weight: 700;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: #1f2937;
  font-size: 13px;
}

.kongtiao-rpc-unit-meta {
  color: var(--hvac-muted);
  font-size: 11px;
  line-height: 1.35;
}

.kongtiao-rpc-badge {
  padding: 2px 8px;
  border-radius: 999px;
  font-size: 10px;
  font-weight: 700;
  letter-spacing: 0.02em;
  flex-shrink: 0;
}

.kongtiao-rpc-badge--on {
  color: #15803d;
  background: rgba(34, 197, 94, 0.18);
  border: 1px solid rgba(34, 197, 94, 0.35);
}

.kongtiao-rpc-badge--off {
  color: #64748b;
  background: rgba(148, 163, 184, 0.16);
  border: 1px solid rgba(148, 163, 184, 0.28);
}

.kongtiao-rpc-badge--unknown {
  color: #b45309;
  background: rgba(245, 158, 11, 0.16);
  border: 1px solid rgba(245, 158, 11, 0.28);
}

.kongtiao-rpc-unit-actions {
  margin-top: 2px;
  display: flex;
  gap: 6px;
}

.kongtiao-rpc-unit-actions .ant-btn {
  flex: 1;
  font-size: 12px;
  font-weight: 600;
  height: 30px;
  border-radius: 8px;
}

.kongtiao-rpc-unit-actions .ant-btn-primary.ant-btn-background-ghost {
  border-color: rgba(34, 197, 94, 0.55);
  color: #15803d;
  background: rgba(34, 197, 94, 0.06);
}

.kongtiao-rpc-unit-actions .ant-btn-primary.ant-btn-background-ghost:hover {
  background: rgba(34, 197, 94, 0.14) !important;
  border-color: var(--hvac-ok) !important;
  color: #166534 !important;
}

.kongtiao-rpc-unit-actions .ant-btn-dangerous {
  background: rgba(239, 68, 68, 0.06);
}

.kongtiao-rpc-indoor__footnote {
  display: block;
  margin-top: 10px;
  font-size: 11px;
  color: var(--hvac-muted);
}
/* 视觉盒子管理：全宽主从布局，功能勾选进入首屏 */

.vba-page {
  display: flex;
  flex-direction: column;
  gap: 12px;
  height: calc(100vh - 132px);
  min-height: 560px;
}

.vba-header {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 16px 24px;
  flex-wrap: wrap;
}

.vba-header__text {
  min-width: 0;
  flex: 1 1 420px;
}

.vba-header__text .vba-title {
  margin: 0 0 4px;
  letter-spacing: 0.08em;
}

.vba-header__text .vba-lead {
  margin: 0;
  max-width: 72ch;
}

.vba-header__actions {
  flex: 0 0 auto;
}

.vba-workspace {
  display: grid;
  grid-template-columns: minmax(280px, 340px) minmax(0, 1fr);
  gap: 16px;
  flex: 1;
  min-height: 0;
  align-items: stretch;
}

.vba-list-card.ant-card,
.vba-detail-card.ant-card {
  display: flex;
  flex-direction: column;
  height: 100%;
  min-height: 520px;
  border-radius: 12px;
  box-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
}

.vba-list-card > .ant-card-head,
.vba-detail-card > .ant-card-head {
  flex: 0 0 auto;
}

.vba-list-card > .ant-card-body,
.vba-detail-card > .ant-card-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.vba-list-toolbar {
  flex: 0 0 auto;
  margin-bottom: 10px;
}

.vba-list-scroll {
  flex: 1;
  min-height: 0;
  overflow: auto;
  display: flex;
  flex-direction: column;
  gap: 8px;
  padding-right: 2px;
}

.vba-box-item {
  display: flex;
  align-items: flex-start;
  gap: 10px;
  padding: 10px 10px 10px 12px;
  border: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 10%, transparent);
  border-radius: 10px;
  background: var(--product-surface-card, #fff);
  cursor: pointer;
  transition: border-color 0.15s ease, background 0.15s ease, box-shadow 0.15s ease;
}

.vba-box-item:hover {
  border-color: color-mix(in srgb, var(--product-primary, #2563eb) 35%, transparent);
}

.vba-box-item.is-selected {
  background: color-mix(in srgb, var(--product-primary, #2563eb) 7%, #fff);
  border-color: color-mix(in srgb, var(--product-primary, #2563eb) 45%, transparent);
  box-shadow: inset 3px 0 0 var(--product-primary, #2563eb);
}

.vba-box-item__check {
  flex: 0 0 auto;
  padding-top: 2px;
}

.vba-box-item__body {
  min-width: 0;
  flex: 1;
}

.vba-box-item__name {
  font-weight: 600;
  color: var(--product-text, #1e293b);
  line-height: 1.35;
  word-break: break-word;
}

.vba-box-item__id {
  margin-top: 2px;
  font-size: 12px;
  color: var(--product-text-secondary, #64748b);
  word-break: break-all;
}

.vba-box-item__tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 8px;
}

.vba-box-item__tags .ant-tag {
  -webkit-margin-end: 0;
          margin-inline-end: 0;
}

.vba-box-item__action {
  flex: 0 0 auto;
  margin: -4px -6px 0 0;
}

.vba-list-empty {
  padding: 28px 12px;
  text-align: center;
}

.vba-detail-card .vba-tabs {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.vba-detail-card .vba-tabs > .ant-tabs-nav {
  flex: 0 0 auto;
  margin-bottom: 12px;
}

.vba-detail-card .vba-tabs .ant-tabs-content-holder {
  flex: 1;
  min-height: 0;
  overflow: auto;
}

.vba-detail-card .vba-tabs .ant-tabs-content,
.vba-detail-card .vba-tabs .ant-tabs-tabpane {
  height: 100%;
}

.vba-identity {
  display: flex;
  flex-direction: column;
  gap: 12px;
  margin-bottom: 14px;
}

.vba-identity-grid {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 4px 16px;
}

.vba-identity-grid .ant-form-item:last-child {
  grid-column: 1 / -1;
}

.vba-identity-form .ant-form-item {
  margin-bottom: 8px;
}

.vba-identity-form .ant-form-item-extra {
  font-size: 12px;
}

.vba-identity-form .ant-radio-group {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.vba-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px 16px;
  padding: 8px 12px;
  border-radius: 8px;
  background: color-mix(in srgb, var(--product-deep, #1e3a5f) 4%, #fff);
  color: var(--product-text-secondary, #64748b);
  font-size: 12px;
}

.vba-meta__item {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-width: 0;
}

.vba-meta__item .ant-typography {
  font-size: 12px;
}

.vba-stats {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
}

.vba-stats__label {
  font-size: 12px;
  color: var(--product-text-secondary, #64748b);
  margin-right: 4px;
}

.vba-stats--empty {
  font-size: 12px;
  color: var(--product-text-secondary, #64748b);
}

.vba-flag-groups {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 12px;
}

.vba-flag-card {
  padding: 12px 14px 14px;
  border-radius: 10px;
  border: 1px solid color-mix(in srgb, var(--product-deep, #1e3a5f) 10%, transparent);
  background: color-mix(in srgb, var(--product-surface, #f0f4f8) 70%, #fff);
  min-width: 0;
}

.vba-flag-card h4 {
  margin: 0 0 10px;
  font-size: 13px;
  font-weight: 650;
  color: var(--product-deep, #1e3a5f);
}

.vba-flag-grid {
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.vba-flag-grid .ant-checkbox-wrapper {
  white-space: normal;
  align-items: flex-start;
  line-height: 1.4;
}

@media (max-width: 1100px) {
  .vba-identity-grid,
  .vba-flag-groups {
    grid-template-columns: 1fr;
  }

  .vba-identity-grid .ant-form-item:last-child {
    grid-column: auto;
  }
}

@media (max-width: 991px) {
  .vba-workspace {
    grid-template-columns: 1fr;
  }

  .vba-list-card.ant-card,
  .vba-detail-card.ant-card {
    min-height: 0;
    height: auto;
  }

  .vba-list-card.ant-card {
    max-height: 380px;
  }

  .vba-list-card > .ant-card-body,
  .vba-detail-card > .ant-card-body {
    overflow: auto;
  }
}

@media (max-width: 767px) {
  .vba-page {
    height: auto;
    min-height: 0;
  }

  .vba-header__actions {
    width: 100%;
  }
}
.student-workspace {
  padding: 24px;
}

.student-workspace-header {
  margin-bottom: 24px;
  background: linear-gradient(135deg, #667eea 0%, #764ba2 100%);
  border: none;
  color: #fff;
}

.student-workspace-stat-card,
.student-workspace-todo-card,
.student-workspace-list-card {
  border-radius: 12px;
}

.student-workspace .ant-list-item-meta-title {
  line-height: 1.5;
}

.student-workspace .ant-btn-link {
  min-height: 36px;
}

@media screen and (max-width: 1280px) {
  .student-workspace {
    padding: 12px;
  }

  .student-workspace-homework-title-scroll,
  .student-workspace-homework-meta-scroll,
  .student-workspace-homework-actions-scroll {
    overflow: visible;
  }

  .student-workspace-homework-title-scroll .ant-space,
  .student-workspace-homework-meta-scroll .ant-space,
  .student-workspace-homework-actions-scroll .ant-space {
    flex-wrap: wrap !important;
  }
}

/* 窄屏下列表「操作」与 Meta 并排时主列被压成极细条；改为整行 Meta + 下方按钮 */
@media screen and (max-width: 767px) {
  .student-workspace-homework-item.ant-list-item {
    flex-wrap: wrap;
    align-items: flex-start;
    padding: 0 0 12px;
    -webkit-border-after: none;
            border-block-end: none;
  }

  .student-workspace-homework-item.ant-list-item::before {
    display: none;
  }

  .student-workspace-homework-item .ant-list-item-meta {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
    padding: 12px;
    border: 1px solid #f0f0f0;
    border-left: 4px solid #1890ff;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  }

  .student-workspace-homework-item .ant-list-item-meta-content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .student-workspace-homework-item .ant-list-item-meta-title {
    width: 100%;
    margin-bottom: 8px;
  }

  .student-workspace-homework-item .ant-list-item-meta-description {
    width: 100%;
    max-width: 100%;
  }

  .student-workspace-homework-actions-scroll {
    overflow: visible;
    margin-top: 10px;
    padding-top: 10px;
  }
}

.student-workspace-homework-title-scroll,
.student-workspace-homework-meta-scroll,
.student-workspace-homework-actions-scroll {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.student-workspace-homework-title-scroll .ant-space,
.student-workspace-homework-meta-scroll .ant-space,
.student-workspace-homework-actions-scroll .ant-space {
  flex-wrap: nowrap !important;
}

.student-workspace-homework-actions-scroll {
  margin-top: 8px;
  padding-top: 8px;
  border-top: 1px solid #f0f0f0;
}
/* 科目私教页：ASL 玻璃卡片（Chrome 80：无 color-mix / :has / conic-gradient）
 * PC 学生壳另加 .product-teach，映射到 --product-*（可用 color-mix）
 */

/* PC Product UI：覆盖 ASL 暖橙 clay，对齐教师/学生侧栏 Token */
.product-teach.asl-teach {
  --asl-accent: var(--product-primary, #2563eb);
  --asl-accent-deep: var(--product-primary-hover, #1d4ed8);
  --asl-accent-soft: var(--product-accent, #0ea5e9);
  --asl-ink: var(--product-deep, #1e3a5f);
  --asl-ink-soft: var(--product-text-secondary, #64748b);
  --asl-card: var(--product-surface, #f0f4f8);
  --asl-card-surface: var(--product-surface-card, #ffffff);
  --asl-pill-from: var(--product-primary, #2563eb);
  --asl-pill-to: var(--product-primary-hover, #1d4ed8);
  --asl-glow: rgba(37, 99, 235, 0.12);
  --asl-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  --asl-tab-active-ink: var(--product-deep, #1e3a5f);
  --asl-radius: 14px;
  --asl-radius-sm: 12px;
  --asl-glass: var(--product-surface-card, #ffffff);
  --asl-glass-border: rgba(30, 58, 95, 0.1);
  color: var(--product-text, #1e293b);
  background:
    radial-gradient(ellipse 70% 40% at 0% 0%, rgba(37, 99, 235, 0.08) 0%, transparent 55%),
    var(--product-surface, #f0f4f8);
}

.product-teach .asl-teach__hero.ant-card {
  border-radius: 14px !important;
  background: var(
    --product-gradient-hero,
    linear-gradient(135deg, #1e3a5f 0%, #2563eb 52%, #0ea5e9 100%)
  ) !important;
  box-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  border: none !important;
}

.product-teach .asl-teach__card.ant-card {
  border-radius: 12px !important;
  background: var(--product-surface-card, #fff) !important;
  border: 1px solid rgba(30, 58, 95, 0.08) !important;
  box-shadow: 0 2px 10px rgba(30, 58, 95, 0.04);
  backdrop-filter: none;
  -webkit-backdrop-filter: none;
}

.product-teach .asl-teach__tabs {
  border-radius: 12px;
  background: var(--product-surface-card, #fff);
  border: 1px solid rgba(30, 58, 95, 0.08);
  -webkit-backdrop-filter: none;
          backdrop-filter: none;
}

.product-teach .asl-teach__tab--active.ant-btn,
.product-teach .asl-teach__tab--active.ant-btn:hover,
.product-teach .asl-teach__pill--active,
.product-teach .asl-teach__primary.ant-btn-primary {
  background: var(--product-primary, #2563eb) !important;
  background-image: none !important;
}

.product-teach .asl-teach__ws-avatar {
  background: var(--product-primary-light, #dbeafe);
  color: var(--product-primary, #2563eb);
  box-shadow: none;
  background-image: none;
}

.asl-teach {
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 20px 44px rgba(160, 48, 18, 0.18);
  --asl-tab-active-ink: #2b211c;
  --asl-radius: 28px;
  --asl-radius-sm: 20px;
  --asl-glass: rgba(255, 255, 255, 0.82);
  --asl-glass-border: rgba(255, 255, 255, 0.9);

  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  width: 100%;
  color: var(--asl-ink);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  -webkit-tap-highlight-color: transparent;
  background:
    radial-gradient(ellipse 70% 50% at 92% 88%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 58%),
    radial-gradient(ellipse 55% 40% at 8% 0%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 60%),
    linear-gradient(168deg, var(--asl-card) 0%, #f7f7f8 48%, var(--asl-card-surface) 100%);
}

.asl-teach[data-asl-theme="azure"] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-card-surface: #f0f6ff;
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 20px 44px rgba(30, 64, 175, 0.16);
  --asl-tab-active-ink: #1e293b;
}

.asl-teach[data-asl-theme="tech"] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-card-surface: #ecfeff;
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 20px 44px rgba(14, 116, 144, 0.16);
  --asl-tab-active-ink: #0f172a;
}

.asl-teach[data-asl-theme="emerald"] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-card-surface: #ecfdf5;
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 20px 44px rgba(4, 120, 87, 0.16);
  --asl-tab-active-ink: #064e3b;
}

.asl-teach[data-asl-theme="violet"] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-card-surface: #f5f3ff;
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 20px 44px rgba(91, 33, 182, 0.16);
  --asl-tab-active-ink: #2e1065;
}

.asl-teach.ant-layout {
  background: transparent !important;
  min-height: 100%;
  /* 避免被外壳 overflow:hidden 锁死导致只能看到底部科目条 */
  overflow: visible !important;
}

.asl-teach__content {
  box-sizing: border-box;
  width: 100%;
  max-width: 1200px;
  margin: 0 auto;
  padding: 16px 16px 28px;
  padding-left: max(16px, env(safe-area-inset-left, 0px));
  padding-right: max(16px, env(safe-area-inset-right, 0px));
  overflow: visible;
  -webkit-overflow-scrolling: touch;
}

.asl-teach__back.ant-btn {
  color: var(--asl-ink-soft) !important;
  border-radius: 999px !important;
  height: 36px;
  padding: 0 14px;
  margin-bottom: 12px;
  background: var(--asl-glass) !important;
  border: 1px solid var(--asl-glass-border) !important;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
  transition: transform 0.15s ease, background 0.15s ease;
}

.asl-teach__back.ant-btn:hover,
.asl-teach__back.ant-btn:focus {
  color: var(--asl-ink) !important;
  background: rgba(255, 255, 255, 0.92) !important;
  transform: translateY(-1px);
}

.asl-teach__hero.ant-card {
  margin-bottom: 16px;
  border: 1px solid var(--asl-glass-border);
  border-radius: var(--asl-radius) !important;
  background:
    radial-gradient(ellipse 80% 70% at 12% 0%, rgba(255, 255, 255, 0.5) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(145deg, var(--asl-pill-from) 0%, var(--asl-accent) 52%, var(--asl-accent-deep) 100%) !important;
  box-shadow: var(--asl-shadow);
  overflow: hidden;
  color: #fff;
}

.asl-teach__hero .ant-card-body {
  padding: 20px 22px;
}

.asl-teach__hero-title {
  margin: 0 0 6px !important;
  color: #fff !important;
  font-weight: 700 !important;
  letter-spacing: 0.02em;
}

.asl-teach__hero-sub {
  display: block;
  color: rgba(255, 255, 255, 0.9) !important;
  font-size: 14px;
  line-height: 1.5;
  max-width: 640px;
}

.asl-teach__tabs {
  display: inline-flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
  padding: 6px;
  background: var(--asl-glass);
  border: 1px solid var(--asl-glass-border);
  border-radius: 999px;
  box-shadow: 0 8px 22px rgba(0, 0, 0, 0.06);
  backdrop-filter: blur(12px);
  -webkit-backdrop-filter: blur(12px);
}

.asl-teach__tab.ant-btn {
  border: none !important;
  box-shadow: none !important;
  border-radius: 999px !important;
  height: 36px;
  padding: 0 18px;
  font-weight: 600;
  color: var(--asl-ink-soft) !important;
  background: transparent !important;
  transition: background 0.18s ease, color 0.18s ease, transform 0.12s ease;
}

.asl-teach__tab.ant-btn:hover {
  color: var(--asl-ink) !important;
  background: rgba(255, 255, 255, 0.55) !important;
}

.asl-teach__tab--active.ant-btn,
.asl-teach__tab--active.ant-btn:hover {
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  transform: translateY(-1px);
}

.asl-teach__card.ant-card {
  margin-bottom: 0;
  border: 1px solid var(--asl-glass-border) !important;
  border-radius: var(--asl-radius-sm) !important;
  background: var(--asl-glass) !important;
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
  box-shadow: 0 12px 28px rgba(0, 0, 0, 0.05);
  overflow: hidden;
}

.asl-teach__card + .asl-teach__card,
.asl-teach__card.asl-teach__card--spaced {
  margin-top: 16px;
}

.asl-teach__card > .ant-card-head {
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  background: transparent;
  min-height: 46px;
  color: var(--asl-ink);
  font-weight: 700;
}

.asl-teach__card > .ant-card-head .ant-card-head-title {
  color: var(--asl-ink);
  font-weight: 700;
}

.asl-teach__card > .ant-card-body {
  color: var(--asl-ink);
}

.asl-teach__card .ant-typography,
.asl-teach__card .ant-list-item-meta-description {
  color: var(--asl-ink-soft);
}

.asl-teach__card .ant-typography-secondary {
  color: var(--asl-ink-soft) !important;
}

.asl-teach__subject-pills {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 4px;
}

.asl-teach__pill {
  cursor: pointer;
  -webkit-margin-end: 0 !important;
          margin-inline-end: 0 !important;
  border-radius: 999px !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  background: rgba(255, 255, 255, 0.65) !important;
  color: var(--asl-ink-soft) !important;
  padding: 2px 12px;
  line-height: 22px;
  transition: transform 0.12s ease, background 0.15s ease, color 0.15s ease;
}

.asl-teach__pill:hover {
  transform: translateY(-1px);
  color: var(--asl-ink) !important;
}

.asl-teach__pill--active {
  border-color: transparent !important;
  color: #fff !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
}

.asl-teach__list-item {
  cursor: pointer;
  border-radius: 16px !important;
  padding: 12px !important;
  margin-bottom: 8px;
  border: 1px solid rgba(0, 0, 0, 0.04) !important;
  background: rgba(255, 255, 255, 0.72) !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.03);
  transition: background 0.15s ease, transform 0.12s ease, border-color 0.15s ease, box-shadow 0.15s ease;
}

.asl-teach__list-item:hover {
  background: rgba(255, 255, 255, 0.92) !important;
  transform: translateY(-1px);
  border-color: rgba(0, 0, 0, 0.08) !important;
}

.asl-teach__list-item--active {
  background: rgba(255, 255, 255, 0.96) !important;
  border-color: rgba(59, 130, 246, 0.28) !important;
  box-shadow: 0 8px 20px rgba(37, 99, 235, 0.1);
}

.asl-teach__list-item.ant-list-item {
  display: block !important;
  -webkit-border-after: none !important;
          border-block-end: none !important;
}

.asl-teach__ws-item {
  display: flex;
  gap: 10px;
  align-items: flex-start;
}

.asl-teach__ws-avatar {
  width: 36px;
  height: 36px;
  flex-shrink: 0;
  border-radius: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 14px;
  font-weight: 800;
  color: #fff;
  background: linear-gradient(135deg, var(--asl-pill-from), var(--asl-pill-to));
  box-shadow: 0 4px 10px var(--asl-glow);
}

.asl-teach__ws-main {
  flex: 1;
  min-width: 0;
}

.asl-teach__ws-head {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 8px;
  align-items: center;
  margin-bottom: 2px;
}

.asl-teach__ws-title {
  font-size: 14px !important;
  color: var(--asl-ink) !important;
}

.asl-teach__ws-tag {
  -webkit-margin-end: 0 !important;
          margin-inline-end: 0 !important;
  border-radius: 999px !important;
  font-size: 11px;
  line-height: 18px;
  padding: 0 8px;
}

.asl-teach__ws-tag--ok {
  color: #047857 !important;
  background: rgba(16, 185, 129, 0.12) !important;
  border-color: transparent !important;
}

.asl-teach__ws-why {
  margin: 0 !important;
  font-size: 12px !important;
  line-height: 1.45 !important;
}

.asl-teach__card--subject .ant-select {
  margin-bottom: 12px !important;
}

.asl-teach__subject-pills {
  gap: 8px;
}

.asl-teach__pill {
  min-height: 30px;
  padding: 4px 14px !important;
  font-weight: 600;
  font-size: 13px;
}

.asl-teach__ghost-btn.ant-btn {
  border-radius: 999px !important;
  height: 40px;
  font-weight: 600;
  color: var(--asl-ink) !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.7) !important;
}

.asl-teach__ghost-btn.ant-btn:hover {
  border-color: var(--asl-accent) !important;
  color: var(--asl-accent-deep) !important;
}

.asl-teach__primary.ant-btn-primary {
  border: none !important;
  border-radius: 999px !important;
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to)) !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.12);
}

.asl-teach__drawer .ant-drawer-content {
  background: var(--asl-card);
}

.asl-teach__drawer .ant-drawer-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  background: var(--asl-glass);
  backdrop-filter: blur(14px);
  -webkit-backdrop-filter: blur(14px);
}

.asl-teach__drawer .ant-drawer-title {
  color: var(--asl-ink);
  font-weight: 700;
}

.asl-teach__drawer .ant-drawer-body {
  padding: 16px;
}

.asl-teach__drawer .ant-drawer-body iframe {
  border-radius: 16px;
  overflow: hidden;
}

.asl-teach .ant-select-selector {
  border-radius: 14px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.85) !important;
}

.asl-teach .ant-select-focused .ant-select-selector,
.asl-teach .ant-select-selector:hover {
  border-color: var(--asl-accent) !important;
}

.asl-teach .ant-input,
.asl-teach .ant-input-textarea textarea {
  border-radius: 14px !important;
  border-color: rgba(0, 0, 0, 0.08) !important;
  background: rgba(255, 255, 255, 0.88) !important;
}

.asl-teach .ant-tag {
  border-radius: 999px;
}

.asl-teach__rail-hint {
  font-size: 12px;
}

.asl-teach__rail-collapse {
  margin-top: 12px;
  padding: 4px 8px 8px;
  border-radius: var(--asl-radius-sm);
  background: var(--asl-glass);
  border: 1px solid var(--asl-glass-border);
  box-shadow: 0 8px 20px rgba(15, 23, 42, 0.04);
}

.asl-teach__rail-collapse .ant-collapse-header {
  font-weight: 600 !important;
  color: var(--asl-ink) !important;
}

.asl-teach__split {
  align-items: flex-start;
}

.asl-teach__rail,
.asl-teach__stage {
  min-width: 0;
}

.asl-teach__stage {
  position: relative;
}

.asl-teach__drawer--portrait .ant-drawer-body {
  padding: 12px;
}

/* —— 横屏：左栏吸顶可滚，右栏会话占主视觉 —— */
@media (orientation: landscape) {
  .asl-teach__content {
    max-width: 1400px;
    padding-top: 12px;
    padding-bottom: 20px;
  }

  .asl-teach__hero .ant-card-body {
    padding: 14px 20px;
  }

  .asl-teach__hero-sub {
    max-width: 720px;
  }

  /* 桌面横屏侧栏可 sticky；平板 ASL 勿嵌套滚动，否则整页上滑会被锁住 */
  .asl-teach__rail {
    position: -webkit-sticky;
    position: sticky;
    top: 10px;
    max-height: calc(100vh - 20px);
    max-height: calc(100dvh - 20px);
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
    padding-right: 2px;
  }

  html.android-student-ui .asl-teach__rail,
  body.android-student-ui .asl-teach__rail,
  .asl-teach.student-ui .asl-teach__rail {
    position: static;
    max-height: none;
    overflow: visible;
  }

  .asl-teach__stage {
    min-height: calc(100vh - 168px);
    min-height: calc(100dvh - 168px);
  }

  .asl-teach__split--teach .asl-teach__card--subject .ant-card-extra {
    max-width: 46%;
  }
}

/* 横屏且高度偏矮：压缩顶区，把垂直空间留给会话 */
@media (orientation: landscape) and (max-height: 560px) {
  .asl-teach__hero-sub {
    display: none;
  }

  .asl-teach__hero .ant-card-body {
    padding: 10px 16px;
  }

  .asl-teach__hero-title {
    font-size: 18px !important;
  }

  .asl-teach__tabs {
    margin-bottom: 10px;
    padding: 4px;
  }

  .asl-teach__tab.ant-btn {
    height: 32px;
    padding: 0 14px;
  }

  .asl-teach__rail {
    top: 6px;
    max-height: calc(100vh - 12px);
    max-height: calc(100dvh - 12px);
  }
}

/* —— 竖屏：会话优先，侧栏工具下沉，触控区加大 —— */
@media (orientation: portrait) {
  .asl-teach__content {
    padding: 12px 12px 88px;
  }

  .asl-teach__tabs {
    width: 100%;
    border-radius: 22px;
    justify-content: stretch;
  }

  .asl-teach__tab.ant-btn {
    flex: 1;
    min-height: 40px;
  }

  .asl-teach__split {
    display: flex;
    flex-wrap: wrap;
  }

  /* 覆盖 Ant Col 的 md/lg 分栏：竖屏一律单列（含 iPad 竖屏 ≥768） */
  .asl-teach__split .asl-teach__rail.ant-col,
  .asl-teach__split .asl-teach__stage.ant-col {
    flex: 0 0 100% !important;
    max-width: 100% !important;
  }

  .asl-teach__split .asl-teach__stage {
    order: 1;
  }

  .asl-teach__split .asl-teach__rail {
    order: 2;
    margin-top: 4px;
  }

  .asl-teach__rail-hint {
    display: none;
  }

  .asl-teach__subject-pills {
    max-height: 96px;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch;
  }

  .asl-teach__ghost-btn.ant-btn,
  .asl-teach__primary.ant-btn {
    min-height: 44px;
  }

  .asl-teach__list-item {
    padding: 12px !important;
  }

  .asl-teach__ws-avatar {
    width: 40px;
    height: 40px;
    border-radius: 14px;
    font-size: 15px;
  }

  .asl-teach__pill {
    min-height: 34px;
    padding: 6px 14px !important;
  }

  .asl-teach__card--subject > .ant-card-body {
    padding: 14px 14px 16px;
  }
}

@media screen and (max-width: 767px) {
  .asl-teach__hero .ant-card-body {
    padding: 16px;
  }

  .asl-teach__card > .ant-card-body {
    padding: 12px;
  }
}
.debrief-guest-page {
  display: flex;
  min-height: 100vh;
  height: 100vh;
  box-sizing: border-box;
  background: #f0f2f5;
  overflow: hidden;
}

.debrief-guest-sidebar {
  flex: 0 0 280px;
  width: 280px;
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 16px;
  box-sizing: border-box;
  border-right: 1px solid #e8e8e8;
  background: #fff;
  overflow-y: auto;
  overflow-x: hidden;
}

.debrief-guest-main {
  flex: 1;
  min-width: 0;
  min-height: 0;
  display: flex;
  flex-direction: column;
  padding: 16px;
  box-sizing: border-box;
}

.debrief-guest-main-card {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
}

.debrief-guest-main-card .ant-card-body {
  flex: 1;
  min-height: 0;
  display: flex;
  flex-direction: column;
  overflow: hidden;
}

.debrief-guest-messages {
  flex: 1;
  min-height: 0;
  overflow: auto;
  margin-bottom: 12px;
}

.debrief-guest-sidebar-segmented {
  width: 100%;
}

.debrief-guest-sidebar-segmented.ant-segmented-vertical,
.debrief-guest-sidebar-segmented .ant-segmented-vertical {
  width: 100%;
}

.debrief-guest-sidebar-segmented .ant-segmented-item {
  justify-content: flex-start;
}

.debrief-guest-sidebar-segmented .ant-segmented-item-label {
  overflow: visible;
  white-space: nowrap;
}

.debrief-guest-quick-mentions .ant-tag {
  -webkit-margin-end: 0;
          margin-inline-end: 0;
}

@media (max-width: 768px) {
  .debrief-guest-page {
    flex-direction: column;
    height: auto;
    min-height: 100vh;
    overflow: visible;
  }

  .debrief-guest-sidebar {
    flex: none;
    width: 100%;
    max-height: none;
    border-right: none;
    border-bottom: 1px solid #e8e8e8;
  }

  .debrief-guest-main {
    min-height: 60vh;
  }
}
/* PBL 项目化学习 · 对齐 ASL 玻璃桌面（Chrome 80：无 color-mix / :has / conic-gradient） */

.pbl-projects-container {
  /* 默认暖橙；主题通过 data-asl-theme 覆盖 */
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 20px 44px rgba(160, 48, 18, 0.22);
  --asl-radius: 28px;
  --pbl-glass: rgba(255, 255, 255, 0.88);
  --pbl-glass-border: rgba(255, 255, 255, 0.42);

  position: relative;
  box-sizing: border-box;
  min-height: 100vh;
  min-height: 100dvh;
  padding: 20px 18px 28px;
  overflow: auto;
  color: var(--asl-ink);
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
  background:
    radial-gradient(ellipse 80% 60% at 8% 12%, rgba(255, 255, 255, 0.34) 0%, rgba(255, 255, 255, 0) 55%),
    radial-gradient(ellipse 70% 55% at 92% 78%, var(--asl-glow) 0%, rgba(255, 255, 255, 0) 58%),
    radial-gradient(circle at 72% 6%, rgba(255, 255, 255, 0.22) 0%, rgba(255, 255, 255, 0) 40%),
    linear-gradient(148deg, var(--asl-accent-soft) 0%, var(--asl-accent) 46%, var(--asl-accent-deep) 100%);
  -webkit-tap-highlight-color: transparent;
}

.pbl-projects-container[data-asl-theme="azure"] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-card-surface: #f0f6ff;
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 20px 44px rgba(30, 64, 175, 0.2);
}

.pbl-projects-container[data-asl-theme="tech"] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-card-surface: #ecfeff;
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 20px 44px rgba(14, 116, 144, 0.22);
}

.pbl-projects-container[data-asl-theme="emerald"] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-card-surface: #ecfdf5;
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 20px 44px rgba(4, 120, 87, 0.2);
}

.pbl-projects-container[data-asl-theme="violet"] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-card-surface: #f5f3ff;
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 20px 44px rgba(91, 33, 182, 0.2);
}

.pbl-projects-container::before,
.pbl-projects-container::after {
  content: "";
  position: absolute;
  border-radius: 50%;
  pointer-events: none;
  z-index: 0;
}

.pbl-projects-container::before {
  width: 42vw;
  height: 42vw;
  left: -12vw;
  top: -18vw;
  background: rgba(255, 255, 255, 0.12);
}

.pbl-projects-container::after {
  width: 36vw;
  height: 36vw;
  right: -10vw;
  bottom: -16vw;
  background: var(--asl-glow);
}

.pbl-projects-content {
  position: relative;
  z-index: 1;
  max-width: 1400px;
  margin: 0 auto;
}

/* 页头玻璃卡 */
.pbl-projects-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  flex-wrap: wrap;
  gap: 16px;
  background: var(--pbl-glass);
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-radius: var(--asl-radius);
  padding: 22px 26px;
  margin-bottom: 18px;
  box-shadow: var(--asl-shadow);
  border: 1px solid var(--pbl-glass-border);
}

.pbl-projects-title {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 0;
}

.pbl-projects-title h1 {
  margin: 0;
  font-size: 26px;
  font-weight: 700;
  letter-spacing: 0.02em;
  color: var(--asl-ink);
}

.pbl-projects-title-icon {
  width: 48px;
  height: 48px;
  border-radius: 16px;
  background: linear-gradient(148deg, var(--asl-pill-from) 0%, var(--asl-pill-to) 100%);
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 22px;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.14);
  flex-shrink: 0;
}

.pbl-projects-actions {
  display: flex;
  gap: 12px;
  align-items: center;
}

/* 主按钮：通栏圆角 pill */
.pbl-create-btn {
  height: 44px !important;
  border-radius: 999px !important;
  font-size: 15px !important;
  font-weight: 600 !important;
  padding: 0 22px !important;
  background: linear-gradient(148deg, var(--asl-pill-from) 0%, var(--asl-pill-to) 100%) !important;
  border: none !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.16) !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease;
}

.pbl-create-btn:hover,
.pbl-create-btn:focus {
  color: #fff !important;
  transform: translateY(-1px);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.2) !important;
}

.pbl-create-btn:active {
  transform: translateY(0);
}

/* 标签页 */
.pbl-tabs {
  background: transparent;
}

.pbl-tabs .ant-tabs-nav {
  margin: 0 0 12px;
  padding: 0 4px;
}

.pbl-tabs .ant-tabs-nav::before {
  border-bottom-color: rgba(0, 0, 0, 0.06) !important;
}

.pbl-tabs .ant-tabs-tab {
  padding: 10px 18px;
  font-size: 15px;
  font-weight: 500;
  border-radius: 14px 14px 0 0;
  color: var(--asl-ink-soft);
  transition: background 0.2s ease, color 0.2s ease;
}

.pbl-tabs .ant-tabs-tab:hover {
  color: var(--asl-ink);
  background: rgba(255, 255, 255, 0.45);
}

.pbl-tabs .ant-tabs-tab-active {
  background: rgba(255, 255, 255, 0.55);
}

.pbl-tabs .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--asl-accent-deep) !important;
  font-weight: 600;
}

.pbl-tabs .ant-tabs-ink-bar {
  background: linear-gradient(90deg, var(--asl-pill-from), var(--asl-pill-to));
  height: 3px;
  border-radius: 2px;
}

/* 主内容玻璃卡 */
.pbl-main-card {
  background: var(--pbl-glass) !important;
  -webkit-backdrop-filter: blur(14px);
  backdrop-filter: blur(14px);
  border-radius: var(--asl-radius) !important;
  padding: 20px 22px 28px !important;
  box-shadow: var(--asl-shadow) !important;
  border: 1px solid var(--pbl-glass-border) !important;
  min-height: 520px;
  animation: pblFadeIn 0.45s ease-out;
}

.pbl-main-card > .ant-card-body {
  padding: 0 !important;
}

/* 表格 */
.pbl-projects-table {
  background: transparent;
}

.pbl-projects-table .ant-table {
  background: transparent;
  border-radius: 18px;
  overflow: hidden;
}

.pbl-projects-table .ant-table-thead > tr > th {
  background: var(--asl-card-surface) !important;
  border: none !important;
  padding: 14px 16px;
  font-weight: 600;
  font-size: 14px;
  color: var(--asl-ink);
  text-align: left;
}

.pbl-projects-table .ant-table-tbody > tr {
  transition: background 0.2s ease, box-shadow 0.2s ease;
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
}

.pbl-projects-table .ant-table-tbody > tr:hover > td {
  background: var(--asl-card) !important;
}

.pbl-projects-table .ant-table-tbody > tr > td {
  padding: 18px 16px;
  border: none;
  vertical-align: middle;
  color: var(--asl-ink);
}

.pbl-project-title-link {
  font-size: 15px;
  font-weight: 600;
  color: var(--asl-ink) !important;
  transition: color 0.2s ease;
}

.pbl-project-title-link:hover {
  color: var(--asl-accent-deep) !important;
  text-decoration: none;
}

/* 标签 */
.pbl-subject-tag {
  border-radius: 999px !important;
  padding: 2px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
  border: 1px solid rgba(0, 0, 0, 0.06) !important;
  background: var(--asl-card) !important;
  color: var(--asl-accent-deep) !important;
}

.pbl-phase-tag {
  border-radius: 999px !important;
  padding: 4px 12px !important;
  font-size: 13px !important;
  font-weight: 500 !important;
}

.pbl-status-badge {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 5px 12px;
  border-radius: 999px;
  font-size: 13px;
  font-weight: 500;
}

.pbl-status-draft {
  background: rgba(140, 140, 140, 0.12);
  color: #6b6b6b;
}

.pbl-status-active {
  background: rgba(24, 144, 255, 0.12);
  color: #1677ff;
}

.pbl-status-completed {
  background: rgba(82, 196, 26, 0.14);
  color: #389e0d;
}

.pbl-status-archived {
  background: rgba(140, 140, 140, 0.12);
  color: #6b6b6b;
}

/* 操作按钮 */
.pbl-action-buttons {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.pbl-action-btn {
  min-width: 36px;
  height: 36px;
  border-radius: 12px !important;
  display: inline-flex !important;
  align-items: center;
  justify-content: center;
  border: 1.5px solid rgba(0, 0, 0, 0.08) !important;
  background: #fff !important;
  color: var(--asl-ink) !important;
  font-size: 16px;
  padding: 0 8px;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  transition: transform 0.2s ease, background 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.pbl-action-btn:hover {
  background: var(--asl-accent) !important;
  color: #fff !important;
  border-color: var(--asl-accent) !important;
  transform: translateY(-1px);
}

.pbl-action-btn .anticon {
  font-size: 16px;
  color: inherit;
}

.pbl-action-btn[class*="ant-btn-dangerous"] {
  color: #ff4d4f !important;
  border-color: #ff4d4f !important;
}

.pbl-action-btn[class*="ant-btn-dangerous"]:hover {
  background: #ff4d4f !important;
  color: #fff !important;
  border-color: #ff4d4f !important;
}

.pbl-node-view-btn {
  min-width: 40px !important;
  height: 36px !important;
  border-radius: 12px !important;
  font-size: 16px !important;
  font-weight: 600 !important;
  background: linear-gradient(148deg, var(--asl-pill-from) 0%, var(--asl-pill-to) 100%) !important;
  border: 1px solid rgba(255, 255, 255, 0.35) !important;
  color: #fff !important;
  padding: 0 12px !important;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.14) !important;
  display: inline-flex !important;
  align-items: center !important;
  justify-content: center !important;
  transition: transform 0.2s ease, box-shadow 0.2s ease !important;
}

.pbl-node-view-btn:hover {
  transform: translateY(-1px) !important;
  color: #fff !important;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.2) !important;
}

.pbl-node-view-btn .anticon {
  font-size: 16px !important;
  color: #fff !important;
}

.pbl-qeos-score {
  font-size: 14px;
  font-weight: 600;
  color: var(--asl-ink);
}

.pbl-qeos-score-empty {
  color: var(--asl-ink-soft);
  font-style: italic;
}

.pbl-empty-state {
  padding: 72px 24px;
  text-align: center;
}

.pbl-empty-state-icon {
  font-size: 56px;
  color: var(--asl-accent-soft);
  margin-bottom: 14px;
  opacity: 0.85;
}

.pbl-empty-state-text {
  font-size: 16px;
  color: var(--asl-ink-soft);
  margin-bottom: 22px;
}

.pbl-pagination {
  display: flex;
  justify-content: flex-end;
  margin-top: 20px;
  padding: 12px 0;
}

.pbl-pagination .ant-pagination {
  background: rgba(255, 255, 255, 0.55);
  padding: 8px 14px;
  border-radius: 14px;
}

.pbl-loading-container {
  display: flex;
  justify-content: center;
  align-items: center;
  min-height: 360px;
}

/* 驾驶舱嵌入主卡时圆角裁切 */
.pbl-main-card .pbl-dashboard {
  border-radius: 20px;
  min-height: 640px;
  height: 70vh;
  height: 70dvh;
}

/* Modal 玻璃感（挂载在 body，需全局类名 + 主题类） */
.pbl-asl-modal {
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-card-surface: #fff7f1;
}

.pbl-asl-modal.asl-theme-azure {
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-card-surface: #f0f6ff;
}

.pbl-asl-modal.asl-theme-tech {
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-card-surface: #ecfeff;
}

.pbl-asl-modal.asl-theme-emerald {
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-card-surface: #ecfdf5;
}

.pbl-asl-modal.asl-theme-violet {
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-card-surface: #f5f3ff;
}

.pbl-asl-modal .ant-modal-content {
  border-radius: 24px !important;
  overflow: hidden;
  background: rgba(255, 255, 255, 0.96) !important;
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.18) !important;
}

.pbl-asl-modal .ant-modal-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.06);
  border-radius: 24px 24px 0 0;
  background: transparent;
}

.pbl-asl-modal .ant-modal-title {
  font-weight: 600;
}

.pbl-asl-modal .ant-btn-primary {
  border-radius: 999px;
  border: none;
  background: linear-gradient(148deg, var(--asl-pill-from) 0%, var(--asl-pill-to) 100%);
  box-shadow: 0 8px 16px rgba(0, 0, 0, 0.12);
}

.pbl-asl-modal .ant-input,
.pbl-asl-modal .ant-input-affix-wrapper,
.pbl-asl-modal .ant-select-selector,
.pbl-asl-modal .ant-picker {
  border-radius: 12px !important;
}

.pbl-canvas-host {
  height: 80vh;
  height: 80dvh;
  overflow: hidden;
  border-radius: 16px;
  background: var(--asl-card-surface, #fff7f1);
}

.pbl-canvas-host[data-asl-theme="azure"] {
  --asl-card-surface: #f0f6ff;
}

.pbl-canvas-host[data-asl-theme="tech"] {
  --asl-card-surface: #ecfeff;
}

.pbl-canvas-host[data-asl-theme="emerald"] {
  --asl-card-surface: #ecfdf5;
}

.pbl-canvas-host[data-asl-theme="violet"] {
  --asl-card-surface: #f5f3ff;
}

@keyframes pblFadeIn {
  from {
    opacity: 0;
    transform: translateY(12px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* —— 横屏：双栏感页头 + 压低纵向占用（平板常见） —— */
@media (orientation: landscape) {
  .pbl-projects-container {
    padding: 14px 16px 18px;
  }

  .pbl-projects-content {
    max-width: 1600px;
  }

  .pbl-projects-header {
    padding: 14px 20px;
    margin-bottom: 12px;
    gap: 12px;
    flex-wrap: nowrap;
  }

  .pbl-projects-title h1 {
    font-size: 22px;
  }

  .pbl-projects-title-icon {
    width: 42px;
    height: 42px;
    border-radius: 14px;
    font-size: 20px;
  }

  .pbl-main-card {
    padding: 14px 16px 18px !important;
    min-height: 420px;
  }

  .pbl-main-card .pbl-dashboard {
    min-height: 420px;
    height: 68vh;
    height: 68dvh;
  }

  .pbl-tabs .ant-tabs-tab {
    padding: 8px 14px;
  }

  .pbl-asl-modal {
    top: 12px !important;
    padding-bottom: 0;
  }

  .pbl-asl-modal .ant-modal {
    max-width: 96vw;
    margin: 0 auto;
  }

  .pbl-canvas-host {
    height: 78vh;
    height: 78dvh;
  }
}

/* 矮横屏：进一步压缩页头与画布高度 */
@media (orientation: landscape) and (max-height: 560px) {
  .pbl-projects-container {
    padding: 10px 12px 14px;
  }

  .pbl-projects-header {
    padding: 10px 14px;
    margin-bottom: 8px;
  }

  .pbl-projects-title h1 {
    font-size: 18px;
  }

  .pbl-create-btn {
    height: 38px !important;
    padding: 0 16px !important;
  }

  .pbl-main-card {
    min-height: 280px;
    padding: 10px 12px 14px !important;
  }

  .pbl-main-card .pbl-dashboard {
    min-height: 260px;
    height: 58vh;
    height: 58dvh;
  }

  .pbl-canvas-host {
    height: 72vh;
    height: 72dvh;
  }

  .pbl-asl-modal {
    top: 8px !important;
  }
}

/* —— 竖屏：单列堆叠 + 触控友好间距 —— */
@media (orientation: portrait) {
  .pbl-projects-container {
    padding: 12px 12px 20px;
  }

  .pbl-projects-header {
    padding: 16px 16px;
    border-radius: 22px;
    flex-direction: column;
    align-items: stretch;
    gap: 12px;
  }

  .pbl-projects-title {
    width: 100%;
  }

  .pbl-projects-title h1 {
    font-size: 20px;
  }

  .pbl-projects-actions {
    width: 100%;
    justify-content: stretch;
  }

  .pbl-projects-actions .pbl-create-btn {
    width: 100%;
  }

  .pbl-main-card {
    padding: 14px 12px 20px !important;
    border-radius: 22px !important;
    min-height: 480px;
  }

  .pbl-tabs .ant-tabs-nav {
    margin-bottom: 10px;
  }

  .pbl-tabs .ant-tabs-tab {
    padding: 10px 12px;
    font-size: 14px;
  }

  .pbl-projects-table {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .pbl-projects-table .ant-table-tbody > tr > td {
    padding: 12px 8px;
  }

  .pbl-action-buttons {
    gap: 6px;
  }

  .pbl-pagination {
    justify-content: center;
  }

  .pbl-main-card .pbl-dashboard {
    min-height: 520px;
    height: 62vh;
    height: 62dvh;
  }

  .pbl-asl-modal .ant-modal {
    max-width: 94vw;
    margin: 0 auto;
  }

  .pbl-canvas-host {
    height: 76vh;
    height: 76dvh;
  }
}

/* 矮竖屏：压缩驾驶舱与空态 */
@media (orientation: portrait) and (max-height: 720px) {
  .pbl-projects-header {
    padding: 12px 14px;
  }

  .pbl-empty-state {
    padding: 48px 16px;
  }

  .pbl-empty-state-icon {
    font-size: 44px;
  }

  .pbl-main-card .pbl-dashboard {
    min-height: 400px;
    height: 56vh;
    height: 56dvh;
  }

  .pbl-canvas-host {
    height: 70vh;
    height: 70dvh;
  }
}

/* —— 学生参与态（非教师管理台） —— */
.pbl-student-participate .pbl-projects-title {
  display: flex;
  align-items: center;
  gap: 10px;
}

.pbl-student-back {
  width: 40px;
  height: 40px;
  border: 1px solid rgba(255, 255, 255, 0.55);
  border-radius: 14px;
  background: rgba(255, 255, 255, 0.28);
  color: #fff;
  font-size: 18px;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.pbl-student-empty-hint {
  margin: 8px auto 20px;
  max-width: 22em;
  font-size: 14px;
  line-height: 1.5;
  color: var(--asl-ink-soft);
  text-align: center;
}

.pbl-student-task-list {
  list-style: none;
  margin: 0;
  padding: 4px;
  display: flex;
  flex-direction: column;
  gap: 12px;
}

.pbl-student-task-card {
  width: 100%;
  text-align: left;
  border: 1px solid rgba(255, 255, 255, 0.75);
  border-radius: 18px;
  padding: 16px 18px;
  background: rgba(255, 255, 255, 0.92);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.08);
  cursor: pointer;
  display: flex;
  flex-direction: column;
  gap: 6px;
}

.pbl-student-task-card:active {
  transform: scale(0.985);
}

.pbl-student-task-card__title {
  font-size: 17px;
  font-weight: 700;
  color: var(--asl-ink);
}

.pbl-student-task-card__meta {
  font-size: 13px;
  color: var(--asl-ink-soft);
}

.pbl-student-task-card__action {
  margin-top: 4px;
  font-size: 13px;
  font-weight: 700;
  color: var(--asl-accent-deep);
}

.pbl-student-title-block {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 0;
}

.pbl-student-subtitle {
  margin: 0;
  font-size: 13px;
  line-height: 1.4;
  font-weight: 500;
  color: var(--asl-ink-soft, rgba(255, 255, 255, 0.85));
}

/* PC 产品壳内：对齐当前界面主题，空态不拉满宽 */
.pbl-student-participate--product {
  --asl-accent: var(--product-primary, #2563eb);
  --asl-accent-deep: var(--product-primary-hover, #1d4ed8);
  --asl-accent-soft: var(--product-accent, #0ea5e9);
  --asl-ink: var(--product-text, #1e293b);
  --asl-ink-soft: var(--product-text-secondary, #64748b);
  --asl-card: var(--product-surface, #f0f4f8);
  --asl-card-surface: var(--product-surface-card, #ffffff);
  --asl-pill-from: var(--product-primary, #2563eb);
  --asl-pill-to: var(--product-primary-hover, #1d4ed8);
  --asl-glow: rgba(37, 99, 235, 0.1);
  --asl-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  --asl-radius: 12px;
  --pbl-glass: var(--product-surface-card, #ffffff);
  --pbl-glass-border: rgba(30, 58, 95, 0.08);
  background: transparent;
  min-height: 0;
  padding: 0;
  overflow: visible;
  color: var(--product-text, #1e293b);
}

.pbl-student-participate--product::before,
.pbl-student-participate--product::after {
  display: none;
}

.pbl-student-participate--product .pbl-projects-content {
  max-width: 720px;
  margin: 0;
  padding: 0;
}

.pbl-student-participate--product .pbl-projects-header {
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  padding: 0 0 12px;
  margin-bottom: 12px;
}

.pbl-student-participate--product .pbl-projects-title h1 {
  margin: 0;
  color: var(--product-text, #1e293b);
  font-size: 1.35rem;
  font-weight: 700;
}

.pbl-student-participate--product .pbl-student-subtitle {
  color: var(--product-text-secondary, #64748b);
}

.pbl-student-participate--product .pbl-projects-title-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--product-primary-light, #dbeafe) !important;
  background-image: none !important;
  color: var(--product-primary, #2563eb);
  box-shadow: none;
  font-size: 18px;
}

.pbl-student-participate--product .pbl-main-card.pbl-student-card {
  min-height: 0 !important;
  max-width: 720px;
  padding: 28px 24px !important;
  border-radius: 12px !important;
  background: var(--product-surface-card, #fff) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08)) !important;
  border: 1px solid rgba(30, 58, 95, 0.08) !important;
}

.pbl-student-participate--product .pbl-empty-state {
  padding: 28px 8px 12px;
}

.pbl-student-participate--product .pbl-empty-state-icon {
  font-size: 32px;
  color: var(--product-primary, #2563eb);
  opacity: 1;
  margin-bottom: 10px;
}

.pbl-student-participate--product .pbl-empty-state-text {
  color: var(--product-text, #1e293b);
  margin-bottom: 8px;
  font-weight: 600;
}

.pbl-student-participate--product .pbl-student-empty-hint {
  color: var(--product-text-secondary, #64748b);
  margin-bottom: 0;
}

.pbl-student-participate--product .pbl-student-task-card {
  border: 1px solid rgba(30, 58, 95, 0.1);
  background: var(--product-surface-card, #fff);
  border-radius: 12px;
  box-shadow: none;
}

.pbl-student-participate--product .pbl-student-task-card__title {
  color: var(--product-text, #1e293b);
}

.pbl-student-participate--product .pbl-student-task-card__meta {
  color: var(--product-text-secondary, #64748b);
}

.pbl-student-participate--product .pbl-student-task-card__action {
  color: var(--product-primary, #2563eb);
}

.pbl-participant-modal .ant-modal-header {
  border-bottom: 1px solid rgba(30, 58, 95, 0.08);
}

.pbl-participant-modal .ant-modal-title {
  font-weight: 600;
}

/* PC 产品壳（教师/学生）：对齐当前界面主题，去掉 ASL 平板暖橙 */
.pbl-projects--product {
  --asl-accent: var(--product-primary, #2563eb);
  --asl-accent-deep: var(--product-primary-hover, #1d4ed8);
  --asl-accent-soft: var(--product-accent, #0ea5e9);
  --asl-ink: var(--product-text, #1e293b);
  --asl-ink-soft: var(--product-text-secondary, #64748b);
  --asl-card: var(--product-surface, #f0f4f8);
  --asl-card-surface: var(--product-surface-card, #ffffff);
  --asl-pill-from: var(--product-primary, #2563eb);
  --asl-pill-to: var(--product-primary-hover, #1d4ed8);
  --asl-glow: rgba(37, 99, 235, 0.1);
  --asl-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08));
  --asl-radius: 12px;
  --pbl-glass: var(--product-surface-card, #ffffff);
  --pbl-glass-border: rgba(30, 58, 95, 0.08);
  background: transparent;
  min-height: 0;
  padding: 0;
  overflow: visible;
  color: var(--product-text, #1e293b);
}

.pbl-projects--product::before,
.pbl-projects--product::after {
  display: none;
}

.pbl-projects--product .pbl-projects-content {
  max-width: none;
  margin: 0;
}

.pbl-projects--product .pbl-projects-header {
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
  box-shadow: none;
  border: none;
  border-radius: 0;
  padding: 0 0 16px;
  margin-bottom: 8px;
}

.pbl-projects--product .pbl-projects-title h1 {
  margin: 0;
  color: var(--product-text, #1e293b);
  font-size: 1.35rem;
  font-weight: 700;
}

.pbl-projects--product .pbl-projects-title-icon {
  width: 40px;
  height: 40px;
  border-radius: 10px;
  background: var(--product-primary-light, #dbeafe) !important;
  background-image: none !important;
  color: var(--product-primary, #2563eb);
  box-shadow: none;
  font-size: 18px;
}

.pbl-projects--product .pbl-create-btn.ant-btn-primary {
  border-radius: 10px !important;
  background: var(--product-primary, #2563eb) !important;
  background-image: none !important;
  border-color: var(--product-primary, #2563eb) !important;
}

.pbl-projects--product .pbl-main-card {
  min-height: 0 !important;
  padding: 16px 18px 20px !important;
  border-radius: 12px !important;
  background: var(--product-surface-card, #fff) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: var(--product-shadow-card, 0 8px 24px rgba(37, 99, 235, 0.08)) !important;
  border: 1px solid rgba(30, 58, 95, 0.08) !important;
}

.pbl-projects--product .pbl-tabs .ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--product-primary, #2563eb) !important;
}

.pbl-projects--product .pbl-tabs .ant-tabs-ink-bar {
  background: var(--product-primary, #2563eb) !important;
  background-image: none !important;
}
.phase-node {
  position: relative;
}

.phase-node-card {
  transition: all 0.3s ease;
}

.phase-node-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.phase-header {
  display: flex;
  justify-content: space-between;
  align-items: center;
  margin-bottom: 8px;
}

.phase-content {
  padding-top: 8px;
}

.task-node {
  position: relative;
}

.task-node-card {
  transition: all 0.3s ease;
}

.task-node-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.task-header {
  margin-bottom: 8px;
}

.task-content {
  padding-top: 8px;
}

/* 参与者弹层挂到 body，避免受画布节点 transform/动画影响；减轻文字子像素抖动 */
.task-node-participant-popover .ant-popover-inner-content {
  -webkit-font-smoothing: antialiased;
}

/* 弹层内禁用 hover 放大/过渡，避免文字与单选圆圈在滚动区域边缘抖动或被裁切 */
.task-node-participant-popover .task-node-participant-content,
.task-node-participant-popover .task-node-participant-content * {
  transform: none !important;
}

.task-node-participant-popover .task-node-participant-content .ant-radio-wrapper,
.task-node-participant-popover .task-node-participant-content .ant-typography,
.task-node-participant-popover .task-node-participant-content .ant-btn,
.task-node-participant-popover .task-node-participant-content .ant-select,
.task-node-participant-popover .task-node-participant-content .ant-input {
  transition: none !important;
}

.assessment-node {
  position: relative;
}

.assessment-node-card {
  transition: all 0.3s ease;
}

.assessment-node-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.assessment-header {
  margin-bottom: 8px;
}

.assessment-content {
  padding-top: 8px;
}

.agent-node {
  position: relative;
}

.agent-node-card {
  min-width: 250px;
  transition: all 0.3s ease;
}

.agent-node-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.agent-node-header {
  margin-bottom: 8px;
}

.agent-node-content {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid #f0f0f0;
}

.agent-insights,
.agent-suggestions {
  margin-bottom: 12px;
}

.agent-suggestions ul {
  margin: 8px 0 0 0;
  padding-left: 20px;
}

.agent-suggestions li {
  margin-bottom: 4px;
}

.agent-actions {
  margin-top: 12px;
  display: flex;
  flex-direction: column;
  gap: 8px;
}

.performance-metrics {
  margin-top: 8px;
}

.performance-metrics > div {
  margin-bottom: 4px;
}

.resource-node {
  position: relative;
}

.resource-node-card {
  transition: all 0.3s ease;
}

.resource-node-card:hover {
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.resource-header {
  margin-bottom: 8px;
}

.resource-content {
  padding-top: 8px;
}

.agent-chat-container {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.chat-messages {
  flex: 1;
  overflow-y: auto;
  padding: 16px;
  min-height: 300px;
  max-height: 500px;
}

.empty-chat {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 100%;
  padding: 32px;
  text-align: center;
}

.chat-message {
  max-width: 70%;
  padding: 12px;
  border-radius: 8px;
  margin-bottom: 8px;
}

.chat-message.user-message {
  background: #e6f7ff;
  border: 1px solid #91d5ff;
  margin-left: auto;
}

.chat-message.agent-message {
  background: #f6ffed;
  border: 1px solid #b7eb8f;
  margin-right: auto;
}

.thinking-indicator {
  padding: 12px;
  text-align: center;
  color: #8c8c8c;
}

.chat-input {
  padding: 16px;
  border-top: 1px solid #f0f0f0;
}

.agent-panel-inner {
  position: relative;
  min-height: 420px;
  isolation: isolate;
}

.agent-reference-backdrop {
  position: absolute;
  inset: 0;
  z-index: 50;
  background: rgba(0, 0, 0, 0.2);
}

.agent-reference-sheet {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 51;
  display: flex;
  flex-direction: column;
  background: #fff;
  box-shadow: -4px 0 16px rgba(0, 0, 0, 0.12);
  overflow: hidden;
}

.agent-reference-sheet-header {
  flex-shrink: 0;
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  gap: 8px;
  padding: 8px 0 12px;
  margin: 0 0 0;
  border-bottom: 1px solid #f0f0f0;
}

.agent-reference-sheet-body {
  flex: 1;
  overflow-y: auto;
  padding: 12px 0 16px;
}

.node-creator-popover {
  padding: 8px 0;
}

.node-type-card {
  transition: all 0.3s ease;
}

.node-type-card:hover {
  transform: translateY(-2px);
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15);
}

.data-dashboard {
  padding: 16px;
}

.collaboration-layer {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  pointer-events: none;
  z-index: 1000;
}

.collaborator-cursor {
  position: absolute;
  display: flex;
  align-items: center;
  gap: 4px;
  pointer-events: none;
  transition: all 0.1s ease;
  transform: translate(-50%, -50%);
}

.cursor-line {
  width: 2px;
  height: 20px;
  border-radius: 1px;
  opacity: 0.7;
}

/* 节点式 PBL 画布 · ASL 玻璃工具栏（Chrome 80 友好） */

.node-based-project-canvas {
  --asl-accent: #ff6b3d;
  --asl-accent-deep: #e84f28;
  --asl-accent-soft: #ff8f5c;
  --asl-ink: #5c3a2a;
  --asl-ink-soft: #8a6452;
  --asl-card: #fff8f3;
  --asl-card-surface: #fff7f1;
  --asl-pill-from: #ff7d4a;
  --asl-pill-to: #f24a1c;
  --asl-glow: rgba(255, 200, 90, 0.16);
  --asl-shadow: 0 16px 36px rgba(160, 48, 18, 0.16);

  width: 100%;
  height: 100%;
  min-height: 100%;
  display: flex;
  flex-direction: column;
  background:
    radial-gradient(ellipse 60% 40% at 10% 0%, rgba(255, 255, 255, 0.55) 0%, rgba(255, 255, 255, 0) 55%),
    linear-gradient(180deg, var(--asl-card) 0%, var(--asl-card-surface) 100%);
  color: var(--asl-ink);
  border-radius: 16px;
  overflow: hidden;
  font-family: "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "Noto Sans SC", sans-serif;
}

.node-based-project-canvas[data-asl-theme="azure"] {
  --asl-accent: #3b82f6;
  --asl-accent-deep: #1d4ed8;
  --asl-accent-soft: #60a5fa;
  --asl-ink: #1e3a5f;
  --asl-ink-soft: #5b7a9d;
  --asl-card: #f4f8ff;
  --asl-card-surface: #f0f6ff;
  --asl-pill-from: #60a5fa;
  --asl-pill-to: #2563eb;
  --asl-glow: rgba(125, 211, 252, 0.22);
  --asl-shadow: 0 16px 36px rgba(30, 64, 175, 0.14);
}

.node-based-project-canvas[data-asl-theme="tech"] {
  --asl-accent: #0891b2;
  --asl-accent-deep: #0e7490;
  --asl-accent-soft: #22d3ee;
  --asl-ink: #0f172a;
  --asl-ink-soft: #475569;
  --asl-card: #f0fdfa;
  --asl-card-surface: #ecfeff;
  --asl-pill-from: #22d3ee;
  --asl-pill-to: #0e7490;
  --asl-glow: rgba(34, 211, 238, 0.2);
  --asl-shadow: 0 16px 36px rgba(14, 116, 144, 0.14);
}

.node-based-project-canvas[data-asl-theme="emerald"] {
  --asl-accent: #10b981;
  --asl-accent-deep: #047857;
  --asl-accent-soft: #34d399;
  --asl-ink: #064e3b;
  --asl-ink-soft: #3d7a66;
  --asl-card: #f0fdf8;
  --asl-card-surface: #ecfdf5;
  --asl-pill-from: #34d399;
  --asl-pill-to: #059669;
  --asl-glow: rgba(52, 211, 153, 0.2);
  --asl-shadow: 0 16px 36px rgba(4, 120, 87, 0.14);
}

.node-based-project-canvas[data-asl-theme="violet"] {
  --asl-accent: #8b5cf6;
  --asl-accent-deep: #6d28d9;
  --asl-accent-soft: #a78bfa;
  --asl-ink: #3b0764;
  --asl-ink-soft: #6b21a8;
  --asl-card: #faf5ff;
  --asl-card-surface: #f5f3ff;
  --asl-pill-from: #a78bfa;
  --asl-pill-to: #7c3aed;
  --asl-glow: rgba(196, 181, 253, 0.22);
  --asl-shadow: 0 16px 36px rgba(91, 33, 182, 0.14);
}

.canvas-toolbar {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 10px 14px;
  background: rgba(255, 255, 255, 0.72);
  -webkit-backdrop-filter: blur(12px);
  backdrop-filter: blur(12px);
  border-bottom: 1px solid rgba(255, 255, 255, 0.45);
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.05);
  z-index: 10;
}

.canvas-toolbar .ant-btn {
  border-radius: 12px;
  border-color: rgba(0, 0, 0, 0.08);
  color: var(--asl-ink);
}

.canvas-toolbar .ant-btn-primary,
.canvas-toolbar .ant-btn-default:hover {
  border-color: var(--asl-accent);
}

.toolbar-left,
.toolbar-right {
  display: flex;
  gap: 8px;
  align-items: center;
  flex-wrap: wrap;
}

.canvas-container {
  flex: 1;
  position: relative;
  overflow: hidden;
}

.canvas-container .react-flow {
  background: transparent;
}

.canvas-container .react-flow__background {
  opacity: 0.55;
}

/* 节点选中 */
.node.selected .ant-card {
  box-shadow: 0 0 0 2px var(--asl-accent);
  animation: pblSelectedPulse 2s infinite;
}

@keyframes pblSelectedPulse {
  0%, 100% {
    box-shadow: 0 0 0 2px var(--asl-accent);
  }
  50% {
    box-shadow: 0 0 0 4px rgba(0, 0, 0, 0.08);
  }
}

.node[data-status="active"] .ant-card {
  animation: pblActivePulse 2s infinite;
}

@keyframes pblActivePulse {
  0%, 100% { opacity: 1; }
  50% { opacity: 0.85; }
}

.node[data-status="warning"] .ant-card {
  animation: pblWarningBlink 1s infinite;
}

@keyframes pblWarningBlink {
  0%, 100% { border-color: #ff4d4f; }
  50% { border-color: rgba(255, 77, 79, 0.45); }
}

.node[data-status="completed"] .ant-card {
  animation: pblCompletedIn 0.45s ease-out;
}

@keyframes pblCompletedIn {
  from {
    opacity: 0;
    transform: scale(0.94);
  }
  to {
    opacity: 1;
    transform: scale(1);
  }
}

.react-flow__edge[data-type="feedback"] {
  animation: pblFlowDash 2s infinite;
}

@keyframes pblFlowDash {
  0% { stroke-dashoffset: 0; }
  100% { stroke-dashoffset: 20; }
}

.connection-status {
  position: absolute;
  top: 70px;
  right: 20px;
  padding: 8px 14px;
  background: rgba(255, 255, 255, 0.9);
  -webkit-backdrop-filter: blur(8px);
  backdrop-filter: blur(8px);
  border-radius: 999px;
  box-shadow: 0 6px 16px rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.5);
  font-size: 12px;
  color: var(--asl-ink);
  z-index: 1000;
  display: flex;
  align-items: center;
  gap: 8px;
}

/* 画布内节点卡片统一玻璃圆角 */
.node-based-project-canvas .ant-card {
  border-radius: 22px !important;
  background: rgba(255, 255, 255, 0.92) !important;
  border: 1px solid rgba(255, 255, 255, 0.55) !important;
  box-shadow: 0 10px 24px rgba(0, 0, 0, 0.08) !important;
  overflow: hidden;
}

.node-based-project-canvas .react-flow__controls {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1);
  border: 1px solid rgba(255, 255, 255, 0.5);
}

.node-based-project-canvas .react-flow__minimap {
  border-radius: 14px;
  overflow: hidden;
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.1);
}

/* 横屏：工具栏单行优先，连接状态靠右上 */
@media (orientation: landscape) {
  .canvas-toolbar {
    padding: 8px 12px;
  }

  .toolbar-left,
  .toolbar-right {
    flex-wrap: nowrap;
  }

  .connection-status {
    top: 58px;
    right: 14px;
  }

  .node-based-project-canvas .react-flow__minimap {
    width: 120px !important;
    height: 80px !important;
  }
}

@media (orientation: landscape) and (max-height: 560px) {
  .canvas-toolbar {
    padding: 6px 10px;
  }

  .connection-status {
    top: 52px;
    padding: 6px 10px;
    font-size: 11px;
  }

  .node-based-project-canvas .react-flow__minimap {
    display: none;
  }
}

/* 竖屏：工具栏可换行，触控按钮略放大 */
@media (orientation: portrait) {
  .canvas-toolbar {
    padding: 10px 12px;
    flex-wrap: wrap;
    gap: 8px;
  }

  .toolbar-left,
  .toolbar-right {
    width: 100%;
    justify-content: flex-start;
    flex-wrap: wrap;
  }

  .canvas-toolbar .ant-btn {
    min-height: 36px;
  }

  .connection-status {
    top: auto;
    bottom: 16px;
    right: 12px;
  }

  .node-based-project-canvas .react-flow__controls {
    bottom: 12px;
  }

  .node-based-project-canvas .react-flow__minimap {
    display: none;
  }
}

.pbl-dashboard * {
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.pbl-dashboard ol,
.pbl-dashboard ul,
.pbl-dashboard li {
  list-style: none;
}
.pbl-dashboard {
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: url(/images/pbl/background.png) no-repeat center;
  background-size: 100%;
  position: relative;
}
.pbl-dashboard-loading {
  width: 100%;
  height: 100vh;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #fff;
  font-size: 1.5rem;
}
@font-face {
  font-family: '液晶数字字体';
  src: url('/fonts/%E6%B6%B2%E6%99%B6%E6%95%B0%E5%AD%97%E5%AD%97%E4%BD%93.TTF');
}
.pbl-dashboard .header {
  width: 75%;
  height: 10%;
  margin: auto;
}
.pbl-dashboard .header > div {
  float: left;
}
.pbl-dashboard .header .title {
  height: 100%;
  width: 40%;
  text-align: center;
  color: #fff;
  font-size: 1.4rem;
  display: table;
  opacity: 0;
  animation: zoomIn 0.5s linear forwards 0.8s;
}
.pbl-dashboard .header .title span {
  display: table-cell;
  vertical-align: middle;
}
.pbl-dashboard .header .left,
.pbl-dashboard .header .right {
  width: 30%;
  height: 100%;
  float: left;
}
.pbl-dashboard .header .left li,
.pbl-dashboard .header .right li {
  width: 3.5rem;
  height: 1rem;
  background-color: #02b687;
  opacity: 0;
  margin: 0 2%;
  float: left;
  border-radius: 1rem;
  margin-top: 10%;
}
.pbl-dashboard .header .left li:nth-of-type(1) {
  animation: show1 0.2s linear forwards;
}
.pbl-dashboard .header .left li:nth-of-type(2) {
  animation: show2 0.2s linear forwards 0.2s;
}
.pbl-dashboard .header .left li:nth-of-type(3) {
  animation: show3 0.2s linear forwards 0.4s;
}
.pbl-dashboard .header .left li:nth-of-type(4) {
  animation: show4 0.2s linear forwards 0.6s;
}
.pbl-dashboard .header .right li {
  float: right;
}
.pbl-dashboard .header .right li:nth-of-type(1) {
  animation: show1 0.2s linear forwards;
}
.pbl-dashboard .header .right li:nth-of-type(2) {
  animation: show2 0.2s linear forwards 0.2s;
}
.pbl-dashboard .header .right li:nth-of-type(3) {
  animation: show3 0.2s linear forwards 0.4s;
}
.pbl-dashboard .header .right li:nth-of-type(4) {
  animation: show4 0.2s linear forwards 0.6s;
}
.pbl-dashboard .main {
  width: 100%;
  height: 60%;
}
.pbl-dashboard .main > div {
  float: left;
}
.pbl-dashboard .main .main-left {
  width: 22.5%;
  height: 100%;
}
.pbl-dashboard .main .main-left .completion {
  width: 100%;
  height: 30%;
  position: relative;
  container-type: inline-size;
}
.pbl-dashboard .main .main-left .completion .completion-content {
  width: 7rem;
  height: 7rem;
  background: url(/images/pbl/border.png) no-repeat center;
  background-size: contain;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  animation: animate1-center 1s linear forwards 7s;
}
.pbl-dashboard .main .main-left .completion .completion-content .rate {
  width: 4rem;
  height: 4rem;
  position: absolute;
  left: 17%;
  top: 51%;
  transform: translateY(-50%);
  background: url(/images/pbl/cricle.png) no-repeat center;
  background-size: contain;
  animation: rotate1 5s ease infinite;
}
.pbl-dashboard .main .main-left .completion .completion-content .rate h5 {
  text-align: center;
  height: 50%;
  width: 100%;
  color: #fff;
  display: table;
}
.pbl-dashboard .main .main-left .completion .completion-content .rate h5 span {
  display: table-cell;
  vertical-align: bottom;
  font-size: 0.8rem;
}
.pbl-dashboard .main .main-left .completion .completion-content .rate p {
  text-align: center;
  height: 50%;
  width: 100%;
  color: #fff;
  display: table;
}
.pbl-dashboard .main .main-left .completion .completion-content .rate p span {
  display: table-cell;
  vertical-align: middle;
}
.pbl-dashboard .main .main-left .lightning {
  width: 100%;
  height: 40%;
}
.pbl-dashboard .main .main-left .lightning .lightning1,
.pbl-dashboard .main .main-left .lightning .lightning2 {
  width: 100%;
  height: 50%;
}
.pbl-dashboard .main .main-left .lightning .lightning1 > div {
  float: left;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .sd1 {
  width: 55%;
  height: 100%;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 {
  width: 45%;
  height: 100%;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 > div {
  float: left;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul {
  float: left;
  margin-top: 30%;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li {
  float: left;
  margin-right: 0.15rem;
  background-color: #00e4c8;
  border-radius: 50%;
  opacity: 0;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(1) {
  width: 0.5rem;
  height: 0.5rem;
  animation: show4 0.1s linear forwards 2.5s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(2) {
  width: 0.54rem;
  height: 0.54rem;
  animation: show4 0.1s linear forwards 2.6s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(3) {
  width: 0.58rem;
  height: 0.58rem;
  animation: show4 0.1s linear forwards 2.7s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(4) {
  width: 0.62rem;
  height: 0.62rem;
  animation: show4 0.1s linear forwards 2.8s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(5) {
  width: 0.66rem;
  height: 0.66rem;
  animation: show4 0.1s linear forwards 2.9s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(6) {
  width: 0.7rem;
  height: 0.7rem;
  animation: show4 0.1s linear forwards 3s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 ul li:nth-of-type(7) {
  width: 0.74rem;
  height: 0.74rem;
  animation: show4 0.1s linear forwards 3.1s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 .box1 {
  width: 0.8rem;
  height: 40%;
  background-color: #00e4c8;
  margin-left: 5%;
  margin-top: 20%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.2s;
}
.pbl-dashboard .main .main-left .lightning .lightning1 .jd1 .box2 {
  width: 0.8rem;
  height: 60%;
  background-color: #00e4c8;
  margin-top: 15%;
  margin-left: 5%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.3s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 > div {
  float: left;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .sd2 {
  width: 55%;
  height: 100%;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 {
  width: 45%;
  height: 100%;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 > div {
  float: left;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul {
  float: left;
  margin-top: 30%;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li {
  float: left;
  margin-right: 0.15rem;
  background-color: #00e4c8;
  border-radius: 50%;
  opacity: 0;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(1) {
  width: 0.5rem;
  height: 0.5rem;
  animation: show4 0.1s linear forwards 2.5s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(2) {
  width: 0.54rem;
  height: 0.54rem;
  animation: show4 0.1s linear forwards 2.6s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(3) {
  width: 0.58rem;
  height: 0.58rem;
  animation: show4 0.1s linear forwards 2.7s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(4) {
  width: 0.62rem;
  height: 0.62rem;
  animation: show4 0.1s linear forwards 2.8s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(5) {
  width: 0.66rem;
  height: 0.66rem;
  animation: show4 0.1s linear forwards 2.9s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(6) {
  width: 0.7rem;
  height: 0.7rem;
  animation: show4 0.1s linear forwards 3s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 ul li:nth-of-type(7) {
  width: 0.74rem;
  height: 0.74rem;
  animation: show4 0.1s linear forwards 3.1s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 .box1 {
  width: 0.8rem;
  height: 40%;
  background-color: #00e4c8;
  margin-left: 5%;
  margin-top: 20%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.2s;
}
.pbl-dashboard .main .main-left .lightning .lightning2 .jd2 .box2 {
  width: 0.8rem;
  height: 60%;
  background-color: #00e4c8;
  margin-top: 15%;
  margin-left: 5%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.3s;
}
.pbl-dashboard .main .main-left .top3 {
  width: 100%;
  height: 30%;
  position: relative;
  container-type: inline-size;
}
.pbl-dashboard .main .main-left .top3 ul {
  width: 60%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  animation: animate1-slide 1s linear forwards 7s;
}
.pbl-dashboard .main .main-left .top3 ul li {
  float: left;
  width: 30%;
  height: 100%;
  margin: 0 1.5%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(1) {
  background: url(/images/pbl/1.png) no-repeat center bottom;
  background-size: 70%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(1) .title {
  width: 100%;
  text-align: center;
  color: #ff7a9a;
  font-size: 0.8rem;
  margin-top: -5%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(1) .content {
  width: 100%;
  text-align: center;
  color: #fff;
  margin-top: 10%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(1) .content p {
  font-size: 0.3rem;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(1) .content span {
  font-size: 0.5rem;
  display: block;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(2) {
  background: url(/images/pbl/2.png) no-repeat center bottom;
  background-size: 70%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(2) .title {
  width: 100%;
  text-align: center;
  color: #01c793;
  font-size: 0.8rem;
  margin-top: 20%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(2) .content {
  width: 100%;
  text-align: center;
  color: #fff;
  margin-top: 10%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(2) .content p {
  font-size: 0.3rem;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(2) .content span {
  font-size: 0.5rem;
  display: block;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(3) {
  background: url(/images/pbl/3.png) no-repeat center bottom;
  background-size: 70%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(3) .title {
  width: 100%;
  text-align: center;
  color: #01c2aa;
  font-size: 0.8rem;
  margin-top: 43%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(3) .content {
  width: 100%;
  text-align: center;
  color: #fff;
  margin-top: 10%;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(3) .content p {
  font-size: 0.3rem;
}
.pbl-dashboard .main .main-left .top3 ul li:nth-of-type(3) .content span {
  font-size: 0.3rem;
  display: block;
}
.pbl-dashboard .main .main-middle {
  width: 55%;
  height: 100%;
  position: relative;
}
.pbl-dashboard .main .main-middle .external1 {
  width: 15%;
  height: 100%;
  background: url(/images/pbl/border1.png) no-repeat left;
  background-size: contain;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  animation: come1 0.5s linear forwards 3.4s;
}
.pbl-dashboard .main .main-middle .external2 {
  width: 15%;
  height: 100%;
  background: url(/images/pbl/border2.png) no-repeat right;
  background-size: contain;
  position: absolute;
  right: 0;
  top: 0;
  opacity: 0;
  animation: come2 0.5s linear forwards 3.4s;
}
.pbl-dashboard .main .main-middle .external3 {
  width: 60%;
  height: 10%;
  background: url(/images/pbl/border3.png) no-repeat center top;
  background-size: contain;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 15%;
  opacity: 0;
  animation: come3 0.5s linear forwards 3.4s;
}
.pbl-dashboard .main .main-middle .external4 {
  width: 60%;
  height: 10%;
  background: url(/images/pbl/border4.png) no-repeat center bottom;
  background-size: contain;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  opacity: 0;
  bottom: 10%;
  animation: come4 0.5s linear forwards 3.4s;
}
.pbl-dashboard .main .main-middle .jz1,
.pbl-dashboard .main .main-middle .jz2 {
  opacity: 0;
  animation: show4 0.1s linear forwards 3.8s;
}
.pbl-dashboard .main .main-middle .jz1 ul,
.pbl-dashboard .main .main-middle .jz2 ul {
  width: 30%;
  height: 38%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  overflow: hidden;
}
.pbl-dashboard .main .main-middle .jz1 ul li,
.pbl-dashboard .main .main-middle .jz2 ul li {
  width: 100%;
  height: 8%;
  margin: 40% 0;
  background-color: #ff7a9a;
}
.pbl-dashboard .main .main-middle .jz1 {
  width: 4%;
  height: 100%;
  background-color: red;
  background: url(/images/pbl/jz.png) no-repeat center;
  background-size: contain;
  position: absolute;
  left: 5%;
  top: 0;
}
.pbl-dashboard .main .main-middle .jz2 {
  width: 4%;
  height: 100%;
  background-color: red;
  background: url(/images/pbl/jz.png) no-repeat center;
  background-size: contain;
  position: absolute;
  right: 5%;
  top: 0;
}
.pbl-dashboard .main .main-middle .inner1 {
  width: 10%;
  height: 100%;
  position: absolute;
  left: 10%;
  top: 0;
  opacity: 0;
  background: url(/images/pbl/leftBorder.png) no-repeat center;
  background-size: 100%;
  animation: inner1 0.3s linear forwards 3.9s;
}
.pbl-dashboard .main .main-middle .inner2 {
  width: 10%;
  height: 100%;
  position: absolute;
  right: 10%;
  top: 0;
  opacity: 0;
  background: url(/images/pbl/rightBorder.png) no-repeat center;
  background-size: 100%;
  animation: inner2 0.3s linear forwards 3.9s;
}
.pbl-dashboard .main .main-middle .arrow-l {
  position: absolute;
  width: 10%;
  height: 20%;
  left: 15%;
  top: 40%;
  opacity: 0;
  animation: arrow1 1.5s linear infinite 4s;
}
.pbl-dashboard .main .main-middle .arrow-l ol {
  width: 100%;
  height: 100%;
}
.pbl-dashboard .main .main-middle .arrow-l ol li {
  width: 33%;
  height: 100%;
  float: left;
  background: url(/images/pbl/yuan.png) no-repeat center;
  background-size: 60%;
}
.pbl-dashboard .main .main-middle .arrow-l ol li:nth-of-type(3) {
  background: url(/images/pbl/arrow-l.png) no-repeat center;
  background-size: 80%;
}
.pbl-dashboard .main .main-middle .arrow-r {
  position: absolute;
  width: 10%;
  height: 20%;
  right: 15%;
  top: 40%;
  opacity: 0;
  animation: arrow2 1.5s linear infinite 4s;
}
.pbl-dashboard .main .main-middle .arrow-r ol {
  width: 100%;
  height: 100%;
}
.pbl-dashboard .main .main-middle .arrow-r ol li {
  width: 33%;
  height: 100%;
  float: right;
  background: url(/images/pbl/yuan.png) no-repeat center;
  background-size: 60%;
}
.pbl-dashboard .main .main-middle .arrow-r ol li:nth-of-type(3) {
  background: url(/images/pbl/arrow-r.png) no-repeat center;
  background-size: 80%;
}
.pbl-dashboard .main .main-middle .meter {
  width: 50%;
  height: 60%;
  background-color: rgba(255, 255, 255, 0.2);
  background: url(/images/pbl/huan.png) no-repeat center;
  background-size: 100%;
  position: absolute;
  left: 50%;
  top: 50%;
  opacity: 0;
  transform: translate(-50%, -50%);
  animation: meter 3s linear forwards 4.1s;
}
.pbl-dashboard .main .main-middle .animate {
  width: 70%;
  height: 70%;
  z-index: -1;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  opacity: 0;
  animation: animate 1s linear forwards 6s;
}
.pbl-dashboard .main .main-middle .animate canvas {
  transform-origin: 0 0;
  position: absolute;
  left: 0;
  top: 0;
  border-radius: 40%;
}
.pbl-dashboard .main .main-middle .sale {
  width: 16rem;
  height: 16rem;
  background: url(/images/pbl/cicle.png) no-repeat center;
  background-size: contain;
  position: absolute;
  left: 50%;
  top: 50%;
  margin-left: -8rem;
  margin-top: -8rem;
  opacity: 0;
  animation: sale 1s linear forwards 8s;
}
.pbl-dashboard .main .main-middle .sale p {
  width: 100%;
  height: 20%;
  text-align: center;
  color: #fff;
  display: table;
  font-size: 1.7rem;
}
.pbl-dashboard .main .main-middle .sale p span {
  display: table-cell;
  vertical-align: middle;
}
.pbl-dashboard .main .main-middle .sale p:nth-of-type(1) {
  margin-top: 30%;
}
.pbl-dashboard .main .main-middle .sale p:nth-of-type(2) {
  font-family: '液晶数字字体';
  font-size: 2rem;
}
.pbl-dashboard .main .main-right {
  width: 22.5%;
  height: 100%;
}
.pbl-dashboard .main .main-right .compare {
  width: 100%;
  height: 30%;
  position: relative;
  container-type: inline-size;
}
.pbl-dashboard .main .main-right .compare .compare-content {
  width: 7rem;
  height: 7rem;
  background: url(/images/pbl/border02.png) no-repeat center;
  background-size: contain;
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  animation: animate2-center 1s linear forwards 7s;
}
.pbl-dashboard .main .main-right .compare .compare-content .rate2 {
  width: 4rem;
  height: 4rem;
  position: absolute;
  left: 27%;
  top: 51%;
  transform: translateY(-50%);
  background: url(/images/pbl/cricle.png) no-repeat center;
  background-size: contain;
  animation: rotate1 5s ease infinite;
}
.pbl-dashboard .main .main-right .compare .compare-content .rate2 h5 {
  text-align: center;
  height: 50%;
  width: 100%;
  color: #fff;
  display: table;
}
.pbl-dashboard .main .main-right .compare .compare-content .rate2 h5 span {
  display: table-cell;
  vertical-align: bottom;
  font-size: 0.8rem;
}
.pbl-dashboard .main .main-right .compare .compare-content .rate2 p {
  text-align: center;
  height: 50%;
  width: 100%;
  color: #fff;
  display: table;
}
.pbl-dashboard .main .main-right .compare .compare-content .rate2 p span {
  display: table-cell;
  vertical-align: middle;
}
.pbl-dashboard .main .main-right .lightning {
  width: 100%;
  height: 40%;
}
.pbl-dashboard .main .main-right .lightning .lightning3,
.pbl-dashboard .main .main-right .lightning .lightning4 {
  width: 100%;
  height: 50%;
}
.pbl-dashboard .main .main-right .lightning .lightning3 > div {
  float: left;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 {
  width: 45%;
  height: 100%;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 > div {
  float: right;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul {
  float: right;
  margin-top: 30%;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li {
  float: right;
  margin-left: 0.15rem;
  background-color: #00e4c8;
  border-radius: 50%;
  opacity: 0;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(1) {
  width: 0.5rem;
  height: 0.5rem;
  animation: show4 0.1s linear forwards 2.5s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(2) {
  width: 0.54rem;
  height: 0.54rem;
  animation: show4 0.1s linear forwards 2.6s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(3) {
  width: 0.58rem;
  height: 0.58rem;
  animation: show4 0.1s linear forwards 2.7s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(4) {
  width: 0.62rem;
  height: 0.62rem;
  animation: show4 0.1s linear forwards 2.8s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(5) {
  width: 0.66rem;
  height: 0.66rem;
  animation: show4 0.1s linear forwards 2.9s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(6) {
  width: 0.7rem;
  height: 0.7rem;
  animation: show4 0.1s linear forwards 3s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 ul li:nth-of-type(7) {
  width: 0.74rem;
  height: 0.74rem;
  animation: show4 0.1s linear forwards 3.1s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 .box1 {
  width: 0.8rem;
  height: 40%;
  background-color: #00e4c8;
  margin-right: 5%;
  margin-top: 20%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.2s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .jd3 .box2 {
  width: 0.8rem;
  height: 60%;
  background-color: #00e4c8;
  margin-top: 15%;
  margin-right: 5%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.3s;
}
.pbl-dashboard .main .main-right .lightning .lightning3 .sd3 {
  width: 55%;
  height: 100%;
}
.pbl-dashboard .main .main-right .lightning .lightning4 > div {
  float: left;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 {
  width: 45%;
  height: 100%;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 > div {
  float: right;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul {
  float: right;
  margin-top: 30%;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li {
  float: right;
  margin-left: 0.15rem;
  background-color: #00e4c8;
  border-radius: 50%;
  opacity: 0;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(1) {
  width: 0.5rem;
  height: 0.5rem;
  animation: show4 0.1s linear forwards 2.5s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(2) {
  width: 0.54rem;
  height: 0.54rem;
  animation: show4 0.1s linear forwards 2.6s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(3) {
  width: 0.58rem;
  height: 0.58rem;
  animation: show4 0.1s linear forwards 2.7s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(4) {
  width: 0.62rem;
  height: 0.62rem;
  animation: show4 0.1s linear forwards 2.8s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(5) {
  width: 0.66rem;
  height: 0.66rem;
  animation: show4 0.1s linear forwards 2.9s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(6) {
  width: 0.7rem;
  height: 0.7rem;
  animation: show4 0.1s linear forwards 3s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 ul li:nth-of-type(7) {
  width: 0.74rem;
  height: 0.74rem;
  animation: show4 0.1s linear forwards 3.1s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 .box1 {
  width: 0.8rem;
  height: 40%;
  background-color: #00e4c8;
  margin-right: 5%;
  margin-top: 20%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.2s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .jd4 .box2 {
  width: 0.8rem;
  height: 60%;
  background-color: #00e4c8;
  margin-top: 15%;
  margin-right: 5%;
  border-radius: 0.8rem;
  opacity: 0;
  animation: show4 0.1s linear forwards 3.3s;
}
.pbl-dashboard .main .main-right .lightning .lightning4 .sd4 {
  width: 55%;
  height: 100%;
}
.pbl-dashboard .main .main-right .top6 {
  width: 100%;
  height: 30%;
  position: relative;
  container-type: inline-size;
}
.pbl-dashboard .main .main-right .top6 ul {
  width: 60%;
  height: 100%;
  position: absolute;
  left: 50%;
  top: 0;
  transform: translateX(-50%);
  animation: animate2-slide 1s linear forwards 7s;
}
.pbl-dashboard .main .main-right .top6 ul li {
  float: left;
  width: 30%;
  height: 100%;
  margin: 0 1.5%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(1) {
  background: url(/images/pbl/4.png) no-repeat center bottom;
  background-size: 70%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(1) .title {
  width: 100%;
  text-align: center;
  color: #cab636;
  font-size: 0.8rem;
  margin-top: 60%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(1) .content {
  width: 100%;
  text-align: center;
  color: #fff;
  margin-top: 10%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(1) .content p {
  font-size: 0.3rem;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(1) .content span {
  font-size: 0.5rem;
  display: block;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(2) {
  background: url(/images/pbl/5.png) no-repeat center bottom;
  background-size: 70%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(2) .title {
  width: 100%;
  text-align: center;
  color: #028e4f;
  font-size: 0.8rem;
  margin-top: 78%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(2) .content {
  width: 100%;
  text-align: center;
  color: #fff;
  margin-top: 10%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(2) .content p {
  font-size: 0.3rem;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(2) .content span {
  font-size: 0.5rem;
  display: block;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(3) {
  background: url(/images/pbl/6.png) no-repeat center bottom;
  background-size: 70%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(3) .title {
  width: 100%;
  text-align: center;
  color: #01a893;
  font-size: 0.8rem;
  margin-top: 95%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(3) .content {
  width: 100%;
  text-align: center;
  color: #fff;
  margin-top: 10%;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(3) .content p {
  font-size: 0.3rem;
}
.pbl-dashboard .main .main-right .top6 ul li:nth-of-type(3) .content span {
  font-size: 0.3rem;
  display: block;
}
.pbl-dashboard .bottom {
  width: 100%;
  height: 30%;
  position: relative;
  overflow: hidden;
}
.pbl-dashboard .bottom .ul-box {
  width: 200%;
  height: 100%;
  position: relative;
  animation: move 10s linear infinite 12s;
  transform: translateX(50%);
}
.pbl-dashboard .bottom .ul-box ul {
  float: left;
  width: 50%;
  height: 100%;
}
.pbl-dashboard .bottom .ul-box ul li {
  width: 30%;
  height: 100%;
  margin: 0 1.5%;
  background: url(/images/pbl/di.png) no-repeat center bottom;
  background-size: 50%;
  float: left;
}
.pbl-dashboard .bottom .ul-box ul li .li-content {
  opacity: 0;
  position: relative;
  width: 100%;
  height: 60%;
  background: url(/images/pbl/bg.png) no-repeat center;
  background-size: contain;
  overflow: hidden;
  animation: show5 1s linear forwards 8.5s;
}
.pbl-dashboard .bottom .ul-box ul li .li-content p {
  width: 100%;
  height: 20%;
  text-align: center;
  color: #fff;
  display: table;
}
.pbl-dashboard .bottom .ul-box ul li .li-content p span {
  display: table-cell;
  vertical-align: middle;
}
.pbl-dashboard .bottom .ul-box ul li .li-content p:nth-of-type(1) {
  margin-top: 10%;
}
.pbl-dashboard .bottom .ul-box ul li .li-content p:nth-of-type(2) {
  font-family: '液晶数字字体';
  font-size: 1.5rem;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box {
  position: absolute;
  width: 70%;
  height: 80%;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box1,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box2,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box3,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box4 {
  width: 23%;
  height: 50%;
  position: absolute;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box1 h5,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box2 h5,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box3 h5,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box4 h5 {
  height: 50%;
  color: #fff;
  font-size: 0.7rem;
  font-weight: normal;
  display: table;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box1 h5 span,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box2 h5 span,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box3 h5 span,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box4 h5 span {
  display: table-cell;
  vertical-align: middle;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box1 .pic,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box2 .pic,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box3 .pic,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box4 .pic {
  width: 100%;
  height: 50%;
  color: #fff;
  font-size: 0.7rem;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box1 .pic img,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box2 .pic img,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box3 .pic img,
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box4 .pic img {
  width: 1rem;
  vertical-align: bottom;
  margin-right: 5%;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box1 {
  left: 0;
  top: 0;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box2 {
  right: 0;
  top: 0;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box3 {
  left: 0;
  bottom: 0;
}
.pbl-dashboard .bottom .ul-box ul li .li-content .li-box .box4 {
  right: 0;
  bottom: 0;
}
.pbl-dashboard .bottom .ul-box ul li:nth-of-type(1) {
  transform: translateY(100%);
  animation: di2 1s linear forwards 7s;
}
.pbl-dashboard .bottom .ul-box ul li:nth-of-type(2) {
  transform: translateY(100%);
  animation: di2 1s linear forwards 7s;
}
.pbl-dashboard .bottom .ul-box ul li:nth-of-type(3) {
  transform: translateY(100%);
  animation: di2 1s linear forwards 7s;
}
@keyframes show1 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.25;
  }
}
@keyframes show2 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.5;
  }
}
@keyframes show3 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 0.75;
  }
}
@keyframes show4 {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes zoomIn {
  0% {
    opacity: 0;
    transform: scale3d(0.3, 0.3, 0.3);
  }
  100% {
    opacity: 1;
  }
}
@keyframes come1 {
  0% {
    opacity: 0;
    transform: translateX(266.67%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes come2 {
  0% {
    opacity: 0;
    transform: translateX(-266.67%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes come3 {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(250%);
  }
  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}
@keyframes come4 {
  0% {
    opacity: 0;
    transform: translateX(-50%) translateY(300%);
  }
  100% {
    opacity: 1;
    transform: translateX(-50%) translateY(0);
  }
}
@keyframes rotate1 {
  0% {
    transform: translateY(-50%) rotateY(0);
  }
  100% {
    transform: translateY(-50%) rotateY(360deg);
  }
}
@keyframes inner1 {
  0% {
    opacity: 0;
    transform: translateX(300%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes inner2 {
  0% {
    opacity: 0;
    transform: translateX(-300%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes arrow1 {
  0% {
    opacity: 0.2;
    transform: translateX(-50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes arrow2 {
  0% {
    opacity: 0.2;
    transform: translateX(50%);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}
@keyframes meter {
  0% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(0) rotate(0);
  }
  40% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.8) rotate(360deg);
  }
  80% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(0.8) rotate(540deg);
  }
  100% {
    opacity: 1;
    transform: translate(-50%, -50%) scale(1) rotate(540deg);
  }
}
@keyframes animate {
  0% {
    opacity: 0;
  }
  100% {
    opacity: .7;
  }
}
@keyframes sale {
  from {
    opacity: 0;
    transform: scale3d(0.1, 0.1, 0.1) translate3d(0, -1000px, 0);
    animation-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19);
  }
  60% {
    opacity: 1;
    transform: scale3d(0.475, 0.475, 0.475) translate3d(0, 60px, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
  100% {
    opacity: 1;
    transform: scale3d(1, 1, 1) translate3d(0, 0, 0);
    animation-timing-function: cubic-bezier(0.175, 0.885, 0.32, 1);
  }
}
@keyframes animate1-slide {
  0% {
    transform: translateX(calc(-50% - 100cqw));
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes animate1-center {
  0% {
    transform: translate(calc(-50% - 100cqw), -50%);
  }
  100% {
    transform: translate(-50%, -50%);
  }
}
@keyframes animate2-slide {
  0% {
    transform: translateX(calc(-50% + 100cqw));
  }
  100% {
    transform: translateX(-50%);
  }
}
@keyframes animate2-center {
  0% {
    transform: translate(calc(-50% + 100cqw), -50%);
  }
  100% {
    transform: translate(-50%, -50%);
  }
}
@keyframes di2 {
  0% {
    transform: translateY(100%);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes show5 {
  0% {
    opacity: 0;
    transform: translateY(100%) scale(0);
  }
  100% {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}
@keyframes move {
  0% {
    transform: translateX(50%);
  }
  100% {
    transform: translateX(-50%);
  }
}
/* Homework capture modal: ASL glass polish (Chrome 80 safe) */

.homework-capture-modal .ant-modal-content {
  border-radius: 22px;
  overflow: hidden;
  border: 1px solid rgba(255, 255, 255, 0.7);
  box-shadow: 0 20px 48px rgba(0, 0, 0, 0.16);
}

.homework-capture-modal .ant-modal-header {
  border-bottom: 1px solid rgba(0, 0, 0, 0.04);
  background: linear-gradient(180deg, var(--asl-card-surface, #fff7f1) 0%, #fff 100%);
}

.homework-capture-modal .ant-modal-title {
  color: var(--asl-ink, #5c3a2a);
  font-weight: 700;
}

.homework-capture-modal .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn {
  color: var(--asl-accent-deep, #e84f28);
  font-weight: 700;
}

.homework-capture-modal .ant-tabs-ink-bar {
  background: linear-gradient(90deg, var(--asl-pill-from, #ff7d4a), var(--asl-pill-to, #f24a1c));
}

.homework-capture-modal .ant-btn-primary {
  border: none;
  border-radius: 999px;
  font-weight: 700;
  background: linear-gradient(135deg, var(--asl-pill-from, #ff7d4a), var(--asl-pill-to, #f24a1c));
}

.homework-capture-modal .ant-select-selector,
.homework-capture-modal .ant-input,
.homework-capture-modal .ant-input-affix-wrapper {
  border-radius: 12px !important;
}

.homework-capture-upload.ant-upload {
  display: block;
  width: 100%;
}

.homework-capture-upload .ant-upload {
  display: block;
  width: 100%;
}

.homework-capture-pick-tile {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 140px;
  padding: 18px 16px;
  border-radius: 18px;
  border: 1.5px dashed rgba(0, 0, 0, 0.12);
  background: rgba(255, 255, 255, 0.82);
  box-shadow: 0 8px 18px rgba(0, 0, 0, 0.04);
  cursor: pointer;
  text-align: center;
  outline: none;
  transition: transform 0.16s ease, border-color 0.16s ease, box-shadow 0.16s ease;
}

.homework-capture-pick-tile:hover,
.homework-capture-pick-tile:focus {
  border-color: var(--asl-accent, #ff6b3d);
  box-shadow: 0 12px 24px rgba(0, 0, 0, 0.08);
}

.homework-capture-pick-tile:active {
  transform: scale(0.985);
  border-color: var(--asl-accent, #ff6b3d);
}

.homework-capture-pick-tile__icon {
  margin-bottom: 10px;
  font-size: 34px;
  color: var(--asl-accent, #ff6b3d);
}

.homework-capture-pick-tile--gallery .homework-capture-pick-tile__icon {
  color: var(--asl-accent-deep, #e84f28);
}

.homework-capture-pick-tile__title {
  display: block;
  font-size: 16px;
  color: var(--asl-ink, #5c3a2a);
}

.homework-capture-pick-tile__hint {
  display: block;
  margin-top: 4px;
  font-size: 12px;
}

.homework-capture-hint {
  margin-top: 16px;
  padding: 12px 14px;
  border-radius: 14px;
  border: 1px solid rgba(255, 255, 255, 0.7);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.92) 0%, var(--asl-card, #fff8f3) 100%);
  font-size: 13px;
  color: var(--asl-ink-soft, #8a6452);
}

.homework-capture-ref-box {
  margin-top: 8px;
  padding: 10px 12px;
  border-radius: 14px;
  border: 1px solid rgba(0, 0, 0, 0.06);
  background: rgba(255, 255, 255, 0.88);
  font-size: 12px;
  color: var(--asl-ink-soft, #8a6452);
}

.homework-capture-ref-box--accent {
  border-color: rgba(0, 0, 0, 0.04);
  background: linear-gradient(160deg, rgba(255, 255, 255, 0.95) 0%, var(--asl-card-surface, #fff7f1) 100%);
}

.homework-capture-ref-box__body {
  margin-top: 4px;
  white-space: pre-wrap;
  max-height: 80px;
  overflow: auto;
  color: var(--asl-ink, #5c3a2a);
}

.homework-capture-audio {
  display: block;
  margin-top: 6px;
  width: 100%;
  max-width: 400px;
}

.ant-modal-wrap.homework-capture-modal {
  z-index: 1210;
}

.homework-capture-modal.ant-modal {
  max-width: calc(100vw - 32px) !important;
  width: 92% !important;
  padding-bottom: 0;
  pointer-events: auto;
}

.homework-capture-modal .ant-modal-body {
  overflow-x: hidden;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

@media screen and (orientation: portrait) {
  .homework-capture-pick-tile {
    min-height: 128px;
  }

  .homework-capture-modal.ant-modal {
    top: 20px;
    max-width: calc(100vw - 20px) !important;
    width: calc(100vw - 20px) !important;
    margin: 0 auto;
  }

  .homework-capture-modal .ant-modal-body {
    max-height: calc(100vh - 110px);
    max-height: calc(100dvh - 110px);
  }
}

@media screen and (orientation: landscape) {
  .homework-capture-pick-tile {
    min-height: 110px;
    padding: 14px 12px;
  }

  .homework-capture-pick-tile__icon {
    margin-bottom: 6px;
    font-size: 28px;
  }

  .homework-capture-modal.ant-modal {
    top: 12px;
    max-width: min(720px, calc(100vw - 48px)) !important;
    width: min(720px, calc(100vw - 48px)) !important;
  }

  .homework-capture-modal .ant-modal-body {
    max-height: calc(100vh - 88px);
    max-height: calc(100dvh - 88px);
  }
}

@media screen and (orientation: landscape) and (max-height: 560px) {
  .homework-capture-pick-tile {
    min-height: 88px;
    padding: 10px 8px;
    border-radius: 14px;
  }

  .homework-capture-pick-tile__title {
    font-size: 14px;
  }

  .homework-capture-hint {
    margin-top: 10px;
    padding: 8px 10px;
  }

  .homework-capture-modal.ant-modal {
    top: 6px;
  }

  .homework-capture-modal .ant-modal-body {
    max-height: calc(100vh - 64px);
    max-height: calc(100dvh - 64px);
  }
}
.error-book-meta-scroll-x {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  padding-bottom: 2px;
}

.error-book-meta-scroll-x .ant-space {
  flex-wrap: nowrap !important;
}

.error-book-actions-scroll-x {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0f0f0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.error-book-actions-scroll-x .ant-space {
  flex-wrap: nowrap !important;
}

.error-book-list-item--mobile.ant-list-item {
  flex-direction: column;
  align-items: stretch !important;
}

.error-book-list-item--mobile .ant-list-item-meta {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.error-book-list-item--mobile .ant-list-item-meta-content {
  width: 100%;
  min-width: 0;
}

@media screen and (max-width: 767px) {
  .error-book-meta-scroll-x,
  .error-book-actions-scroll-x {
    overflow: visible;
  }

  .error-book-meta-scroll-x .ant-space,
  .error-book-actions-scroll-x .ant-space {
    flex-wrap: wrap !important;
  }

  .error-book-list-item--mobile.ant-list-item {
    padding: 0 0 12px;
    -webkit-border-after: none;
            border-block-end: none;
  }

  .error-book-list-item--mobile .ant-list-item-meta {
    padding: 12px;
    border: 1px solid #f0f0f0;
    border-left: 4px solid #ff4d4f;
    border-radius: 10px;
    background: #fff;
    box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
  }

  .error-book-list .ant-list-item-meta-title,
  .error-book-list .ant-list-item-meta-description {
    max-width: 100%;
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .error-book-actions-scroll-x {
    overflow: visible;
    margin-top: 10px;
    padding-top: 10px;
  }
}
.assignment-selector-scroll-x {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.assignment-selector-scroll-x .ant-space {
  flex-wrap: nowrap !important;
}

@media screen and (max-width: 767px) {
  .assignment-selector-scroll-x {
    overflow: visible;
  }

  .assignment-selector-scroll-x .ant-space {
    flex-wrap: wrap !important;
  }

  .assignment-selector-list .ant-list-item {
    flex-direction: column;
    align-items: stretch !important;
  }

  .assignment-selector-list .ant-list-item-meta {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .assignment-selector-list-item--mobile .ant-list-item-meta-content {
    width: 100%;
    min-width: 0;
  }
}
.student-homework-page {
  padding: 24px;
}

.student-homework-main-card {
  border-radius: 12px;
}

.student-homework-title-meta {
  margin-left: 16px;
  font-size: 14px;
  color: #666;
  font-weight: 400;
}

.student-homework-page .ant-list-item {
  padding-top: 14px;
  padding-bottom: 14px;
}

.student-homework-page .ant-list-item-action .ant-btn {
  min-height: 40px;
}

/* 窄屏：标题/描述/操作单行横向滑动，避免与 ant-list-item-action 并排挤压叠字 */
.student-homework-meta-scroll-x {
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
  padding-bottom: 2px;
}

.student-homework-meta-scroll-x .ant-space {
  flex-wrap: nowrap !important;
}

.student-homework-actions-scroll-x {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0f0f0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  max-width: 100%;
}

.student-homework-actions-scroll-x .ant-space {
  flex-wrap: nowrap !important;
}

.student-homework-list-item--mobile.ant-list-item {
  flex-direction: column;
  align-items: stretch !important;
}

.student-homework-list-item--mobile .ant-list-item-meta {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}

.student-homework-list-item--mobile .ant-list-item-meta-content {
  width: 100%;
  min-width: 0;
}

/* 手机/平板：全部作业统一卡片（与桌面 List.Meta 分离，避免挤压、竖排字、操作区样式不一致） */
.student-homework-assignment-list.ant-list-split .ant-list-item {
  -webkit-border-after: none;
          border-block-end: none;
}

.student-homework-list-item--card.ant-list-item {
  padding: 0 0 12px;
  -webkit-border-after: none;
          border-block-end: none;
}

.student-homework-card-inner {
  border: 1px solid #f0f0f0;
  border-radius: 10px;
  padding: 12px 12px 10px;
  background: #fff;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.04);
}

.student-homework-card--pending .student-homework-card-inner {
  border-left: 4px solid #1890ff;
}

.student-homework-card--graded .student-homework-card-inner {
  border-left: 4px solid #52c41a;
}

.student-homework-card--assignment .student-homework-card-inner {
  border-left: 4px solid #faad14;
}

.student-homework-card__tags {
  margin-bottom: 2px;
}

.student-homework-card__title {
  font-size: 16px;
  font-weight: 600;
  line-height: 1.45;
  margin: 6px 0 8px;
  word-break: break-word;
  overflow-wrap: anywhere;
  color: #262626;
}

.student-homework-card__time {
  font-size: 13px;
  color: #8c8c8c;
  line-height: 1.5;
  word-break: break-word;
}

.student-homework-card__badges {
  margin-top: 4px;
}

.student-homework-card__result {
  margin-top: 8px;
  padding: 8px 10px;
  background: #f6ffed;
  border: 1px solid #d9f7be;
  border-radius: 8px;
  font-size: 14px;
  line-height: 1.5;
}

.student-homework-grade-inline {
  display: inline;
  white-space: normal;
  word-break: break-word;
  overflow-wrap: anywhere;
}

.student-homework-card__result .ant-space,
.student-homework-card__result .ant-space-item {
  white-space: normal;
}

.student-homework-card__result--warn {
  background: #fff2f0;
  border-color: #ffccc7;
}

.student-homework-card__actions {
  margin-top: 10px;
  padding-top: 10px;
  border-top: 1px solid #f0f0f0;
}

.student-homework-card__actions .ant-btn {
  min-height: 36px;
  padding-inline: 10px;
}

@media screen and (max-width: 1280px) {
  .student-homework-page {
    padding: 12px;
  }
}

@media screen and (max-width: 767px) {
  .student-homework-page {
    padding: 8px 10px 16px;
  }

  .student-homework-title-meta {
    display: block;
    margin-left: 0;
    margin-top: 4px;
  }

  .student-homework-assignment-list .ant-list-item-meta-title,
  .student-homework-assignment-list .ant-list-item-meta-description {
    max-width: 100%;
  }

  /* 桌面端仍使用 actions 时，保证主列可收缩 */
  .student-homework-page .ant-list-item-meta {
    min-width: 0;
  }
}
body {
  margin: 0;
  font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', 'Roboto', 'Oxygen',
    'Ubuntu', 'Cantarell', 'Fira Sans', 'Droid Sans', 'Helvetica Neue',
    sans-serif;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
}

code {
  font-family: source-code-pro, Menlo, Monaco, Consolas, 'Courier New',
    monospace;
}

* {
  box-sizing: border-box;
}

html, body, #root {
  height: 100%;
  width: 100%;
  margin: 0;
  padding: 0;
  overflow-x: hidden; /* 防止水平滚动 */
  /* 银灰浅色：极弱纵向渐变，与 ConfigProvider 浅色 token 一致，不用位图背景 */
  background-color: #e8eaef;
  background-image: linear-gradient(180deg, #eceef3 0%, #e4e7ee 100%);
}

body[data-theme='dark'],
body[data-theme='dark'] #root {
  background-color: #141414;
  background-image: none;
}

/* 移动端适配 - 防止内容超出屏幕 */
html {
  -webkit-text-size-adjust: 100%; /* 防止 iOS Safari 自动调整字体大小 */
  -moz-text-size-adjust: 100%;
       text-size-adjust: 100%;
}

body {
  width: 100%;
  max-width: 100vw; /* 最大宽度为视口宽度 */
  overflow-x: hidden; /* 隐藏水平滚动条 */
  position: relative;
}

#root {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  position: relative;
}

/* Android WebView 触摸事件修复 */
* {
  -webkit-tap-highlight-color: transparent;
  touch-action: manipulation;
}

input, button, a, [role="button"], .ant-btn, .ant-input, .ant-form-item {
  -webkit-touch-callout: none;
  -webkit-user-select: none;
  -moz-user-select: none;
       user-select: none;
  pointer-events: auto !important;
  touch-action: manipulation;
}

/* 确保输入框可以输入 */
input[type="text"], 
input[type="password"], 
input[type="email"], 
textarea {
  -webkit-user-select: text;
  -moz-user-select: text;
       user-select: text;
  pointer-events: auto !important;
}

/* 修复移动端输入框文字竖排问题 */
textarea,
.ant-input,
.ant-input-affix-wrapper {
  -webkit-writing-mode: horizontal-tb !important;
          writing-mode: horizontal-tb !important; /* 确保文字横向排列 */
  direction: ltr !important; /* 从左到右 */
  -webkit-text-orientation: mixed !important;
          text-orientation: mixed !important;
  unicode-bidi: normal !important;
}

/* 确保输入框在移动端正常显示 */
.ant-input,
.ant-input-affix-wrapper,
textarea {
  min-width: 0 !important; /* 防止 flex 子元素溢出 */
  max-width: 100% !important;
  width: 100% !important;
  box-sizing: border-box !important;
}

/* 移动端布局修复 - 防止内容超出屏幕 */
* {
  max-width: 100%; /* 所有元素最大宽度不超过容器 */
  box-sizing: border-box; /* 确保 padding 和 border 包含在宽度内 */
}

/* 防止图片和媒体元素超出 */
img, video, iframe, embed, object {
  max-width: 100%;
  height: auto;
}

/* 防止表格超出 */
table {
  width: 100%;
  max-width: 100%;
  table-layout: fixed; /* 固定表格布局，防止列宽超出 */
  word-wrap: break-word; /* 长单词换行 */
}

/* 防止代码块和预格式化文本超出 */
pre, code {
  max-width: 100%;
  overflow-x: auto; /* 允许水平滚动，但不超出屏幕 */
  word-wrap: break-word;
  white-space: pre-wrap; /* 允许换行 */
}

/* 移动端容器样式 */
.container, .ant-layout, .ant-layout-content {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
}

/* 确保所有主要容器不超出屏幕 */
.ant-layout,
.ant-layout-header,
.ant-layout-content,
.ant-layout-footer,
.ant-layout-sider {
  max-width: 100vw;
  overflow-x: hidden;
}

/* Ant Design 组件移动端适配 */
.ant-layout {
  width: 100%;
  max-width: 100vw;
  min-height: 100vh;
}

.ant-layout-content {
  width: 100%;
  max-width: 100vw;
  overflow-x: hidden;
  padding: 0 !important; /* 移除默认 padding，防止超出 */
}

/* 防止表格和列表超出 */
.ant-table-wrapper,
.ant-table,
.ant-list {
  max-width: 100%;
  overflow-x: auto; /* 允许水平滚动，但不超出屏幕 */
}

.ant-table-body {
  overflow-x: auto;
  max-width: 100%;
}

/* 防止卡片和面板超出 */
.ant-card,
.ant-panel,
.ant-collapse {
  max-width: 100%;
  box-sizing: border-box;
}

/* 个人资料页 Collapse：确保折叠面板标题在深色背景下可见（不透明背景 + 深色文字） */
.profile-page-collapse.ant-collapse {
  background: #fff !important;
}
.profile-page-collapse .ant-collapse-item {
  border-color: #f0f0f0;
}
.profile-page-collapse .ant-collapse-header {
  background: #fafafa !important;
  color: rgba(0, 0, 0, 0.85) !important;
}
.profile-page-collapse .ant-collapse-header .ant-collapse-header-text,
.profile-page-collapse .ant-collapse-header span {
  color: rgba(0, 0, 0, 0.85) !important;
}
.profile-page-collapse .ant-collapse-content {
  background: #fff !important;
}
.profile-page-collapse .ant-collapse-content-box {
  background: #fff !important;
}

/* 防止表单元素超出 */
.ant-form,
.ant-form-item {
  max-width: 100%;
  box-sizing: border-box;
}

.ant-input,
.ant-select,
.ant-input-number {
  max-width: 100%;
  box-sizing: border-box;
}

/* 防止模态框和抽屉超出 */
.ant-modal,
.ant-drawer {
  max-width: 100vw;
}

.ant-modal-content,
.ant-drawer-content {
  max-width: 100%;
  overflow-x: hidden;
}

/* 系统设置页 Tabs：Tab 栏使用浅色背景 + 深色文字，避免与页面顶部深色区混在一起导致不可读 */
.settings-page-tabs.ant-tabs .ant-tabs-nav {
  background: #fafafa;
  padding: 8px 12px 0;
  margin-bottom: 0;
  border-radius: 8px 8px 0 0;
}
.settings-page-tabs.ant-tabs .ant-tabs-tab {
  color: rgba(0, 0, 0, 0.85);
}
.settings-page-tabs.ant-tabs .ant-tabs-tab .ant-tabs-tab-btn,
.settings-page-tabs.ant-tabs .ant-tabs-tab span {
  color: inherit;
}
.settings-page-tabs.ant-tabs .ant-tabs-tab.ant-tabs-tab-active .ant-tabs-tab-btn,
.settings-page-tabs.ant-tabs .ant-tabs-tab.ant-tabs-tab-active span {
  color: #1890ff;
}
.settings-page-tabs.ant-tabs .ant-tabs-ink-bar {
  background: #1890ff;
}

/* 响应式设计 - 移动端优化 */
@media screen and (max-width: 768px) {
  /* 移动端特定样式 */
  body {
    font-size: 14px; /* 移动端字体稍小 */
  }
  
  /* 确保所有容器在移动端不超出 */
  * {
    max-width: 100vw;
  }
  
  /* 防止固定宽度元素超出 */
  [style*="width"] {
    max-width: 100vw !important;
  }
  
  /* 覆盖固定宽度容器 */
  [style*="maxWidth: '1200px'"],
  [style*="maxWidth: 1200"],
  [style*="max-width: 1200px"],
  [style*="max-width: 1200"] {
    max-width: 100% !important;
    width: 100% !important;
  }
  
  /* 减少移动端 padding */
  .ant-layout-content {
    padding: 12px !important;
  }
  
  /* 移动端字体调整 */
  h1, h2, h3, h4, h5, h6 {
    font-size: 1.2em;
  }

  /* 移动端列表统一兜底：内容与操作分行，避免 actions 把标题/描述挤成竖排 */
  .ant-list .ant-list-item {
    flex-wrap: wrap;
    align-items: flex-start;
    row-gap: 8px;
  }

  .ant-list .ant-list-item-meta {
    flex: 1 1 100%;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .ant-list .ant-list-item-meta-content {
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }

  .ant-list .ant-list-item-meta-title,
  .ant-list .ant-list-item-meta-description {
    white-space: normal;
    word-break: break-word;
    overflow-wrap: anywhere;
  }

  .ant-list .ant-list-item-action {
    width: 100%;
    -webkit-margin-start: 0 !important;
            margin-inline-start: 0 !important;
    display: flex;
    flex-wrap: wrap;
    justify-content: flex-start;
    gap: 6px 8px;
  }

  .ant-list .ant-list-item-action > li {
    padding-inline: 0 !important;
  }

  .ant-list .ant-list-item-action .ant-btn {
    min-height: 36px;
  }

  /* 移动端表格统一兜底：保留列宽并横向滑动，避免固定布局压缩文字 */
  .ant-table-wrapper {
    width: 100%;
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .ant-table-container,
  .ant-table-content,
  .ant-table-body {
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch;
  }

  .ant-table-container table,
  .ant-table-content table {
    width: -webkit-max-content !important;
    width: -moz-max-content !important;
    width: max-content !important;
    min-width: 100% !important;
    max-width: none !important;
    table-layout: auto !important;
  }
}

/* -----------------------------
   学生侧统一视觉基线（浏览器 + WebView）
   ----------------------------- */
:root {
  --student-font-base: 16px;
  --student-radius-sm: 8px;
  --student-radius-md: 12px;
  --student-radius-lg: 16px;
  --student-space-1: 8px;
  --student-space-2: 12px;
  --student-space-3: 16px;
  --student-space-4: 20px;
  --student-shadow-card: 0 4px 14px rgba(0, 0, 0, 0.08);
  --student-touch-min: 44px;
}

.student-ui {
  font-size: var(--student-font-base);
}

.student-ui .ant-card {
  border-radius: var(--student-radius-md);
  box-shadow: var(--student-shadow-card);
}

.student-ui .ant-btn {
  min-height: var(--student-touch-min);
  border-radius: 10px;
}

.student-ui .ant-input,
.student-ui .ant-input-affix-wrapper,
.student-ui .ant-select-selector,
.student-ui .ant-picker {
  min-height: var(--student-touch-min);
  border-radius: 10px !important;
}

.student-ui .ant-tabs-tab {
  min-height: var(--student-touch-min);
}

.student-ui .ant-list-item {
  padding-top: var(--student-space-2);
  padding-bottom: var(--student-space-2);
}

/* 平板主断点：默认优化学生端信息密度与可点击面积 */
@media screen and (min-width: 768px) and (max-width: 1280px) {
  .student-ui {
    font-size: 16px;
  }

  .student-ui .student-page-content {
    padding: 16px !important;
  }

  .student-ui .student-card-compact .ant-card-body {
    padding: 14px;
  }

  .student-ui .student-two-col {
    gap: 12px;
  }
}/**
 * 2026-08-31 标题气势（左上角品牌 + 右侧页/卡片名）
 *
 * 回退：
 * 1. 删除 main.tsx 中对 product-ui-title-generous.css 的 import
 * 2. TeacherAppShell / StudentAppShell 把 <ShellBrandMark /> 还原为原来的单行 Text
 * 3. 可选：删除 ShellBrandMark.tsx，以及 organizationTitle.ts 中的 splitSystemTitle
 *
 * 详见 docs/PRODUCT_UI_实施记录.md 「2026-08-31 — 侧栏与卡片标题加气势」
 */

/* —— 左上角品牌：教师工作台 + 产品名 —— */
.teacher-app-shell__brand {
  height: auto;
  min-height: 96px;
  padding: 16px 18px;
  align-items: center;
  justify-content: center;
  text-align: center;
}

.teacher-app-shell__brand-stack {
  position: relative;
  z-index: 1;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 4px;
  min-width: 0;
  max-width: 100%;
}

.teacher-app-shell__brand-stack::after {
  content: '';
  width: 40px;
  height: 2px;
  margin-top: 6px;
  border-radius: 2px;
  background: linear-gradient(90deg, transparent, #e8d5a3 30%, #e8d5a3 70%, transparent);
}

.teacher-app-shell__brand-org {
  color: #fff;
  font-size: 22px;
  font-weight: 720;
  letter-spacing: 0.1em;
  line-height: 1.3;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.teacher-app-shell__brand-product {
  color: rgba(255, 255, 255, 0.88);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.12em;
  line-height: 1.35;
  white-space: nowrap;
}

.teacher-app-shell__brand-mark {
  position: relative;
  z-index: 1;
  color: #fff;
  font-size: 22px;
  font-weight: 720;
  letter-spacing: 0.1em;
}

.teacher-app-shell.ant-layout-has-sider > .ant-layout-sider-collapsed .teacher-app-shell__brand {
  min-height: 96px;
  align-items: center;
  justify-content: center;
  padding: 12px 8px;
}

/* —— 顶栏：校名 + 产品名居中，海军蓝 / 金点 / 沉静蓝 —— */
.teacher-app-shell__header {
  position: relative !important;
}

.teacher-app-shell__header-left,
.teacher-app-shell__header-right {
  position: relative;
  z-index: 1;
  flex: 0 0 auto;
}

.teacher-app-shell__header-right {
  margin-left: auto;
}

.teacher-app-shell__header-school {
  position: absolute;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 10px;
  max-width: min(72vw, 840px);
  overflow: hidden;
  white-space: nowrap;
  text-align: center;
  pointer-events: none;
}

.teacher-app-shell__header-school-name {
  color: var(--product-deep, #1e3a5f);
  font-weight: 720;
  font-size: 26px;
  letter-spacing: 0.16em;
  line-height: 1.2;
}

.teacher-app-shell__header-school-sep {
  color: #c4a35a;
  font-size: 20px;
  font-weight: 500;
  line-height: 1;
  opacity: 0.92;
  transform: translateY(-1px);
}

.teacher-app-shell__header-school-product {
  color: #3d6ea8;
  font-weight: 560;
  font-size: 18px;
  letter-spacing: 0.2em;
  line-height: 1.2;
}

.teacher-app-shell__header-subtitle {
  color: var(--product-deep, #1e3a5f) !important;
  font-weight: 720 !important;
  font-size: 22px !important;
  letter-spacing: 0.1em;
}

/* —— 右侧页面主标题（视觉盒子等）—— */
.teacher-app-shell__content h1.ant-typography,
.teacher-app-shell__content h2.ant-typography,
.teacher-app-shell__content h3.ant-typography {
  color: var(--product-deep, #1e3a5f) !important;
  font-weight: 720 !important;
  letter-spacing: 0.08em !important;
  line-height: 1.35 !important;
}

.teacher-app-shell__content h1.ant-typography {
  font-size: 36px !important;
}

.teacher-app-shell__content h2.ant-typography {
  font-size: 32px !important;
}

.teacher-app-shell__content h3.ant-typography {
  font-size: 30px !important;
}

/* —— 右侧卡片名称 —— */
.teacher-app-shell__content .ant-card-head {
  min-height: 58px;
}

.teacher-app-shell__content .ant-card-head-title {
  font-size: 20px !important;
  font-weight: 720 !important;
  letter-spacing: 0.08em;
  color: var(--product-deep, #1e3a5f);
}

.teacher-app-shell__content .ant-card-small > .ant-card-head {
  min-height: 54px;
}

.teacher-app-shell__content .ant-card-small > .ant-card-head .ant-card-head-title {
  font-size: 18px !important;
  letter-spacing: 0.08em;
}

/* 学生 PC 壳复用同一套侧栏品牌，一并加气势 */
.student-app-shell--pc.teacher-app-shell .teacher-app-shell__brand {
  min-height: 96px;
}
/**
 * 原生键盘 → 仅抬升底部聊天输入（opt-in）
 * 高度由 App 层写入 --native-keyboard-inset
 * 配合 KeyboardResize.None，勿再依赖 Body 整体 resize
 */

:root {
  --native-keyboard-inset: 0px;
  /* 兼容旧课堂样式变量名 */
  --cs-keyboard-inset: var(--native-keyboard-inset);
  --cta-keyboard-inset: var(--native-keyboard-inset);
}

body.native-keyboard-open .native-keyboard-compose {
  padding-bottom: calc(12px + var(--native-keyboard-inset, 0px)) !important;
  -webkit-backdrop-filter: none !important;
  backdrop-filter: none !important;
  box-shadow: none !important;
  background: #fff;
}