:root {
  --purple:#5e5ce6;--purple-dark:#4b47c2;--purple-soft:#efeffc;--text:#1a1a1a;--muted:#6e6e76;--line:#ececef;--bg:#f7f7f8;--pink:#eb638c;--gold:#e8a63b;--green:#59a992;--subtle:#9c9ca6;--radius:14px;--shadow:0 1px 3px rgba(15,23,42,.04),0 8px 24px rgba(15,23,42,.05)
}
* {
  box-sizing:border-box
}
body {
  margin:0;color:var(--text);background:var(--bg);font:14px/1.6 -apple-system,"PingFang SC","Microsoft YaHei","Segoe UI",sans-serif;-webkit-font-smoothing:antialiased
}
button,input,select,textarea {
  font:inherit
}
button,a,input,select,textarea {
  -webkit-tap-highlight-color:transparent
}
button,.button {
  display:inline-flex;align-items:center;justify-content:center;gap:8px;min-height:40px;padding:11px 18px;border:1px solid var(--line);border-radius:10px;color:var(--text);background:white;text-decoration:none;cursor:pointer;transition:background .18s,border-color .18s,transform .18s;font-weight:500
}
button:hover,.button:hover {
  border-color:#bbb9f0;background:var(--bg)
}
button:focus-visible,a:focus-visible {
  outline:3px solid #5e5ce645;outline-offset:3px
}
button:disabled {
  opacity:.5;cursor:not-allowed;transform:none!important
}
.primary {
  background:var(--purple);border-color:var(--purple);color:white;font-weight:600
}
.primary:hover {
  background:var(--purple-dark);color:white;border-color:var(--purple-dark)
}
.small {
  min-height:34px;padding:7px 13px;font-size:13px;border-radius:8px
}
.quiet {
  border:0;background:transparent
}
.danger {
  color:#be4767
}
.full {
  width:100%
}
a {
  color:var(--purple)
}
button svg,.button svg,nav svg {
  width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round
}
.icon-definitions {
  position:absolute;width:0;height:0;overflow:hidden
}
h1,h2,h3,p {
  margin:0
}
h1 {
  font-size:22px;letter-spacing:normal
}
h2 {
  font-size:19px
}
h3 {
  font-size:16px
}
.muted {
  color:var(--muted)
}
.error {
  color:#bf405f;font-size:13px;white-space:pre-wrap;min-height:20px
}
.actions {
  display:flex;gap:10px;flex-wrap:wrap
}
.session-screen {
  display:grid;place-items:center;min-height:100dvh;padding:24px;background:var(--bg)
}
.session-card {
  background:#fff;max-width:430px;width:100%;padding:34px;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow)
}
.session-card>.app-mark {
  margin-bottom:22px
}
.session-card h1 {
  font-size:22px
}
.session-card>p {
  color:var(--muted);margin:12px 0 22px
}
.session-card .actions {
  margin-top:22px
}
.session-card .error {
  color:#bf405f;margin:5px 0 12px
}
.back-link {
  display:block;text-align:center;margin-top:20px;text-decoration:none;font-size:13px
}
label {
  display:block;font-size:13px;font-weight:500
}
label>input,label>select,label>textarea {
  margin-top:7px
}
.session-card label {
  margin-bottom:16px
}
input:not([type=checkbox]),select,textarea {
  min-height:42px;width:100%;padding:9px 12px;background:#fff;border:1px solid #dfe1ed;border-radius:9px;color:var(--text);border-color:var(--line);font-size:14px
}
input:focus,select:focus,textarea:focus {
  outline:none;border-color:var(--purple);box-shadow:0 0 0 3px rgba(94,92,230,.12)
}
textarea {
  min-height:75px;resize:vertical
}
input[type=checkbox] {
  width:17px;height:17px;accent-color:var(--purple);cursor:pointer
}
.app-layout {
  display:flex;min-height:100dvh
}
.sidebar {
  width:232px;flex-shrink:0;background:#fff;border-right:1px solid var(--line);position:fixed;inset:0 auto 0 0;display:flex;flex-direction:column;padding:22px 14px;z-index:10
}
.platform-brand {
  display:flex;align-items:center;gap:11px;color:var(--text);font-weight:700;text-decoration:none;padding:4px 8px 20px;font-size:15px
}
.app-mark {
  display:inline-grid;place-items:center;width:32px;height:32px;flex-shrink:0;background:var(--purple);color:#fff;border-radius:8px;font-size:15px;font-weight:600;box-shadow:none
}
.platform-brand small {
  font-size:12px;font-weight:400;display:block;color:var(--subtle);margin-top:1px;max-width:135px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis
}
.sidebar-section {
  color:var(--subtle);font-size:12px;letter-spacing:.08em;margin:0;padding:14px 10px 6px
}
.platform-nav {
  display:grid;gap:2px
}
.platform-nav a {
  display:flex;align-items:center;gap:10px;padding:10px 12px;border-radius:9px;text-decoration:none;color:var(--muted);font-size:14px;white-space:nowrap;font-weight:500
}
.platform-nav a:hover {
  background:#f0f0f2;color:var(--text)
}
.platform-nav a.active {
  color:var(--purple);background:var(--purple-soft);font-weight:600
}
.nav-new {
  font-size:12px;border-radius:5px;background:#e0ddff;padding:1px 5px;margin-left:auto
}
.sidebar-bottom {
  margin-top:auto;padding:12px 8px 0;border-top:1px solid var(--line);display:flex;align-items:flex-start;gap:8px;font-size:12px;color:var(--muted)
}
.sidebar-bottom small {
  font-size:12px;color:var(--subtle)
}
.sync-dot {
  display:block;width:6px;height:6px;border-radius:50%;background:#75bfa2;margin-top:6px;flex-shrink:0
}
.workspace {
  margin-left:232px;width:calc(100% - 232px);min-width:0
}
.topbar {
  height:72px;padding:0 34px;background:#fff;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:15px
}
.breadcrumb {
  color:var(--muted);font-size:13px
}
.breadcrumb span {
  margin:0 12px;color:#c8cbd6
}
.breadcrumb strong {
  font-weight:500;color:var(--text)
}
.topbar-actions {
  display:flex;align-items:center;gap:17px;font-size:13px;color:var(--muted)
}
.content {
  max-width:1550px;margin:auto;padding:28px 34px
}
.page-heading {
  display:flex;justify-content:space-between;align-items:center;gap:20px;margin-bottom:24px
}
.eyebrow {
  font-size:12px;letter-spacing:2px;color:#9b97ce;font-weight:600;margin-bottom:7px
}
.page-heading h1 span {
  color:var(--gold);font-size:28px;margin-left:9px
}
.page-heading p {
  font-size:13px;color:var(--muted);margin-top:9px
}
.sound-toggle {
  background:#fff;border-radius:10px;font-size:13px;padding:8px 14px;color:var(--muted);min-height:35px
}
.sound-toggle[aria-pressed=true] {
  background:var(--purple-soft);color:var(--purple);border-color:#d3d0fa
}
.sound-toggle svg {
  width:15px;height:15px
}
.summary-grid {
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:18px;margin-bottom:24px
}
.stat {
  padding:22px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);box-shadow:var(--shadow);display:flex;align-items:center;justify-content:space-between;gap:12px
}
.stat-label {
  font-size:13px;color:var(--muted);margin-bottom:5px
}
.stat-value {
  font-size:30px;letter-spacing:-.5px;line-height:1.2;font-weight:700;font-variant-numeric:tabular-nums
}
.stat-note {
  font-size:12px;color:var(--subtle);margin-top:7px
}
.stat-icon {
  display:grid;place-items:center;width:42px;height:42px;border-radius:13px;background:var(--purple-soft);color:var(--purple);flex-shrink:0
}
.stat-icon svg {
  width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.65;stroke-linecap:round;stroke-linejoin:round
}
.stat-icon.pink {
  color:var(--pink);background:#fff0f5
}
.stat-icon.gold {
  color:var(--gold);background:#fff7e8
}
.stat-icon.green {
  color:var(--green);background:#ecf8f4
}
.module-tabs {
  display:flex;gap:22px;border-bottom:1px solid var(--line);margin-bottom:23px;overflow-x:auto
}
.module-tabs button {
  position:relative;border:0;border-radius:0;padding:12px 2px 14px;background:none;color:var(--muted);font-size:14px;min-height:45px;white-space:nowrap
}
.module-tabs button svg {
  width:17px;height:17px
}
.module-tabs button.active {
  color:var(--purple);font-weight:600
}
.module-tabs button.active:after {
  position:absolute;content:"";height:3px;border-radius:2px;background:var(--purple);inset:auto 0 -1px
}
.panel {
  border:1px solid var(--line);background:white;border-radius:var(--radius);box-shadow:var(--shadow);padding:22px;min-width:0
}
.panel-title {
  display:flex;justify-content:space-between;align-items:center;gap:12px;margin-bottom:17px;flex-wrap:wrap
}
.panel-title h2 {
  font-size:16px
}
.panel-title h2 small {
  font-size:12px;color:var(--muted);font-weight:400;margin-left:8px
}
.panel-subtitle {
  font-size:13px;color:var(--muted);margin-top:5px
}
.evaluate-layout {
  display:grid;grid-template-columns:minmax(0,1.5fr) minmax(310px,1fr);gap:20px;align-items:start
}
.filter-row {
  display:flex;align-items:center;gap:10px;margin-bottom:16px
}
.filter-row select {
  min-width:100px;max-width:150px;font-size:14px;min-height:40px;background:#fff
}
.search-box {
  position:relative;flex:1
}
.search-box svg {
  position:absolute;left:11px;top:12px;width:15px;height:15px;fill:none;stroke:#a3a7b8;stroke-width:1.8
}
.search-box input {
  padding-left:33px;font-size:14px;background:#fff;min-height:40px
}
.selection-line {
  display:flex;justify-content:space-between;align-items:center;gap:10px;padding-bottom:13px;font-size:13px;color:var(--muted);flex-wrap:wrap
}
.selection-line label {
  display:flex;align-items:center;gap:7px;font-size:13px;font-weight:400
}
.selection-line strong {
  color:var(--purple);font-weight:600
}
.student-grid {
  display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:10px;max-height:548px;overflow:auto;padding:2px 2px 5px
}
.student-card {
  position:relative;background:#fff;border:1px solid var(--line);border-radius:12px;padding:15px 7px 11px;text-align:center;transition:border-color .2s,background .2s;min-height:134px
}
.student-card:has(input:checked) {
  border-color:#aaa5f7;background:#f8f7ff;box-shadow:0 0 0 1px #cecafa inset
}
.student-card>input {
  position:absolute;top:10px;right:9px;width:17px;height:17px;margin:0
}
.avatar {
  display:grid;place-items:center;border-radius:50%;width:44px;height:44px;margin:2px auto 8px;color:#8471bf;background:#f0ebfc;font-size:17px;font-weight:500
}
.avatar.tone-1 {
  background:#e9f3fa;color:#6e9bbe
}
.avatar.tone-2 {
  background:#fbeef2;color:#cd859a
}
.avatar.tone-3 {
  background:#eaf6ef;color:#75a78a
}
.avatar.tone-4 {
  background:#fff3e4;color:#bf9864
}
.avatar.tone-5 {
  background:#ededfc;color:#7e81bc
}
.student-name {
  padding:0;min-height:auto;border:0;background:transparent!important;font-size:14px;font-weight:600;color:var(--text);max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap
}
.student-name:hover {
  color:var(--purple)
}
.student-class {
  font-size:12px;color:var(--subtle);white-space:nowrap;overflow:hidden;text-overflow:ellipsis;margin-top:1px
}
.student-counts {
  display:flex;justify-content:center;gap:11px;color:var(--subtle);font-size:12px;margin-top:7px
}
.student-counts span {
  display:flex;align-items:center;gap:3px
}
.student-counts svg {
  width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.7
}
.student-counts .flower-count {
  color:#db809a
}
.student-counts .point-count {
  color:#b8a26f
}
.subtle-link {
  border:0;background:transparent;min-height:auto;padding:0;font-size:13px;color:var(--purple);text-decoration:none
}
.selection-help {
  display:flex;align-items:center;gap:7px;font-size:12px;color:var(--subtle);border-top:1px solid var(--line);padding-top:13px;margin-top:13px
}
.selection-help svg {
  width:13px;height:13px;fill:none;stroke:currentColor;stroke-width:1.6
}
.mode-control {
  display:flex;border:1px solid var(--line);background:#f7f7f8;padding:3px;border-radius:10px;margin-bottom:17px
}
.mode-control button {
  flex:1;padding:7px 5px;min-height:33px;border:0;font-size:13px;background:transparent;color:var(--muted);border-radius:7px;white-space:nowrap
}
.mode-control button.active {
  background:#fff;color:var(--purple);box-shadow:0 2px 7px #30235c0a;font-weight:600
}
.dimension-tabs {
  display:flex;gap:5px;margin-bottom:13px;flex-wrap:wrap
}
.dimension-tabs button {
  min-height:34px;padding:3px 11px;font-size:13px;border-radius:8px;background:var(--bg);border-color:transparent;color:var(--muted)
}
.dimension-tabs button.active {
  background:var(--purple-soft);color:var(--purple);border-color:#e2dffe
}
.rule-grid {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:9px;max-height:271px;overflow:auto;padding:1px
}
.rule-card {
  display:flex;align-items:center;justify-content:flex-start;text-align:left;gap:9px;min-height:76px;padding:11px;border-radius:11px;background:#fff;position:relative
}
.rule-card.selected {
  border-color:#a7a1f2;background:#f6f4ff;box-shadow:0 0 0 1px #d3cefc inset
}
.dimension-icon {
  width:32px;height:32px;border-radius:10px;display:grid;place-items:center;font-size:16px;flex-shrink:0;background:#f1ecff
}
.dimension-icon.d-zhi {
  background:#eaf3fd
}
.dimension-icon.d-ti {
  background:#ecf7f1
}
.dimension-icon.d-mei {
  background:#fff1f6
}
.dimension-icon.d-lao {
  background:#fff5e6
}
.rule-title {
  font-size:14px;font-weight:600;display:block;line-height:1.5;overflow-wrap:anywhere
}
.rule-values {
  display:block;font-size:12px;color:var(--subtle);margin-top:3px
}
.rule-values .positive {
  color:#a48b4c
}
.rule-values .negative {
  color:#bc5470
}
.reward-form {
  margin-top:16px;border-top:1px solid var(--line);padding-top:15px
}
.reward-form label {
  font-size:13px;color:var(--muted);font-weight:400
}
.reward-form textarea {
  font-size:14px;min-height:75px;background:#fff;margin-top:7px
}
.reward-footer {
  margin-top:13px;display:flex;align-items:center;gap:12px
}
.reward-preview {
  flex:1;font-size:12px;color:var(--muted)
}
.reward-preview strong {
  display:block;color:var(--text);font-size:13px;overflow-wrap:anywhere
}
.reward-button {
  min-height:43px;min-width:143px;font-size:14px;box-shadow:none
}
.reward-button svg {
  width:17px;height:17px
}
.reward-hint {
  font-size:12px;color:var(--subtle);margin-top:11px;text-align:center
}
.recent-panel {
  margin-top:20px;padding:17px 20px
}
.recent-list {
  display:grid;gap:0
}
.recent-row {
  display:flex;align-items:center;gap:11px;padding:11px 0;border-bottom:1px solid #f0f1f7
}
.recent-row:last-child {
  border-bottom:0;padding-bottom:1px
}
.recent-avatar {
  width:30px;height:30px;flex-shrink:0;display:grid;place-items:center;border-radius:9px;background:#f3efff;color:#9c8fc2;font-size:12px
}
.recent-text {
  font-size:13px;flex:1;min-width:0
}
.recent-text strong {
  font-weight:500
}
.recent-text small {
  display:block;color:var(--subtle);font-size:12px;margin-top:2px
}
.recent-award {
  font-size:12px;color:#d689a0;white-space:nowrap
}
.recent-award.point {
  color:#b6a06b
}
.recent-undo {
  font-size:13px;min-height:32px;padding:3px 7px;border:0;color:var(--muted)
}
.page-footer {
  font-size:12px;color:var(--subtle);text-align:center;margin:28px 0 0
}
.empty-state {
  padding:42px 20px;border:1px dashed #dbdeee;border-radius:12px;text-align:center;color:var(--muted);background:var(--bg);grid-column:1/-1
}
.empty-symbol {
  width:52px;height:52px;border-radius:17px;background:var(--purple-soft);color:#9d97dd;display:grid;place-items:center;margin:0 auto 14px;font-size:25px
}
.empty-state h3 {
  font-size:14px;color:var(--text);margin-bottom:6px
}
.empty-state p {
  font-size:13px;max-width:360px;margin:0 auto 16px
}
.empty-state .button {
  font-size:14px
}
.loading-card {
  padding:60px 20px;text-align:center;color:var(--muted);border:1px solid var(--line);border-radius:var(--radius);background:white
}
.data-error {
  padding:36px;background:#fff;border:1px solid var(--line);border-radius:var(--radius);text-align:center
}
.data-error p {
  font-size:13px;color:var(--muted);margin:10px 0 18px
}
.notice {
  position:fixed;top:20px;left:50%;transform:translateX(-50%);padding:12px 22px;background:#292640;color:#fff;z-index:100;font-size:14px;border-radius:11px;box-shadow:0 8px 35px #1b173028;max-width:min(90vw,600px);white-space:pre-wrap
}
.notice.error-notice {
  background:#963e58
}
.ranking-toolbar {
  display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:20px;flex-wrap:wrap
}
.segment {
  display:flex;gap:2px;padding:3px;background:#f0f1f8;border-radius:10px
}
.segment button {
  border:0;background:transparent;font-size:13px;min-height:31px;padding:6px 13px;border-radius:7px;color:var(--muted)
}
.segment button.active {
  background:#fff;color:var(--purple);box-shadow:0 1px 5px #3123550d
}
.ranking-filters {
  display:flex;gap:8px
}
.ranking-filters select {
  min-height:40px;font-size:14px;padding:6px 9px;min-width:120px
}
.ranking-intro {
  font-size:13px;color:var(--muted);margin-bottom:20px
}
.podium {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px;margin-bottom:23px;align-items:end
}
.podium-card {
  border-radius:var(--radius);background:linear-gradient(165deg,#fff7e7,#fffefb);border:1px solid #f1e6ca;padding:22px 18px;text-align:center;position:relative
}
.podium-card.second {
  background:linear-gradient(165deg,#f1f1fe,#fdfdff);border-color:#e2e2f2
}
.podium-card.third {
  background:linear-gradient(165deg,#fff0e9,#fffdfb);border-color:#f3e2d6
}
.podium-card .rank-medal {
  font-size:25px;margin-bottom:7px
}
.podium-card .avatar {
  width:49px;height:49px
}
.podium-card h3 {
  font-size:14px;margin-top:8px
}
.podium-card p {
  font-size:12px;color:var(--muted);margin-top:2px
}
.podium-value {
  font-size:25px;font-weight:700;color:#b39049;line-height:1.3;margin-top:13px
}
.podium-value small {
  font-size:12px;font-weight:400;margin-left:4px
}
.rank-table {
  width:100%;border-collapse:collapse;font-size:14px
}
.table-wrap {
  overflow:auto
}
.rank-table th {
  font-weight:500;font-size:13px;color:var(--muted);text-align:left;padding:13px 16px;background:var(--bg);white-space:nowrap
}
.rank-table td {
  padding:13px 16px;border-bottom:1px solid var(--line);white-space:nowrap
}
.rank-table tr:last-child td {
  border-bottom:0
}
.rank-position {
  width:23px;height:23px;border-radius:7px;background:var(--bg);display:grid;place-items:center;font-size:12px;color:var(--muted)
}
.rank-name {
  display:flex;align-items:center;gap:10px
}
.rank-name .avatar {
  width:30px;height:30px;font-size:12px;margin:0
}
.rank-value {
  font-weight:600;color:#625fc4
}
.caption {
  font-size:12px;color:var(--subtle);margin-top:15px
}
.records-filters {
  display:flex;gap:12px;margin-bottom:18px;align-items:center;flex-wrap:wrap
}
.batch-record {
  padding:16px 18px;border:1px solid var(--line);border-radius:12px;margin-bottom:12px;display:grid;grid-template-columns:1fr auto;gap:14px
}
.batch-record.undone {
  background:var(--bg);color:var(--subtle)
}
.batch-title {
  display:flex;align-items:center;gap:9px;flex-wrap:wrap;font-size:13px
}
.status-badge {
  font-size:12px;padding:2px 7px;border-radius:5px;color:#5d9b87;background:#eff8f4
}
.status-badge.undone {
  color:var(--subtle);background:#eeeef4
}
.record-meta {
  font-size:12px;color:var(--subtle);margin-top:5px
}
.record-students {
  font-size:13px;margin-top:10px;color:var(--muted);line-height:1.8
}
.record-note {
  font-size:12px;color:var(--muted);margin-top:6px;white-space:pre-wrap
}
.batch-values {
  font-size:12px;color:#c9859e;display:flex;gap:12px;margin:6px 0 10px;justify-content:flex-end
}
.batch-values span:nth-child(2) {
  color:#b49c64
}
.rules-header {
  margin-bottom:21px;display:flex;justify-content:space-between;align-items:flex-start;gap:15px
}
.rules-header p {
  font-size:13px;color:var(--muted);margin-top:7px
}
.rule-directory {
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:14px
}
.dimension-column {
  border:1px solid var(--line);border-radius:13px;padding:16px
}
.dimension-heading {
  display:flex;align-items:center;gap:9px;font-size:14px;margin-bottom:16px
}
.dimension-heading small {
  font-size:12px;font-weight:400;color:var(--subtle);margin-left:auto
}
.directory-rule {
  border-top:1px solid var(--line);padding:13px 0
}
.directory-rule strong {
  font-size:14px;font-weight:500;display:block;overflow-wrap:anywhere
}
.directory-rule small {
  font-size:12px;color:var(--subtle);margin-top:4px;display:block
}
.rule-origin {
  font-size:12px;color:var(--subtle);margin-top:3px
}
.detail-dialog {
  padding:0;max-width:730px;width:calc(100vw - 36px);max-height:85dvh;border:1px solid var(--line);border-radius:var(--radius);box-shadow:0 20px 100px #24244026;color:var(--text)
}
.detail-dialog::backdrop {
  background:#22213b55;backdrop-filter:blur(3px)
}
.dialog-close {
  position:absolute;right:17px;top:14px;border:0;background:var(--bg);color:var(--muted);font-size:23px;min-height:30px;width:30px;padding:0;z-index:1;border-radius:50%
}
#dialogContent {
  padding:29px
}
.modal-heading {
  padding-right:35px;margin-bottom:19px
}
.modal-heading h2 {
  font-size:20px
}
.modal-heading p {
  font-size:13px;color:var(--muted);margin-top:7px
}
.form-grid {
  display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px
}
.form-grid label {
  font-size:13px
}
.form-grid .wide {
  grid-column:1/-1
}
.form-help {
  font-size:12px;color:var(--muted);margin-top:6px
}
.modal-actions {
  margin-top:22px;display:flex;gap:10px;justify-content:flex-end
}
.profile-header {
  display:flex;align-items:center;gap:17px;margin-bottom:23px;padding-right:35px
}
.profile-header .avatar {
  margin:0;width:62px;height:62px;font-size:26px
}
.profile-header h2 {
  font-size:22px
}
.profile-header p {
  color:var(--muted);font-size:13px;margin-top:4px
}
.profile-stats {
  display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:10px;margin-bottom:22px
}
.profile-stat {
  padding:14px;background:#f7f6ff;border-radius:11px;color:#9793b5;font-size:12px
}
.profile-stat strong {
  display:block;font-size:24px;color:var(--purple);line-height:1.3;margin-bottom:4px
}
.profile-dimensions {
  display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:8px;margin-top:14px;margin-bottom:22px
}
.profile-dimension {
  padding:13px 7px;text-align:center;background:var(--bg);border-radius:10px;border:1px solid var(--line);font-size:12px;color:var(--muted)
}
.profile-dimension .dimension-icon {
  margin:0 auto 8px
}
.profile-dimension strong {
  color:var(--text);font-size:13px;display:block;margin-bottom:3px
}
.profile-dimension small {
  display:block;margin-top:4px;font-size:12px;color:var(--subtle)
}
.profile-section {
  border-top:1px solid var(--line);padding-top:18px;margin-top:18px
}
.profile-section>h3 {
  font-size:14px;margin-bottom:12px
}
.profile-check {
  padding:10px 0;border-bottom:1px solid var(--line);font-size:13px;display:flex;align-items:flex-start;justify-content:space-between;gap:10px
}
.profile-check:last-child {
  border:0
}
.profile-check small {
  display:block;color:var(--subtle);font-size:12px;margin-top:2px
}
.profile-empty {
  color:var(--subtle);font-size:13px;padding:12px 0
}
.celebration {
  position:fixed;inset:0;z-index:80;pointer-events:none;overflow:hidden;display:grid;place-items:center
}
.celebration-card {
  position:relative;display:flex;flex-direction:column;align-items:center;justify-content:center;width:300px;min-height:240px;background:#ffffffed;border:1px solid #fff;border-radius:28px;box-shadow:0 10px 80px #44306728;backdrop-filter:blur(15px);animation:reward-card 2.7s ease both
}
.celebration-card h2 {
  font-size:23px;letter-spacing:1px;color:#d26089;margin-top:13px
}
.celebration-card p {
  font-size:12px;color:#9e8da8;margin-top:5px;text-align:center;padding:0 20px
}
.bloom-flower {
  width:88px;height:88px;position:relative;animation:bloom 1s cubic-bezier(.15,.85,.35,1.4) both
}
.petal {
  position:absolute;left:30px;top:2px;width:28px;height:49px;background:linear-gradient(#f7a4b5,#eb6591);border-radius:50%;transform-origin:14px 42px;transform:rotate(calc(var(--n)*60deg));box-shadow:0 1px 4px #ed78903a
}
.flower-center {
  position:absolute;width:30px;height:30px;background:#ffd782;border:4px solid #ffe9a6;box-shadow:0 1px 5px #b47b3933;border-radius:50%;left:29px;top:29px
}
.floating-award {
  position:absolute;left:calc(50% + var(--x));top:calc(50% + var(--y));font-size:19px;font-weight:700;color:var(--c);animation:float-up 1.6s ease-out forwards;animation-delay:var(--delay)
}
.confetti {
  position:absolute;left:var(--x);top:-20px;width:8px;height:13px;border-radius:2px;background:var(--c);animation:confetti-fall 2.3s ease-out forwards;animation-delay:var(--delay);transform:rotate(var(--rot))
}
@keyframes reward-card {
  0% {
    transform:scale(.85) translateY(15px);opacity:0
  }
  15%,78% {
    transform:scale(1);opacity:1
  }
  100% {
    transform:scale(.96);opacity:0
  }
}
@keyframes bloom {
  0% {
    transform:scale(.1) rotate(-40deg);opacity:0
  }
  60% {
    opacity:1
  }
  100% {
    transform:scale(1) rotate(0)
  }
}
@keyframes float-up {
  0% {
    opacity:0;transform:translateY(30px) scale(.6)
  }
  25% {
    opacity:1;transform:translateY(0) scale(1)
  }
  100% {
    opacity:0;transform:translateY(-125px) scale(.9)
  }
}
@keyframes confetti-fall {
  0% {
    opacity:0;transform:translateY(-20px) rotate(0)
  }
  10% {
    opacity:1
  }
  100% {
    opacity:0;transform:translateY(100vh) rotate(calc(var(--rot) + 400deg))
  }
}
[hidden] {
  display:none!important
}
@media(min-width:1650px) {
  .student-grid {
    grid-template-columns:repeat(5,minmax(0,1fr))
  }
  .content {
    padding-top:36px
  }
  .student-card {
    min-height:150px;padding-top:21px
  }
  .avatar {
    width:50px;height:50px
  }
  .rule-grid {
    max-height:315px
  }
  .rule-card {
    min-height:75px
  }
}
@media(max-width:1200px) {
  .content {
    padding:25px 23px 18px
  }
  .topbar {
    padding:0 23px
  }
  .evaluate-layout {
    grid-template-columns:minmax(0,1.25fr) minmax(295px,1fr);gap:15px
  }
  .student-grid {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .panel {
    padding:17px
  }
  .summary-grid {
    gap:10px
  }
  .stat {
    padding:15px
  }
  .stat-icon {
    width:35px;height:35px
  }
  .stat-value {
    font-size:30px
  }
  .rule-directory {
    grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .platform-brand small {
    max-width:120px
  }
  .filter-row {
    flex-wrap:wrap
  }
  .filter-row select {
    flex:1;max-width:none
  }
  .filter-row .search-box {
    flex-basis:100%
  }
  .student-grid {
    max-height:554px
  }
}
@media(max-width:960px) {
  .nav-new {
    display:none
  }
  .sidebar-bottom {
    font-size:12px
  }
  .sidebar-bottom small {
    font-size:12px
  }
  .evaluate-layout {
    grid-template-columns:1fr
  }
  .student-grid {
    grid-template-columns:repeat(5,minmax(0,1fr));max-height:375px
  }
  .rule-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));max-height:240px
  }
  .summary-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .stat {
    padding:15px 18px
  }
  .stat-value {
    font-size:30px
  }
  .filter-row {
    flex-wrap:nowrap
  }
  .filter-row select {
    max-width:135px
  }
  .filter-row .search-box {
    flex-basis:auto
  }
  .page-heading h1 {
    font-size:22px
  }
  .sound-toggle {
    padding:7px 10px;font-size:12px
  }
  .rule-directory {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .page-heading {
    align-items:flex-start
  }
}
@media(max-width:768px) {
  .sidebar {
    position:static;width:100%;padding:16px 16px 0;border-right:0;border-bottom:1px solid var(--line)
  }
  .app-layout {
    display:block
  }
  .platform-brand {
    align-items:center;font-size:15px;padding:0
  }
  .platform-brand small {
    display:none
  }
  .sidebar-section,.sidebar-bottom {
    display:none
  }
  .platform-nav {
    display:flex;overflow:auto;gap:4px;margin-top:15px;margin-bottom:8px;scrollbar-width:none
  }
  .platform-nav a {
    padding:8px 11px;font-size:13px;gap:8px;white-space:nowrap
  }
  .platform-nav svg {
    width:15px;height:15px
  }
  .workspace {
    margin:0;width:100%
  }
  .topbar {
    height:49px;padding:0 18px
  }
  .breadcrumb {
    font-size:12px
  }
  .topbar-actions {
    font-size:12px;gap:10px
  }
  .topbar-actions .button {
    font-size:12px;min-height:27px;padding:3px 8px
  }
  .content {
    padding:16px 14px
  }
  .page-heading {
    gap:10px;margin-bottom:20px
  }
  .eyebrow {
    font-size:12px;letter-spacing:1.2px
  }
  .page-heading h1 {
    font-size:22px
  }
  .page-heading h1 span {
    font-size:21px;margin-left:3px
  }
  .page-heading p {
    font-size:12px;max-width:220px;line-height:1.7
  }
  .sound-toggle {
    min-height:29px;border-radius:8px;font-size:12px;padding:6px 8px;white-space:nowrap
  }
  .sound-toggle svg {
    display:none
  }
  .summary-grid {
    margin-bottom:18px;gap:9px
  }
  .stat {
    padding:13px
  }
  .stat-label {
    font-size:12px
  }
  .stat-value {
    font-size:30px
  }
  .stat-note {
    font-size:12px
  }
  .stat-icon {
    width:33px;height:33px
  }
  .stat-icon svg {
    width:17px;height:17px
  }
  .module-tabs {
    gap:18px;margin-bottom:17px;overflow:auto
  }
  .module-tabs button {
    font-size:14px;gap:6px;padding-bottom:12px
  }
  .module-tabs svg {
    width:15px!important;height:15px!important
  }
  .panel {
    padding:16px 13px;border-radius:13px
  }
  .panel-title h2 {
    font-size:14px
  }
  .panel-title h2 small {
    font-size:12px
  }
  .student-grid {
    grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;max-height:425px
  }
  .student-card {
    min-height:130px
  }
  .filter-row {
    gap:7px;flex-wrap:wrap
  }
  .filter-row select {
    max-width:none;font-size:16px
  }
  .filter-row .search-box {
    flex-basis:100%
  }
  .filter-row input {
    font-size:16px
  }
  .rule-grid {
    grid-template-columns:repeat(2,minmax(0,1fr))
  }
  .rule-card {
    padding:10px 8px;gap:7px;min-width:0
  }
  .dimension-icon {
    width:30px;height:30px;font-size:15px
  }
  .selection-line {
    font-size:13px
  }
  .selection-line label {
    font-size:13px
  }
  .selection-help {
    font-size:12px
  }
  .reward-button {
    min-width:137px
  }
  .recent-text {
    font-size:13px
  }
  .recent-award {
    font-size:12px
  }
  .recent-panel {
    padding:16px 14px
  }
  .recent-avatar {
    width:27px;height:27px
  }
  .recent-row {
    gap:8px
  }
  .recent-undo {
    font-size:13px;padding:3px
  }
  .ranking-toolbar {
    gap:11px
  }
  .segment button {
    font-size:12px;padding:5px 10px
  }
  .ranking-filters {
    width:100%;gap:7px
  }
  .ranking-filters select {
    min-width:0;flex:1
  }
  .ranking-intro {
    font-size:12px
  }
  .podium {
    gap:7px
  }
  .podium-card {
    padding:15px 8px
  }
  .podium-card .avatar {
    width:37px;height:37px;font-size:14px
  }
  .podium-card h3 {
    font-size:12px
  }
  .podium-card p {
    font-size:12px
  }
  .podium-value {
    font-size:21px
  }
  .podium-value small {
    font-size:12px
  }
  .rank-table {
    font-size:14px
  }
  .rank-table td,.rank-table th {
    padding:11px 10px
  }
  .rank-table .avatar {
    display:none
  }
  .rules-header {
    flex-wrap:wrap
  }
  .rule-directory {
    gap:10px
  }
  .dimension-column {
    padding:13px
  }
  .batch-record {
    padding:13px;grid-template-columns:1fr
  }
  .batch-record .record-actions {
    display:flex;justify-content:space-between;align-items:center
  }
  .batch-values {
    margin:0;justify-content:flex-start
  }
  .detail-dialog {
    width:calc(100vw - 22px);max-height:91dvh;border-radius:15px
  }
  #dialogContent {
    padding:24px 18px
  }
  .profile-header {
    gap:12px
  }
  .profile-header h2 {
    font-size:21px
  }
  .profile-header .avatar {
    width:51px;height:51px;font-size:23px
  }
  .profile-header p {
    font-size:12px
  }
  .profile-dimensions {
    gap:8px;grid-template-columns:repeat(3,minmax(0,1fr))
  }
  .profile-dimension {
    padding:9px 3px;font-size:12px
  }
  .profile-dimension .dimension-icon {
    width:26px;height:26px;font-size:13px
  }
  .profile-dimension strong {
    font-size:12px
  }
  .profile-stat {
    padding:11px;font-size:12px
  }
  .profile-stat strong {
    font-size:21px
  }
  .form-grid {
    gap:13px
  }
  .form-grid label {
    font-size:13px
  }
  .form-grid input,.form-grid select {
    font-size:16px
  }
  .celebration-card {
    width:250px;min-height:225px
  }
  .celebration-card h2 {
    font-size:21px
  }
}
@media(prefers-reduced-motion:reduce) {
  *,*::before,*::after {
    scroll-behavior:auto!important;animation:none!important;transition:none!important
  }
  .confetti,.floating-award {
    display:none
  }
  .celebration-card {
    opacity:1;transform:none
  }
  .bloom-flower {
    opacity:1;transform:none
  }
}
/* Complete history, rules, teacher access and points redemption. */

.batch-select-actions {
  display:flex;align-items:center;gap:10px;flex-wrap:wrap;margin:0 0 13px;color:var(--muted);font-size:12px
}
.history-filters,.date-range-form {
  display:flex;align-items:flex-end;gap:12px;flex-wrap:wrap;margin:16px 0 20px
}
.history-filters label {
  flex:1;min-width:125px;font-size:13px
}
.history-filters .ranking-filters {
  flex-basis:100%;display:flex
}
.history-filters input,.history-filters select,.date-range-form input {
  min-height:40px;font-size:14px
}
.date-range-form label {
  max-width:210px;font-size:13px
}
.pagination {
  display:flex;justify-content:space-between;align-items:center;gap:12px;padding-top:18px;margin-top:10px;border-top:1px solid var(--line);font-size:12px;color:var(--muted)
}
.rule-actions {
  display:flex;align-items:center;gap:15px;margin-top:11px
}
.inactive-rule {
  opacity:.65;background:var(--bg)
}
.personal-history .history-entry {
  padding:13px 0;border-bottom:1px solid var(--line)
}
.history-entry>div {
  display:flex;align-items:center;gap:12px
}
.history-entry p {
  font-size:12px;color:var(--muted);margin-top:6px
}
.wallet-strip {
  display:flex;align-items:center;justify-content:space-between;gap:8px;flex-wrap:wrap;padding:12px 15px;margin:12px 0 20px;background:var(--purple-soft);border-radius:10px;font-size:12px;color:#7b75aa
}
.wallet-strip strong {
  font-size:22px;color:var(--purple);margin-left:7px
}
.teacher-entry {
  display:flex;align-items:center;gap:13px;flex-wrap:wrap;background:#f8f7ff;border:1px solid var(--line);border-radius:10px;padding:14px;margin-bottom:20px;font-size:13px
}
.teacher-entry a {
  overflow-wrap:anywhere
}
.teacher-access-form {
  border:1px solid var(--line);border-radius:12px;padding:16px;margin-top:14px
}
.teacher-access-heading {
  display:flex;justify-content:space-between;align-items:center;gap:12px
}
.teacher-access-heading .muted {
  font-size:12px
}
.access-options,.class-access-options {
  display:flex;gap:14px;align-items:center;flex-wrap:wrap;margin-top:14px
}
.access-options label,.class-access-options label {
  display:flex;gap:6px;align-items:center;font-size:13px;font-weight:400
}
.access-options input,.class-access-options input {
  margin:0
}
.class-access-options {
  border:1px solid var(--line);padding:12px;border-radius:9px
}
.class-access-options legend {
  font-size:12px;color:var(--muted);padding:0 6px
}
.class-access-options:disabled {
  opacity:.45
}
.access-error {
  margin-top:10px;min-height:0
}
.redeem-layout {
  display:grid;grid-template-columns:minmax(260px,.8fr) minmax(0,1.2fr);gap:25px
}
.redeem-form {
  padding:18px;background:var(--bg);border:1px solid var(--line);border-radius:12px
}
.redeem-form h3 {
  margin-bottom:15px
}
.redeem-form label {
  margin-top:13px;font-size:13px
}
.redeem-form .wallet-strip {
  margin:12px 0
}
.reward-catalog {
  display:grid;gap:11px;margin-top:14px;max-height:610px;overflow:auto
}
.reward-catalog-card {
  border:1px solid var(--line);border-radius:12px;padding:15px
}
.reward-catalog-card strong {
  font-size:14px
}
.reward-catalog-card p {
  font-size:13px;color:var(--muted);margin:6px 0;white-space:pre-wrap
}
.reward-cost {
  color:var(--purple);font-weight:600;font-size:13px
}
.reward-catalog-card .muted {
  font-size:12px
}
.redemption-history {
  margin-top:26px;padding-top:20px;border-top:1px solid var(--line)
}
.redemption-row {
  display:flex;justify-content:space-between;gap:15px;align-items:center;padding:15px 0;border-bottom:1px solid var(--line);font-size:13px
}
.redemption-row p {
  font-size:12px;color:var(--muted);margin-top:5px
}
@media(max-width:768px) {
  .module-tabs {
    gap:18px
  }
  .batch-select-actions {
    gap:8px;font-size:13px
  }
  .history-filters {
    gap:9px
  }
  .history-filters label {
    min-width:125px
  }
  .pagination {
    flex-wrap:wrap;font-size:12px
  }
  .teacher-access-form {
    padding:13px
  }
  .teacher-access-heading {
    align-items:flex-start
  }
  .teacher-access-heading .muted {
    display:block
  }
  .teacher-entry {
    gap:8px
  }
  .teacher-entry a {
    width:100%;font-size:12px
  }
  .redeem-layout {
    grid-template-columns:1fr;gap:20px
  }
  .redeem-form {
    padding:14px
  }
  .redemption-row {
    align-items:flex-start;flex-direction:column;gap:9px
  }
  .redemption-row>div:last-child {
    display:flex;align-items:center;justify-content:space-between;width:100%
  }
  .history-filters input,.history-filters select,.date-range-form input {
    font-size:16px
  }
}
/* The school shell supplies navigation, heading and page spacing. */
body.moral-embedded {
  background:var(--bg)
}
.moral-embedded .sidebar,.moral-embedded .topbar,.moral-embedded .page-heading-title {
  display:none
}
.moral-embedded .app-layout {
  display:block;min-height:0
}
.moral-embedded .session-screen {
  min-height:0
}
.moral-embedded .page-heading {
  display:flex;justify-content:flex-end;margin-bottom:16px
}
.moral-embedded .workspace {
  width:100%;margin:0
}
.moral-embedded .content {
  width:100%;max-width:none;margin:0;padding:0
}
.moral-embedded .detail-dialog {
  top:var(--moral-dialog-top,16px);bottom:auto;margin:0 auto;max-height:var(--moral-dialog-height,600px)
}
.moral-embedded .celebration {
  align-items:start;padding-top:var(--moral-dialog-top,16px)
}
.moral-embedded .notice {
  top:var(--moral-dialog-top,16px)
}

/* Teacher and school iframe controls share the same inset arrow. */
body:is(.moral-teacher-controls,.moral-embedded) select:not([multiple]):is(:not([size]),[size="0"],[size="1"]) {
  -webkit-appearance:none;
  appearance:none;
  padding-inline-end:40px;
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16'%3E%3Cpath d='m4 6 4 4 4-4' fill='none' stroke='%2363768c' stroke-width='1.6' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:right 14px center;
  background-size:16px 16px;
}
@media(forced-colors:active) {
  body:is(.moral-teacher-controls,.moral-embedded) select:not([multiple]):is(:not([size]),[size="0"],[size="1"]) {
    -webkit-appearance:auto;
    appearance:auto;
    background-image:none;
    padding-inline-end:12px;
  }
}
