:root{--navy:#062b66;--blue:#0964bf;--teal:#08bda7;--ink:#102546;--muted:#63738b;--line:#d9e8f3;--pale:#f3f9fd;--danger:#db4c5c;--shadow:0 12px 32px rgba(6,43,102,.11)}*{box-sizing:border-box}body{margin:0;background:#f3f8fc;color:var(--ink);font-family:'Noto Sans SC','Microsoft YaHei',sans-serif}button,input,select{font:inherit}button{cursor:pointer;border:0}.hero{height:260px;background-image:linear-gradient(100deg,rgba(3,29,79,.90),rgba(5,79,139,.74),rgba(0,164,167,.48)),var(--bg);background-size:cover;background-position:center;color:#fff}.navbar{height:82px;background:rgba(2,31,79,.68);border-bottom:1px solid rgba(255,255,255,.16);display:flex;align-items:center;padding:0 max(30px,calc((100vw - 1320px)/2));gap:38px}.brand{display:flex;align-items:center;gap:12px;font-size:22px;font-weight:800;letter-spacing:.4px;white-space:nowrap}.emblem{width:48px;height:48px;border-radius:50%;object-fit:cover;background:transparent;border:0}.navlinks{margin-left:auto;display:flex;gap:8px;height:100%;align-items:center}.navlinks button{height:100%;padding:0 19px;background:transparent;color:#e7f4ff;font-weight:700;font-size:16px;position:relative}.navlinks button.active:after{content:"";height:3px;border-radius:4px;background:#44e0ca;position:absolute;left:18px;right:18px;bottom:0}.hero-inner{max-width:1320px;margin:auto;padding:44px 30px;display:flex;justify-content:space-between;align-items:center}.hero h1{font-size:36px;margin:0 0 8px;letter-spacing:1px}.hero p{margin:0;color:#d5edff}.page{max-width:1320px;margin:-34px auto 48px;padding:0 30px;position:relative}.card{background:#fff;border:1px solid var(--line);border-radius:18px;box-shadow:var(--shadow)}.panel{padding:26px}.toolbar{padding:19px 22px;display:flex;gap:12px;align-items:center;flex-wrap:wrap}.spacer{flex:1}.primary,.outline,.danger,.amount{min-height:42px;padding:0 17px;border-radius:10px;font-weight:700;transition:.2s}.primary{color:#fff;background:linear-gradient(100deg,#0878d4,#05bca5);box-shadow:0 6px 12px rgba(0,150,182,.18)}.primary:hover{filter:brightness(1.06);transform:translateY(-1px)}.outline{background:#fff;color:#0965b9;border:1px solid #90c6e8}.danger{background:#fff1f3;color:var(--danger);border:1px solid #f3bac3}.search{min-width:280px;padding:0 15px;height:43px;border:1px solid #c9deed;border-radius:11px;outline:0}.search:focus,input:focus,select:focus{border-color:#09aeb4;box-shadow:0 0 0 3px rgba(0,188,166,.12);outline:0}.student-grid{padding:22px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px}.student{padding:23px 20px 19px;text-align:left;background:white;border:1px solid #dbe9f3;border-radius:16px;transition:.2s;min-height:183px;display:flex;flex-direction:column;gap:13px}.student:hover{transform:translateY(-4px);box-shadow:0 14px 25px rgba(5,66,128,.14);border-color:#71c6df}.student-top{display:flex;align-items:center;gap:14px}.avatar{width:57px;height:57px;border-radius:50%;object-fit:cover;background:linear-gradient(140deg,#cce9fb,#e5f8f5);border:2px solid #edf7fd}.student-name{font-size:19px;font-weight:800}.student-id{color:var(--muted);font-size:13px;margin-top:2px}.student-foot{border-top:1px solid #e8f0f5;padding-top:13px;margin-top:auto;color:#0d8f93;font-size:13px;font-weight:600;display:flex;justify-content:space-between}.empty{grid-column:1/-1;min-height:270px;display:grid;place-content:center;text-align:center;color:var(--muted)}.empty strong{display:block;color:var(--ink);font-size:22px;margin-bottom:8px}.modal-shade{position:fixed;z-index:10;inset:0;background:rgba(1,26,60,.52);display:grid;place-items:center;padding:20px}.modal{max-width:530px;width:100%;background:#fff;border-radius:20px;box-shadow:0 22px 60px rgba(0,20,60,.28);overflow:hidden}.modal header{padding:21px 24px;border-bottom:1px solid var(--line);display:flex;justify-content:space-between;align-items:center}.modal h2{margin:0;font-size:21px}.icon-btn{background:transparent;font-size:26px;color:#61728b}.modal .content{padding:24px}.form-label{font-weight:700;font-size:14px;display:block;margin:0 0 8px}.field{width:100%;height:43px;border:1px solid #c8dce9;border-radius:10px;padding:0 12px;margin-bottom:19px}.file-zone{border:1px dashed #78bedb;border-radius:12px;background:#f3fbff;padding:13px;text-align:center;color:#3579a1;font-size:14px}.preview{width:82px;height:82px;border-radius:50%;object-fit:cover;display:block;margin:11px auto 0}.modal-footer{display:flex;justify-content:flex-end;gap:10px;padding:18px 24px;background:#f7fbfe}.coin-layout{display:grid;grid-template-columns:310px 1fr;gap:21px}.profile{padding:30px;text-align:center}.profile .avatar{width:110px;height:110px;margin:auto}.profile h2{margin:17px 0 5px}.profile p{color:var(--muted);margin:4px}.balance{margin:24px -6px 0;padding:18px;border-radius:13px;background:linear-gradient(135deg,#eefaff,#e5f8f4);color:#087a83}.balance b{font-size:31px;display:block;margin-top:4px}.coin-panel{padding:30px}.coin-panel h2{margin:0 0 20px}.amounts{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}.amount{background:#fff;border:1px solid #84b8d8;color:#103868;font-size:17px}.amount.selected{background:linear-gradient(100deg,#087bd1,#08baa7);color:#fff;border-color:transparent}.custom{display:none;margin-top:16px}.custom.show{display:block}.confirm{width:100%;margin-top:20px;height:52px;font-size:17px}.section-title{font-size:21px;font-weight:800;margin:30px 0 12px}.table-wrap{overflow:auto}.data-table{border-collapse:collapse;width:100%;min-width:690px}.data-table th{background:#0c3972;color:#fff;text-align:left;padding:14px 17px;font-size:14px}.data-table td{padding:14px 17px;border-bottom:1px solid #e1edf5;font-size:14px}.data-table tr:nth-child(even) td{background:#f5fbfe}.plus{color:#079b8d;font-weight:800}.filter-grid{display:grid;grid-template-columns:1.2fr 1fr 1fr auto auto;gap:12px;align-items:end}.filter-grid select,.filter-grid input{height:42px;width:100%;border:1px solid #c9dce9;border-radius:10px;padding:0 10px;background:#fff}.filter-grid label{font-size:13px;font-weight:700;display:block;margin-bottom:7px;color:#536881}.stats{display:grid;grid-template-columns:repeat(2,1fr);gap:18px;margin:21px 0}.stat{padding:21px 25px;background:linear-gradient(130deg,#fff,#eafbfa);border-left:5px solid #09b6ab}.stat small{color:var(--muted);font-weight:700}.stat b{font-size:31px;display:block;margin-top:7px;color:#075284}.settings{display:grid;grid-template-columns:1fr;gap:19px}.setting-card{padding:27px}.setting-card h2{margin:0 0 6px;font-size:21px}.setting-card>p{margin:0 0 20px;color:var(--muted);font-size:14px}.background-preview{height:170px;border-radius:13px;background-image:linear-gradient(100deg,rgba(4,37,93,.55),rgba(0,157,155,.28)),var(--bg);background-size:cover;background-position:center;display:grid;place-items:center;color:#fff;font-size:19px;font-weight:800;margin-bottom:16px}.setting-actions{display:flex;gap:10px;flex-wrap:wrap}.backup-note{background:#eff9ff;color:#3e6684;border-radius:10px;padding:13px;margin:16px 0;font-size:14px}.danger-zone{border-color:#f0c6cd}.toast{position:fixed;z-index:20;right:25px;top:22px;background:#077e75;color:#fff;padding:13px 19px;border-radius:10px;box-shadow:0 9px 22px rgba(0,80,75,.22);transform:translateY(-90px);opacity:0;transition:.28s;font-weight:700}.toast.show{transform:translateY(0);opacity:1}.hidden{display:none!important}.back{color:#fff;background:rgba(255,255,255,.13);border:1px solid rgba(255,255,255,.45);border-radius:9px;padding:9px 15px;font-weight:700}.student-detail-hero .hero-inner{padding-top:25px;align-items:flex-start}@media(max-width:900px){.student-grid{grid-template-columns:repeat(2,1fr)}.coin-layout{grid-template-columns:1fr}.filter-grid{grid-template-columns:1fr 1fr}.navbar{padding:0 20px}.brand{font-size:18px}.hero-inner,.page{padding-left:20px;padding-right:20px}}@media(max-width:570px){.navbar{height:68px;gap:8px}.emblem{width:38px;height:38px}.navlinks{gap:0}.navlinks button{font-size:13px;padding:0 8px}.hero h1{font-size:27px}.student-grid{grid-template-columns:1fr;padding:14px}.toolbar .search{min-width:100%;order:4}.amounts{grid-template-columns:repeat(2,1fr)}.filter-grid{grid-template-columns:1fr}.stats{grid-template-columns:1fr}.page{margin-top:-23px}}

/* Reference-inspired home composition: deep blue campus scene with a teal right edge. */
html,body{max-width:100%;overflow-x:hidden}
.hero{height:404px;position:relative;isolation:isolate;background-image:linear-gradient(90deg,rgba(0,52,137,.93) 0%,rgba(0,62,151,.87) 43%,rgba(0,144,170,.67) 72%,rgba(0,193,178,.52) 100%),var(--bg);background-position:center;background-size:cover}
.hero:after{content:"";position:absolute;z-index:-1;inset:0;background:linear-gradient(120deg,transparent 0 57%,rgba(0,197,183,.24) 57% 100%);pointer-events:none}
.navbar{height:102px;padding:0 clamp(28px,7vw,118px);background:linear-gradient(90deg,rgba(0,47,125,.94),rgba(0,61,145,.82) 55%,rgba(0,166,169,.58));border-bottom-color:rgba(130,228,235,.25)}
.brand{font-size:25px;gap:15px;flex-shrink:0;text-shadow:0 2px 8px rgba(0,0,0,.24)}
.emblem{width:62px;height:62px;border-width:2px}
.navlinks{gap:18px}
.navlinks button{font-size:19px;padding:0 16px;text-shadow:0 2px 8px rgba(0,0,0,.23)}
.navlinks button.active:after{height:4px;left:16px;right:16px;background:#30ead1;box-shadow:0 0 10px rgba(48,234,209,.7)}
.hero-inner{max-width:1640px;padding:58px clamp(28px,7vw,118px)}
.hero h1{font-size:44px;text-shadow:0 4px 12px rgba(0,0,0,.32)}
.hero p{font-size:16px;letter-spacing:.5px}
.page{max-width:1640px;margin:-7px auto 48px;padding:0 clamp(28px,7vw,118px)}
.toolbar{position:relative;z-index:2;min-height:91px;margin-top:-72px;padding:20px 28px;background:rgba(255,255,255,.98);border-color:rgba(205,229,240,.94);box-shadow:0 16px 34px rgba(3,39,92,.18)}
.toolbar .primary{min-width:142px;height:48px;font-size:16px}
.toolbar .outline{height:48px}
.search{height:52px;min-width:355px;border-radius:28px;border:0;box-shadow:inset 0 0 0 1px #c5dced,0 5px 15px rgba(3,45,102,.07);padding:0 22px}
.student-grid{margin-top:18px;padding:38px 42px 48px;border-radius:20px;grid-template-columns:repeat(3,minmax(0,1fr));gap:28px;box-shadow:0 18px 42px rgba(3,39,92,.12)}
.student{min-height:205px;border-radius:17px;padding:27px 24px 20px;border-color:#d3e3ed;box-shadow:0 7px 18px rgba(9,47,101,.06)}
.student-name{font-size:22px}.student-id{font-size:14px}.student-foot{font-size:14px}
@media(max-width:1100px){.navbar{padding:0 30px}.brand{font-size:20px}.navlinks{gap:3px}.navlinks button{font-size:16px;padding:0 10px}.page{padding:0 30px}.student-grid{padding:24px;gap:18px}.search{min-width:280px}}
@media(max-width:780px){.hero{height:348px}.navbar{height:78px;padding:0 18px}.brand span{display:none}.emblem{width:48px;height:48px}.navlinks button{font-size:14px;padding:0 7px}.hero-inner{padding:42px 22px}.hero h1{font-size:31px}.page{padding:0 18px}.toolbar{margin-top:-48px;padding:15px}.toolbar .search{order:4;min-width:100%;width:100%}.student-grid{grid-template-columns:1fr;padding:16px}.student{min-height:165px}}

/* Home: reference composition — only the homepage uses this layout. */
body{background:#e7f1f8}
.home-hero{height:392px;background-image:linear-gradient(90deg,rgba(0,42,111,.77) 0%,rgba(0,64,143,.60) 48%,rgba(0,154,165,.34) 100%),var(--bg);background-size:cover;background-position:center}
.home-hero:after{background:linear-gradient(120deg,transparent 0 57%,rgba(0,197,183,.08) 57% 100%)}
.home-hero .navbar{height:74px;padding:0 clamp(30px,5vw,88px);background:linear-gradient(90deg,rgba(0,38,106,.93),rgba(0,76,156,.82) 56%,rgba(0,178,173,.64));border-bottom:1px solid rgba(202,246,247,.24)}
.home-hero .brand{font-size:24px;gap:13px;text-shadow:0 2px 7px rgba(0,0,0,.22)}
.home-hero .emblem{height:53px;width:53px;object-fit:contain;border-radius:0}
.home-hero .navlinks{gap:18px}
.home-hero .navlinks button{font-size:17px;padding:0 15px}
.home-hero .navlinks button.active:after{height:3px;background:#26e1ca;left:15px;right:15px;box-shadow:none}
.home-hero .hero-inner{max-width:1540px;min-height:318px;padding:0 clamp(42px,7.8vw,138px);display:flex;align-items:center;gap:68px}
.home-hero .hero-copy{flex:1;min-width:360px}
.home-hero h1{margin:0 0 12px;color:#fff;font-size:45px;line-height:1.12;letter-spacing:1px;text-shadow:0 3px 10px rgba(0,0,0,.25)}
.home-hero p{font-size:16px;color:#e7f5ff;letter-spacing:.3px}
.hero-create{margin-top:29px;min-height:48px;padding:0 23px;background:rgba(4,53,125,.48);border:1px solid rgba(255,255,255,.92);border-radius:11px;color:#fff;font-weight:800;font-size:16px;box-shadow:none}
.hero-create:hover{background:rgba(0,164,169,.54)}
.hero-search{width:min(440px,36vw);height:64px;background:#fff;border-radius:34px;display:flex;align-items:center;gap:13px;padding:0 23px;box-shadow:0 8px 22px rgba(0,29,88,.15)}
.hero-search span{font-size:34px;line-height:1;transform:rotate(-18deg);color:#092e67;font-family:Arial,sans-serif}
.hero-search input{width:100%;border:0;outline:0;color:#173b67;font-size:16px;background:transparent}
.hero-search input::placeholder{color:#8395aa}
.home-page{max-width:1540px;margin:-35px auto 55px;padding:0 clamp(30px,5vw,88px);position:relative;z-index:1}
.home-page .home-toolbar{min-height:82px;margin:0;padding:17px 28px;border:0;border-bottom:1px solid #e7eff5;border-radius:24px 24px 0 0;box-shadow:0 10px 28px rgba(1,42,96,.13)}
.home-toolbar .outline{height:45px;padding:0 20px;border-color:#a9cfe9;background:#fff;color:#1067ad}
.home-toolbar strong{font-size:17px;color:#113665;letter-spacing:.3px}
.home-page .student-grid{min-height:0;margin:0;padding:34px 30px 42px;border:0;border-radius:0 0 24px 24px;box-shadow:0 15px 30px rgba(2,42,90,.10);display:grid;grid-template-columns:repeat(5,minmax(0,1fr));grid-auto-rows:218px;align-content:start;align-items:start;gap:16px;background:#fff}
.home-page .student{height:218px;min-height:0;padding:24px 28px 18px;border:1px solid #c8e0ee;border-radius:17px;box-shadow:0 7px 19px rgba(6,49,104,.065);gap:11px}
.home-page .student:hover{transform:translateY(-2px);box-shadow:0 9px 18px rgba(7,51,105,.12);border-color:#a8d9dc}
.home-page .student-top{gap:15px;align-items:center;min-height:74px;display:flex;flex-direction:row}
.home-page .student-photo{width:72px;height:72px;display:grid;place-items:center;flex:0 0 72px;overflow:hidden;background:#edf7ff;border:0;border-radius:50%}
.home-page .student-photo .avatar{display:block;width:72px;height:72px;max-width:none;max-height:none;object-fit:cover;object-position:center top;border:0;border-radius:50%;background:#edf7ff;box-shadow:none}
/* 学生照片统一使用透明人物展示图，不再作为蓝底圆形头像裁切。 */
.home-page .student-photo{width:78px;height:82px;flex-basis:78px;overflow:visible;background:transparent;border-radius:0}
.home-page .student-photo .avatar,.modal .preview,.profile .avatar,.student .avatar{width:100%;height:100%;max-width:100%;max-height:100%;object-fit:contain;object-position:center bottom;background:transparent;border:0;border-radius:0;box-shadow:none}
.modal .preview{width:152px;height:170px;margin:14px auto 0}
.profile .avatar{width:136px;height:154px;margin:0 auto}
.file-zone{min-height:92px;display:block}
.home-page .student-info{min-width:0;flex:1;text-align:left}
.home-page .student-name{font-size:21px;color:#111;line-height:1.2}
.home-page .student-id{font-size:14px;color:#526f91;margin-top:7px;line-height:1.45;word-break:break-all}
.home-page .student-foot{min-height:34px;padding-top:13px;margin-top:auto;color:#0096a5;border-top:1px solid #dfeaf0;font-size:13px;font-weight:800}
.home-page .student-foot span:first-child{color:#51728f;font-weight:600}
.home-page .empty{min-height:360px;background:linear-gradient(180deg,#fff,#fbfdff)}
@media(min-width:900px){
  #app{position:relative;min-height:100vh;background:linear-gradient(90deg,#073e86 0 76px,#e7f1f8 76px 100%)}
  .home-hero{position:relative;z-index:1;margin-left:32px}
  /* 数据编辑、设置等页面与首页共用左侧连续深蓝色栏，避免白色内容区旁出现浅色空带。 */
  .hero:not(.home-hero){position:relative;z-index:1;margin-left:32px}
  .page:not(.home-page){position:relative;z-index:1}
}
@media(max-width:1250px){.home-page .student-grid{grid-template-columns:repeat(4,minmax(0,1fr));padding:30px;gap:18px}.home-hero .hero-inner{padding-left:58px;padding-right:58px;gap:36px}.hero-search{width:min(390px,39vw)}}
@media(max-width:1050px){.home-page .student-grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}}
@media(max-width:900px){.home-hero{height:365px}.home-hero .navbar{padding:0 24px}.home-hero .brand{font-size:20px}.home-hero .navlinks{gap:3px}.home-hero .navlinks button{font-size:15px;padding:0 9px}.home-hero .hero-inner{padding:0 34px;gap:24px}.home-hero h1{font-size:35px}.home-page{padding:0 24px}.home-page .student-grid{grid-template-columns:repeat(2,minmax(0,1fr));grid-auto-rows:210px;padding:24px}.home-page .student{height:210px;min-height:0}}
@media(max-width:650px){.home-hero{height:430px}.home-hero .navbar{height:68px;padding:0 18px}.home-hero .brand span{display:none}.home-hero .emblem{width:43px;height:43px}.home-hero .navlinks button{font-size:13px;padding:0 7px}.home-hero .hero-inner{min-height:362px;padding:30px 22px;display:block}.home-hero .hero-copy{min-width:0}.home-hero h1{font-size:31px}.hero-create{margin-top:22px}.hero-search{width:100%;height:57px;margin-top:29px}.home-page{padding:0 14px;margin-top:-23px}.home-page .home-toolbar{min-height:70px;padding:13px 17px;border-radius:19px 19px 0 0}.home-page .student-grid{grid-template-columns:1fr;min-height:450px;padding:18px;border-radius:0 0 19px 19px}.home-page .student{min-height:185px;padding:23px 21px}.home-page .student-photo,.home-page .student-photo .avatar{width:76px;height:76px;flex-basis:76px}}

/* Tablet and phone: keep the blue left rail behind the content edge.
   The home card intentionally overlaps the rail, matching the desktop layout
   instead of leaving a wide empty pale-blue gutter on the left. */
@media(max-width:899px){
  #app{position:relative;min-height:100vh;background:linear-gradient(90deg,#073e86 0 73px,#e7f1f8 73px 100%)}
  .home-hero{position:relative;z-index:1;margin-left:29px;width:calc(100% - 29px)}
  .home-page{max-width:none;width:calc(100% - 62px);margin:-23px 0 48px 62px;padding:0;position:relative;z-index:1}
}

/* 透明人物图不得被容器、滤镜或混合模式再次降低不透明度。 */
.home-page .student-photo,.home-page .student-photo .avatar,.modal .preview,.profile .avatar,.student .avatar{
  opacity:1!important;
  filter:none!important;
  mix-blend-mode:normal!important;
  image-rendering:auto;
}

/* 编辑学生：上传入口与人物预览分开，高清原图不会撑破移动端弹窗。 */
.modal-shade{display:flex;justify-content:center;align-items:center;overflow-y:auto}
.modal{max-height:calc(100dvh - 32px);display:flex;flex-direction:column}
.modal .content{min-height:0;overflow-y:auto;flex:1 1 auto}
.modal .file-zone{min-height:0;padding:13px 16px;cursor:pointer}
.file-zone-title,.file-zone-note{display:block}
.file-zone-title{font-weight:800;color:#176c9e}
.file-zone-note{margin-top:5px;color:#68839b;font-size:12px;line-height:1.45}
.photo-preview-box{margin-top:12px;padding:11px 14px;border:1px solid #cde5f4;border-radius:13px;background:#f9fcff;text-align:center}
.photo-preview-label{display:block;margin-bottom:7px;color:#58728a;font-size:12px;font-weight:700}
.modal .photo-preview-box .preview{display:block;width:132px!important;height:150px!important;max-width:132px!important;max-height:150px!important;margin:0 auto!important;object-fit:contain!important;object-position:center bottom!important;background:transparent!important;border:0!important;border-radius:0!important;box-shadow:none!important}
@media(max-width:570px){
  .modal-shade{padding:12px}
  .modal{max-height:calc(100dvh - 24px);border-radius:16px}
  .modal header{padding:16px 18px}
  .modal .content{padding:17px}
  .modal-footer{padding:14px 18px;flex-wrap:wrap}
  .modal-footer button{flex:1}
  .modal .photo-preview-box .preview{width:112px!important;height:126px!important;max-width:112px!important;max-height:126px!important}
}

/* 编辑学生选择器：使用紧凑的横向学生档案行，不复用首页的大尺寸卡片。 */
.edit-student-list{display:grid;gap:8px}
.edit-student-row{width:100%;min-height:104px;padding:17px 24px;display:flex;align-items:center;gap:16px;text-align:left;background:#fff;border:1px solid #dce7ee;border-radius:16px;box-shadow:0 3px 10px rgba(25,74,105,.06);transition:border-color .16s ease,box-shadow .16s ease,transform .16s ease}
.edit-student-row:hover,.edit-student-row:focus-visible{outline:0;border-color:#2db8b2;box-shadow:0 8px 18px rgba(14,117,132,.12);transform:translateY(-1px)}
.edit-student-photo{width:58px;height:58px;flex:0 0 58px;display:grid;place-items:center;overflow:hidden;border-radius:50%;background:#e8f7fc}
.edit-student-photo .edit-avatar{display:block;width:58px!important;height:58px!important;max-width:58px!important;max-height:58px!important;object-fit:contain!important;object-position:center bottom!important;opacity:1!important;filter:none!important;mix-blend-mode:normal!important;background:#d8effb;border:0!important;border-radius:50%!important;box-shadow:none!important}
.edit-student-info{min-width:0}
.edit-student-name{color:#111;font-size:21px;font-weight:800;line-height:1.2}
.edit-student-id{margin-top:7px;color:#62748a;font-size:14px;line-height:1.2}
@media(max-width:570px){.edit-student-row{min-height:88px;padding:14px 17px;gap:13px}.edit-student-photo,.edit-student-photo .edit-avatar{width:52px!important;height:52px!important;max-width:52px!important;max-height:52px!important;flex-basis:52px}.edit-student-name{font-size:18px}}

/* Desktop student list: always keep five students in each row.
   This final override intentionally comes after the legacy responsive rules,
   so Windows display scaling and narrower desktop viewports no longer fall
   back to the old three-column layout. */
@media(min-width:900px){
  .home-page{
    width:100%;
    max-width:1680px;
    padding-left:clamp(18px,2.2vw,38px);
    padding-right:clamp(18px,2.2vw,38px);
  }
  .home-page .student-grid{
    grid-template-columns:repeat(5,minmax(0,1fr));
    gap:14px;
    padding:30px 24px 40px;
  }
  .home-page .student{
    min-width:0;
    padding:22px 16px 18px;
  }
  .home-page .student-top{gap:10px}
  .home-page .student-photo{
    width:58px;
    height:70px;
    flex:0 0 58px;
  }
  .home-page .student-name{font-size:18px}
  .home-page .student-id{font-size:13px}
}

/* Teacher identity: isolated from the existing student and issuance layouts. */
.teacher-auth-shell{min-height:100vh;display:grid;place-items:center;padding:28px;background:linear-gradient(145deg,#eaf5ff,#f7fffd)}
.teacher-auth-card{width:min(430px,calc(100vw - 36px));padding:30px;border:1px solid #cce2f4;border-radius:22px;background:#fff;box-shadow:0 20px 55px rgba(15,72,126,.14)}
.teacher-auth-mark{width:58px;height:58px;display:grid;place-items:center;margin-bottom:18px;border-radius:17px;background:linear-gradient(135deg,#147bd1,#11b9a8);color:#fff;font-weight:800;font-size:24px}
.teacher-auth-card h1{margin:0 0 8px;color:#10375d;font-size:27px}.teacher-auth-card>p{margin:0 0 22px;color:#6a8096;line-height:1.65}
.teacher-login-heading{margin:2px 0 10px;color:#173b5d;font-weight:800}.teacher-login-list{display:grid;gap:8px;max-height:250px;overflow:auto;padding:2px}.teacher-login-person{display:grid;grid-template-columns:42px 1fr auto;align-items:center;gap:12px;width:100%;padding:11px 13px;border:1px solid #c9e0f1;border-radius:12px;background:#fff;color:#173b5d;text-align:left;cursor:pointer}.teacher-login-person:hover{border-color:#14aaa7;background:#f4fffd}.teacher-login-person.is-selected{border-color:#13aaa7;background:#effcfb;box-shadow:0 0 0 2px rgba(19,170,167,.1)}.teacher-login-person>span:nth-child(2){display:grid;gap:2px}.teacher-login-person small{color:#71869a;font-weight:500}.teacher-login-person>strong{color:#0ba59f;font-size:20px}.teacher-login-empty{margin:0;padding:14px;border:1px dashed #c9deed;border-radius:11px;color:#71869a;text-align:center}
.teacher-field{display:grid;gap:8px;margin:14px 0;color:#173b5d;font-weight:700}.teacher-field input{width:100%;height:46px;padding:0 14px;border:1px solid #bed7ec;border-radius:11px;background:#fff;color:#102d49;font:inherit;outline:none}.teacher-field input:focus{border-color:#13adad;box-shadow:0 0 0 3px rgba(19,173,173,.12)}
.teacher-auth-primary{width:100%;height:46px;margin-top:9px;border:0;border-radius:11px;background:linear-gradient(90deg,#147fd8,#0db8a7);color:#fff;font-weight:800;cursor:pointer}.teacher-auth-link{display:block;margin:16px auto 0;border:0;background:transparent;color:#1477bf;cursor:pointer}.teacher-auth-error{min-height:21px;margin-top:12px;color:#d64545;font-size:13px}.teacher-lock-name{margin:4px 0 18px;color:#47657e}
.teacher-account{position:relative;z-index:80;flex:0 0 auto;margin-left:8px}.teacher-current{display:flex;align-items:center;gap:7px;padding:9px 12px;border:1px solid rgba(180,214,238,.9);border-radius:12px;background:rgba(255,255,255,.94);color:#173e60;font-weight:700;box-shadow:0 5px 18px rgba(23,67,104,.1);cursor:pointer;white-space:nowrap}.teacher-current strong{max-width:96px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.teacher-menu{position:absolute;top:calc(100% + 7px);right:0;width:152px;padding:6px;border:1px solid #d1e3f1;border-radius:12px;background:#fff;box-shadow:0 14px 30px rgba(16,60,96,.16)}.teacher-menu button{width:100%;padding:10px 12px;border:0;border-radius:8px;background:transparent;text-align:left;color:#183d5d;cursor:pointer}.teacher-menu button:hover{background:#edf7ff}
.teacher-switch-list{display:grid;gap:9px;max-height:350px;overflow:auto}.teacher-switch-person{display:flex;align-items:center;justify-content:space-between;width:100%;padding:12px 14px;border:1px solid #c9e0f1;border-radius:13px;background:#fff;color:#153a5b;cursor:pointer}.teacher-switch-person:hover{border-color:#12aaa8;background:#f2fffd}.teacher-switch-person.is-current{border-color:#9bd9d7;background:#f1fbfb;cursor:default}.teacher-switch-main{display:flex;align-items:center;gap:12px;min-width:0}.teacher-switch-avatar{display:grid;place-items:center;flex:0 0 42px;width:42px;height:42px;border-radius:50%;background:linear-gradient(145deg,#1687db,#10bbaa);color:#fff;font-weight:900}.teacher-switch-copy{display:grid;gap:3px;min-width:0;text-align:left}.teacher-switch-copy b{font-size:15px}.teacher-switch-copy small{color:#768a9d;font-weight:500}.teacher-switch-mark{color:#09a8a3;font-size:22px;font-weight:900}.teacher-switch-add{display:flex;align-items:center;gap:12px;width:100%;margin-top:11px;padding:12px 14px;border:1px dashed #86c9df;border-radius:13px;background:#f8fdff;color:#12628e;cursor:pointer}.teacher-switch-add span{display:grid;place-items:center;width:42px;height:42px;border:1px solid #b9dcea;border-radius:50%;font-size:22px}.teacher-switch-add:hover{border-color:#0ba9a5;background:#effcfb}.teacher-switch-hint{margin:12px 2px 0;color:#71869a;font-size:13px}
.teacher-existing{margin:0 0 17px;padding:13px;border:1px solid #d5e8f3;border-radius:12px;background:#f7fbfe;color:#173b5d}.teacher-existing>b{display:block;margin-bottom:9px}.teacher-existing-list{display:flex;flex-wrap:wrap;gap:7px}.teacher-existing-chip{padding:6px 10px;border:1px solid #bcdcec;border-radius:999px;background:#fff;color:#17618e;font-size:13px}.teacher-existing-empty{color:#71869a;font-size:13px}
.teacher-management{margin:22px 0;padding:20px;border:1px solid #d6e7f4;border-radius:16px;background:#fff}.teacher-manager-toolbar{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:14px}.teacher-manager-toolbar h3{margin:0;color:#143a5e}.teacher-manager-list{display:grid;gap:9px}.teacher-manager-row{display:grid;grid-template-columns:minmax(130px,1fr) minmax(110px,.8fr) 80px auto;align-items:center;gap:12px;padding:12px;border:1px solid #d7e7f2;border-radius:10px}.teacher-status{font-size:13px;color:#21845f}.teacher-manager-actions{display:flex;gap:7px}.teacher-manager-actions button{padding:7px 10px;border:1px solid #bdd9ec;border-radius:7px;background:#fff;color:#18669d;cursor:pointer}
@media(max-width:1100px){.teacher-current-prefix{display:none}.teacher-current strong{max-width:72px}}
@media(max-width:700px){.teacher-account{margin-left:2px}.teacher-current{padding:8px 9px;font-size:13px}.teacher-manager-row{grid-template-columns:1fr 1fr}.teacher-manager-actions{grid-column:1/-1}.teacher-auth-card{padding:24px 20px}}