/* Liquid Glass visual layer; enabled only for the glass theme. */
body.student-page,body.admin-page{
  --glass-panel:rgba(255,255,255,.76);
  --glass-card:rgba(255,255,255,.84);
  --glass-subtle:rgba(255,255,255,.54);
  --glass-edge:rgba(255,255,255,.78);
  min-height:100vh;
  isolation:isolate;
  background:
    radial-gradient(circle at 7% 72%,rgba(184,128,255,.44),transparent 32%),
    radial-gradient(circle at 91% 14%,rgba(72,183,255,.45),transparent 34%),
    linear-gradient(126deg,#ece5ff 0%,#d6d4ff 27%,#b8dcff 64%,#c7f0f4 100%);
  background-attachment:fixed;
}
body.student-page::before,body.student-page::after,
body.admin-page::before,body.admin-page::after{
  content:'';
  position:fixed;
  z-index:0;
  width:clamp(190px,26vw,380px);
  aspect-ratio:1;
  border-radius:50%;
  pointer-events:none;
  opacity:.52;
  filter:blur(1px);
  box-shadow:inset 15px 16px 35px rgba(255,255,255,.32),0 30px 85px rgba(70,100,190,.12);
}
body.student-page::before,body.admin-page::before{
  top:13%;left:7%;
  background:radial-gradient(circle at 30% 28%,rgba(255,255,255,.75),rgba(180,110,255,.3) 47%,rgba(110,101,241,.12) 72%);
  animation:glass-drift-one 31s ease-in-out infinite alternate;
}
body.student-page::after,body.admin-page::after{
  right:6%;bottom:7%;width:clamp(145px,19vw,290px);
  background:radial-gradient(circle at 28% 26%,rgba(255,255,255,.8),rgba(80,213,240,.3) 50%,rgba(58,147,245,.12) 75%);
  animation:glass-drift-two 37s ease-in-out infinite alternate;
}
@keyframes glass-drift-one{
  0%{transform:translate3d(0,0,0)}
  45%{transform:translate3d(11vw,7vh,0)}
  100%{transform:translate3d(-3vw,21vh,0)}
}
@keyframes glass-drift-two{
  0%{transform:translate3d(0,0,0)}
  55%{transform:translate3d(-13vw,-10vh,0)}
  100%{transform:translate3d(4vw,-21vh,0)}
}
.student-page>.topbar,.student-page>.student-layout,
.admin-page>#adminApp,.admin-page>#authScreen{position:relative;z-index:1}
.student-page>.topbar{position:sticky;z-index:20}
.admin-page .topbar{position:sticky;z-index:20}
.student-page .category-nav{background:var(--glass-panel)}
.student-page .message-card,.admin-page .panel,.admin-page .auth-card{
  background:var(--glass-card);
  border-color:var(--glass-edge);
  box-shadow:0 18px 48px rgba(39,67,135,.12),inset 0 1px 0 rgba(255,255,255,.78);
}
.student-page .topbar,.admin-page .topbar,
.student-page .category-nav,
.admin-page .panel,.admin-page .auth-card,
.student-page .modal,.admin-page .modal{
  -webkit-backdrop-filter:blur(21px) saturate(145%);
  backdrop-filter:blur(21px) saturate(145%);
}
.student-page .topbar,.admin-page .topbar{
  background:var(--glass-panel);
  border-bottom-color:var(--glass-edge);
  box-shadow:0 4px 26px rgba(49,79,158,.08);
}
.student-page .searchbox,.student-page .student-group summary,
.student-page .mobile-category-toggle,
.admin-page .admin-group,.admin-page .admin-msg,
.admin-page .richbox,.admin-page .type-tabs button,
.admin-page .picker-options,.admin-page .password-block,
.admin-page .emoji-picker{
  background:var(--glass-subtle);
  border-color:var(--glass-edge);
}
.admin-page .admin-msg{box-shadow:0 8px 24px rgba(48,73,135,.07)}
.student-page .modal,.admin-page .modal{background:var(--glass-card);border-color:var(--glass-edge)}
.student-page .message-content,.student-page .note-content,
.admin-page .rich-editor{color:var(--text)}

:root[data-theme=dark] body.student-page,
:root[data-theme=dark] body.admin-page{
  --glass-panel:rgba(20,31,58,.79);
  --glass-card:rgba(24,38,66,.86);
  --glass-subtle:rgba(29,47,78,.72);
  --glass-edge:rgba(148,174,233,.22);
  background:
    radial-gradient(circle at 10% 75%,rgba(113,67,185,.43),transparent 34%),
    radial-gradient(circle at 88% 17%,rgba(32,142,201,.32),transparent 38%),
    linear-gradient(128deg,#141a3b 0%,#142653 48%,#103957 100%);
  background-attachment:fixed;
}
:root[data-theme=dark] body.student-page::before,
:root[data-theme=dark] body.admin-page::before{opacity:.3}
:root[data-theme=dark] body.student-page::after,
:root[data-theme=dark] body.admin-page::after{opacity:.25}
:root[data-theme=dark] .student-page .message-card,
:root[data-theme=dark] .admin-page .panel,
:root[data-theme=dark] .admin-page .auth-card{
  box-shadow:0 18px 48px rgba(0,0,0,.26),inset 0 1px 0 rgba(217,230,255,.09);
}
@media(prefers-reduced-motion:reduce){
  body.student-page::before,body.student-page::after,
  body.admin-page::before,body.admin-page::after{animation:none}
}

/* A few fixed decorative elements keep animation cost independent of message count. */
.glass-atmosphere{position:fixed;inset:0;z-index:0;overflow:hidden;pointer-events:none}
.glass-orb{position:absolute;display:block;aspect-ratio:1;border-radius:50%;opacity:.49;background:radial-gradient(circle at 30% 26%,rgba(255,255,255,.8),rgba(192,130,255,.29) 43%,rgba(89,106,241,.12) 75%);box-shadow:inset 10px 15px 24px rgba(255,255,255,.27),0 16px 60px rgba(81,94,184,.1);will-change:transform}
.orb-one{width:clamp(90px,13vw,185px);top:6%;left:38%;animation:glass-float-a 43s ease-in-out infinite alternate}
.orb-two{width:clamp(170px,25vw,360px);top:34%;right:8%;background:radial-gradient(circle at 32% 28%,rgba(255,255,255,.77),rgba(92,204,249,.25) 48%,rgba(83,125,232,.13) 78%);animation:glass-float-b 59s ease-in-out infinite alternate}
.orb-three{width:clamp(75px,10vw,145px);bottom:16%;left:30%;background:radial-gradient(circle at 32% 26%,rgba(255,255,255,.83),rgba(241,157,232,.37) 48%,rgba(200,111,228,.11) 77%);animation:glass-float-c 35s ease-in-out infinite alternate}
.orb-four{width:clamp(130px,19vw,280px);bottom:-7%;right:36%;background:radial-gradient(circle at 35% 24%,rgba(255,255,255,.8),rgba(104,227,225,.27) 48%,rgba(66,172,217,.1) 77%);animation:glass-float-d 71s ease-in-out infinite alternate}
.glass-particles{position:absolute;inset:-10%;opacity:.37;background-image:radial-gradient(circle,rgba(255,255,255,.9) 1px,transparent 1.9px),radial-gradient(circle,rgba(113,135,235,.75) .8px,transparent 1.7px);background-size:137px 151px,211px 227px;background-position:25px 40px,90px 110px;animation:glass-sparkle 95s linear infinite alternate}
@keyframes glass-float-a{to{transform:translate3d(13vw,16vh,0)}}
@keyframes glass-float-b{to{transform:translate3d(-17vw,-12vh,0)}}
@keyframes glass-float-c{to{transform:translate3d(-11vw,-20vh,0)}}
@keyframes glass-float-d{to{transform:translate3d(15vw,-19vh,0)}}
@keyframes glass-sparkle{to{transform:translate3d(-4vw,6vh,0)}}
.student-page .message-card{background:rgba(255,255,255,.8);border:1px solid rgba(255,255,255,.9);box-shadow:0 16px 42px rgba(40,67,135,.12),inset 0 1px 0 rgba(255,255,255,.96),inset 0 -1px 0 rgba(166,186,231,.16)}
.student-page .category-nav,.admin-page .panel,.admin-page .auth-card{box-shadow:0 18px 52px rgba(39,67,135,.1),inset 0 1px 0 rgba(255,255,255,.7)}
.student-page .visual-theme-picker summary,.admin-page .visual-theme-picker summary,.visual-theme-options{background:var(--glass-panel);border-color:var(--glass-edge);-webkit-backdrop-filter:blur(18px) saturate(150%);backdrop-filter:blur(18px) saturate(150%)}
:root[data-theme=dark] .student-page .message-card{background:rgba(23,36,66,.87);border-color:rgba(154,185,240,.22);box-shadow:0 18px 45px rgba(0,0,0,.26),inset 0 1px 0 rgba(255,255,255,.11)}
:root[data-theme=dark] .glass-orb{opacity:.26}
:root[data-theme=dark] .glass-particles{opacity:.26}
@media(prefers-reduced-motion:reduce){.glass-orb,.glass-particles{animation:none;will-change:auto}}