/* V3 contract for every class-workbench surface: compact type, white paper,
   19px dialogs and quiet 9-10px controls. */
:root { --v3-ink:#34384b; --v3-muted:#8c93a6; --v3-line:#e9ebf2; --v3-paper:#fff; --v3-purple:#7966e8; --v3-purple-dark:#5b49c9; --v3-purple-soft:#f0edff; }

/* This shared skeleton intentionally overrides the generic page controls. */
.v3-modal-backdrop { padding:24px; background:rgb(28 31 43 / 48%); backdrop-filter:blur(3px); }
.v3-modal { width:min(760px,100%); max-height:min(780px,calc(100vh - 48px)); padding:0; border:0; border-radius:19px; background:var(--v3-paper); box-shadow:0 28px 70px rgb(24 27 38 / 28%); color:var(--v3-ink); }
.v3-modal-large,.v3-surface-modal { width:min(1040px,100%); }
.v3-surface-modal.is-compact { width:min(760px,100%); }
.v3-surface-modal.is-compact,.v3-surface-modal.is-compact .v3-modal-head,.v3-surface-modal.is-compact .v3-surface-scroll { background:#fffdf8; }
.v3-surface-modal.is-compact .v3-modal-head h2 { color:#173f3b; font-size:19px; }
.v3-surface-modal.is-compact .v3-modal-head p { color:#7a8985; font-size:10px; }
.v3-modal-head { align-items:center; gap:14px; padding:18px 20px; border-bottom:1px solid var(--v3-line); background:#fff; }
.v3-modal-head .eyebrow { display:none; }
.v3-modal-head h2 { margin:0 0 4px; color:var(--v3-ink); font-size:16px; }
.v3-modal-head p { margin:0; color:var(--v3-muted); font-size:9px; }
.v3-modal-close { width:32px; height:32px; min-height:32px; padding:0; border:0; border-radius:9px; color:#838a9c; background:#f3f4f7; font-size:18px; line-height:1; }
.v3-modal-close:hover { color:var(--v3-purple-dark); background:var(--v3-purple-soft); }
.v3-modal-scroll,.v3-surface-scroll { min-height:160px; overflow:auto; padding:20px; background:#fff; }
.v3-modal-scroll > section,.v3-modal-scroll > article,.v3-surface-scroll section,.v3-surface-scroll article { box-shadow:none; }
.v3-modal-foot { gap:9px; padding:13px 20px; border-top:1px solid var(--v3-line); background:#fbfbfd; }
.v3-modal-foot button,.v3-modal-foot .button,.v3-modal-foot a.button,.surface-strip a,.surface-inline-action .button,.store-manage-link { width:auto; min-height:36px; display:inline-flex; align-items:center; justify-content:center; margin:0; padding:0 14px; border:1px solid var(--v3-line); border-radius:9px; color:#71788a; background:#fff; box-shadow:none; font-size:10px; font-weight:850; line-height:1; text-decoration:none; cursor:pointer; }
.v3-modal-foot button:hover,.v3-modal-foot .button:hover,.v3-modal-foot a.button:hover,.surface-strip a:hover,.surface-inline-action .button:hover,.store-manage-link:hover { color:var(--v3-purple-dark); border-color:#ddd7ff; background:var(--v3-purple-soft); }
.v3-modal-foot .button:not(.button-secondary),.v3-modal-foot button:not(.button-secondary) { color:#fff; border-color:var(--v3-purple); background:var(--v3-purple); }
.v3-modal-foot .button:not(.button-secondary):hover,.v3-modal-foot button:not(.button-secondary):hover { color:#fff; border-color:var(--v3-purple-dark); background:var(--v3-purple-dark); }

/* Workbench controls use V3's small control scale. */
.growth-app .toolbar-shell a,.growth-app .toolbar-shell button,.growth-app .toolbar-shell select,.growth-app .toolbar-shell input { font-size:10px; }
.growth-app .icon-action,.growth-app .tool-pill { min-height:34px; padding:0 10px; border-radius:9px; font-size:10px; }
.growth-app .toolbar-shell button.custom-evaluation-toolbar-trigger {
  height:38px;
  min-height:38px;
  padding:0 12px;
  border:1px solid #dce8e1;
  border-radius:10px;
  color:#47645e!important;
  background:#fffdf9;
  box-shadow:none;
  font-size:11px;
}
.growth-app .toolbar-shell button.custom-evaluation-toolbar-trigger:hover { color:#47645e!important; background:#fffdf9; box-shadow:none; filter:none; }
.growth-app .card-actions { grid-template-columns:repeat(3,minmax(0,1fr)); }
.growth-app .card-actions a { min-height:31px; padding:0 4px; border-radius:8px; font-size:8px; }
.growth-app .card-actions a.primary { color:var(--v3-purple-dark); border-color:#e0dcff; background:var(--v3-purple-soft); }
.growth-app .card-actions a.negative { color:#bd4652; border-color:#f1c8cc; background:#fff4f5; }
.growth-app .tool-pill.negative { color:#fff!important; background:#cf6670; }
.growth-app .student-group-badge { display:inline-flex; align-items:center; min-height:20px; margin-top:5px; padding:0 7px; border:1px solid #d8e4df; border-radius:20px; color:#39766d; background:#eef7f4; font-size:8px; font-weight:800; }
.growth-app .growth-button { min-height:36px; border-radius:9px; font-size:10px; }
.growth-app .v8-recent,.growth-app .v8-recent .btn { font-size:9px; }
.growth-app .v8-recent .btn { min-height:30px; padding:0 10px; border:1px solid var(--v3-line); border-radius:8px; color:#71788a; background:#fff; }

.surface-loading { min-height:260px; display:grid; place-content:center; justify-items:center; gap:10px; color:var(--v3-muted); }
.surface-loading span { width:30px; height:30px; border:3px solid #e5e2fb; border-top-color:var(--v3-purple); border-radius:50%; animation:surface-spin .75s linear infinite; }
.surface-loading p { margin:0; font-size:9px; }
@keyframes surface-spin { to { transform:rotate(360deg); } }

/* Class report: V3 three-column panel cards plus one goal strip. */
.class-report-summary { display:flex; align-items:center; gap:8px; margin:0 0 12px; padding:0; border:0; background:transparent; }
.class-report-summary > div { display:flex; align-items:baseline; gap:4px; padding:6px 9px; border:1px solid var(--v3-line); border-radius:9px; background:#f8f9fb; }
.class-report-summary small,.class-report-summary span { color:var(--v3-muted); font-size:8px; }.class-report-summary strong { color:var(--v3-ink); font-size:12px; }
.class-dimension-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.class-dimension-card { min-width:0; display:block; padding:14px; border:1px solid var(--v3-line); border-radius:12px; background:#fff; }
.class-dimension-card h3 { margin:0 0 6px; color:var(--surface-accent); font-size:11px; }.class-dimension-card p { min-height:31px; margin:0 0 12px; color:var(--v3-muted); font-size:9px; line-height:1.65; }
.surface-progress { height:7px; overflow:hidden; border-radius:20px; background:#eceef4; }.surface-progress i { display:block; height:100%; border-radius:inherit; background:var(--surface-accent); }
.class-week-goal { display:grid; grid-template-columns:38px 1fr; align-items:center; gap:11px; margin-top:16px; padding:13px; border:0; border-radius:13px; background:#f3f1ff; }
.class-week-goal > span { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:#fff; background:var(--v3-purple); font-size:15px; font-weight:950; }.class-week-goal strong { display:block; color:var(--v3-ink); font-size:11px; }.class-week-goal p { margin:3px 0 0; color:var(--v3-muted); font-size:9px; }

/* Evaluation history mirrors V3's compact history rows. */
.surface-strip { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:10px; padding:0; border:0; background:transparent; }
.surface-strip > div { display:flex; align-items:center; gap:9px; }.surface-strip strong,.surface-strip small { display:block; }.surface-strip strong { font-size:10px; }.surface-strip small { margin-top:2px; color:var(--v3-muted); font-size:8px; }
.surface-strip-icon { width:28px; height:28px; display:grid; place-items:center; border-radius:9px; color:#fff; background:var(--v3-purple); font-size:13px; font-weight:900; }
.surface-strip a { min-height:29px; padding:0 9px; font-size:8px; }
.v3-record-list { display:grid; gap:8px; }.v3-record-row { display:grid; grid-template-columns:1fr auto; align-items:center; gap:10px; padding:10px 12px; border:0; border-radius:10px; background:#f8f9fb; }
.record-avatar { display:none; }.record-main { min-width:0; }.record-main > div { display:flex; flex-wrap:wrap; align-items:baseline; gap:5px; font-size:10px; }.record-main > div > strong { color:var(--v3-ink); font-size:10px; }.record-main > div > span { color:#5f6679; font-size:9px; font-weight:700; }
.record-main p { margin:3px 0; color:#6f7689; font-size:9px; }.record-main small { display:block; color:var(--v3-muted); font-size:8px; }.record-score { min-width:34px; color:#2a9a72; font-size:13px; text-align:right; }.record-score.is-negative { color:#dc5961; }
.surface-inline-action { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:10px; padding:10px 12px; border:1px solid #f0d79b; border-radius:10px; background:#fff9e9; }.surface-inline-action strong,.surface-inline-action small { display:block; }.surface-inline-action strong { font-size:10px; }.surface-inline-action small { color:#8d8062; font-size:8px; }.surface-inline-action form { margin:0; }.surface-inline-action .button { min-height:29px; padding:0 9px; font-size:8px; }
.history-list { display:grid; gap:8px; }
.history-row { display:grid; grid-template-columns:minmax(0,1fr) auto 64px; align-items:center; gap:10px; padding:10px 12px; border:1px solid transparent; border-radius:10px; background:#f8f9fb; font-size:10px; }
.history-row > span:first-child { min-width:0; color:#4d5d59; line-height:1.55; overflow-wrap:anywhere; }
.history-row b { color:var(--v3-ink); }
.history-row small { color:var(--v3-muted); font-size:8px; }
.history-row form { margin:0; }
.history-score { color:#2a9a72; font-size:13px; }.history-score.is-negative { color:#dc5961; }
.history-undo { width:64px; min-height:28px; padding:0 8px; border:1px solid #e5aaa4; border-radius:8px; color:#bd5148; background:#fff; font-size:8px; font-weight:800; cursor:pointer; }
.history-status { justify-self:end; padding:4px 8px; border-radius:999px; color:#27806f; background:#e5f4ef; font-size:8px; font-weight:850; white-space:nowrap; }
.history-status.is-undone { color:#7d7471; background:#ece9e7; }
.history-row.is-undone { border-color:#ded9d6; background:#f3f1f0; }
.history-row.is-undone > span:first-child { color:#8b8582; }
.history-row.is-undone .history-score { color:#8b8582; text-decoration:line-through; }
.history-progress { flex:0 0 auto; padding:5px 9px; border-radius:999px; color:#766229; background:#fff1c8; font-size:8px; font-weight:850; white-space:nowrap; }
.history-pagination { min-height:42px; display:grid; place-items:center; padding:10px 0 2px; color:var(--v3-muted); font-size:9px; }
.history-pagination button { min-height:32px; padding:0 13px; border:1px solid #ddd7ff; border-radius:9px; color:var(--v3-purple-dark); background:var(--v3-purple-soft); font-size:9px; font-weight:850; cursor:pointer; }
.history-pagination button:hover { border-color:var(--v3-purple); background:#e8e3ff; }
.history-pagination button:disabled { cursor:wait; opacity:.7; }
.history-pagination.is-error { color:#bd5148; }
.history-pagination.is-complete { color:#648078; }

.v3-surface-empty { grid-column:1/-1; min-height:160px; display:grid; place-content:center; justify-items:center; padding:24px; border:1px dashed #d9dce5; border-radius:12px; background:#f8f9fb; text-align:center; }.v3-surface-empty > span { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; color:#fff; background:var(--v3-purple); font-size:17px; font-weight:900; }.v3-surface-empty h3 { margin:9px 0 3px; font-size:12px; }.v3-surface-empty p { margin:0; color:var(--v3-muted); font-size:9px; }.v3-surface-empty.compact { min-height:120px; }

/* Personal report follows V3's cover and dense two-column rows. */
.personal-report-cover { display:grid; grid-template-columns:1fr auto; align-items:center; gap:16px; margin-bottom:0; padding:19px; overflow:hidden; border:0; border-radius:16px; color:#fff; background:linear-gradient(135deg,#1d6f64,#3f9984); box-shadow:0 12px 28px rgb(31 107 94 / 18%)!important; }
.personal-report-cover small { color:rgb(255 255 255 / 72%); font-size:9px; }.personal-report-cover h2 { margin:5px 0 6px; color:#fff; font-family:STKaiti,KaiTi,serif; font-size:24px; }.personal-report-cover p { margin:0; color:rgb(255 255 255 / 78%); font-size:10px; }
.personal-score { width:92px; height:92px; display:grid; place-content:center; border:1px solid rgb(255 255 255 / 35%); border-radius:50%; background:rgb(255 255 255 / 14%); text-align:center; }.personal-score strong { display:block; color:#fff; font-size:31px; line-height:1; }.personal-score span { margin-top:4px; color:#fff; font-size:8px; }
.personal-report-grid { display:grid; grid-template-columns:1fr 1fr; gap:15px; }.personal-report-section { margin:0; padding:15px; border:1px solid #e1e8e2; border-radius:14px; background:#fff; }.surface-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:12px; margin-bottom:12px; }.surface-section-head h3 { margin:0; color:#174d46; font-size:13px; }.surface-section-head span { color:#87938f; font-size:8px; }
.personal-metrics { display:grid; gap:8px; }.personal-metric { display:grid; grid-template-columns:45px 1fr auto; align-items:center; gap:8px; padding:9px 10px; border-radius:9px; background:#f5f7f3; color:#5d6c69; font-size:9px; }.personal-metric > div { height:6px; overflow:hidden; border-radius:8px; background:#e7ebe6; }.personal-metric i { display:block; height:100%; border-radius:inherit; background:linear-gradient(90deg,#45a48d,#e5b951); }.personal-metric strong { color:#226e63; }
.subject-chip-grid { display:grid; grid-template-columns:1fr 1fr; gap:8px; }.subject-chip-grid > div { display:flex; align-items:center; justify-content:space-between; padding:9px 10px; border:0; border-radius:9px; background:#f5f7f3; }.subject-chip-grid span { color:#66736f; font-size:9px; }.subject-chip-grid strong { color:#226e63; font-size:9px; }
.evidence-section { margin-top:15px; }.report-evidence-list { display:grid; gap:8px; }.report-evidence-list article { display:grid; grid-template-columns:34px 1fr; gap:10px; padding:11px; border:0; border-radius:10px; background:#f8f6ef; }.evidence-mark { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#fff; background:#277c70; font-size:10px; font-weight:900; }.report-evidence-list strong { color:#394c49; font-size:10px; }.report-evidence-list strong b { color:#208c68; }.report-evidence-list p { margin:3px 0; color:#76817d; font-size:9px; }.report-evidence-list small { display:block; color:#939b98; font-size:8px; }

/* Personal report content is kept line-for-line with the V3 modal rhythm. */
.personal-report-section { margin-top:15px; padding:15px; border:1px solid #e1e8e2; background:#fff; border-radius:14px; }
.personal-subject-grid { display:grid; grid-template-columns:repeat(2,1fr); gap:8px; }
.personal-subject-row { display:grid; grid-template-columns:45px 1fr auto; align-items:center; gap:8px; padding:9px 10px; background:#f5f7f3; border-radius:9px; font-size:9px; }
.personal-subject-bar { height:6px; overflow:hidden; background:#e7ebe6; border-radius:8px; }.personal-subject-bar i { display:block; width:var(--score); height:100%; background:linear-gradient(90deg,#45a48d,#e5b951); border-radius:inherit; }
.personal-subject-row b { color:#226e63; }
.personal-review-list { display:grid; gap:8px; }
.personal-review-card { display:grid; grid-template-columns:auto 1fr auto; gap:10px; padding:11px; background:#f8f6ef; border-radius:10px; }
.personal-review-avatar { width:34px; height:34px; display:grid; place-items:center; color:#fff; background:#6b8dd6; border-radius:10px; font-weight:900; }
.personal-review-card strong { display:block; margin-bottom:3px; font-size:10px; }.personal-review-card p { margin:0; color:#76817d; font-size:9px; line-height:1.55; }
.personal-review-rating { color:#d08b20; font-size:11px; font-weight:900; }
.personal-report-empty { padding:24px; color:#87938f; background:#f8f9fb; border-radius:10px; font-size:9px; text-align:center; }
.personal-ai-review { position:relative; overflow:hidden; padding:16px 17px 16px 19px; color:#36534f; background:linear-gradient(135deg,#ecf8f3,#fff7dd); border:1px solid #cfe7dd; border-radius:13px; line-height:1.75; font-size:10px; }
.personal-ai-review::before { content:"AI"; position:absolute; right:13px; top:8px; color:rgb(35 117 104 / 12%); font-size:34px; font-weight:950; }
.personal-ai-review strong { display:block; margin-bottom:5px; color:#1e6d62; font-size:12px; }
.personal-ai-review p { position:relative; z-index:1; margin:0; }
.personal-ai-review small { position:relative; z-index:1; display:block; margin-top:7px; color:#71837e; font-size:8px; }

/* Store opens as V3's storefront. Editing stays a secondary action. */
.store-coin-banner { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:13px; margin-bottom:14px; padding:14px; border:1px solid #f3cc6e; border-radius:13px; color:#704a13; background:linear-gradient(135deg,#fff5d7,#ffe5a9); }.store-big-coin { width:46px; height:46px; display:grid; place-items:center; border:4px solid #efb72f; border-radius:50%; color:#8a5809; background:#ffd75e; font-size:22px; font-weight:950; }
.store-coin-banner strong { display:block; margin-bottom:4px; font-size:12px; }.store-coin-banner p { margin:0; color:#8e6c35; font-size:8px; }.store-exchange-button { min-height:36px; padding:0 14px; border:1px solid #e6ad4d; border-radius:9px; color:#704a13; background:#fff8e4; font-size:10px; font-weight:850; cursor:pointer; }
.store-product-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:10px; }
.store-product-card { min-height:0; display:grid; grid-template-rows:112px 1fr auto; overflow:hidden; padding:0; border:1px solid var(--v3-line); border-radius:14px; background:#fff; box-shadow:0 7px 18px rgb(43 52 73 / 6%); transition:transform .16s ease,box-shadow .16s ease,border-color .16s ease; }.store-product-card:hover { transform:translateY(-2px); border-color:#d4cdfb; box-shadow:0 12px 24px rgb(43 52 73 / 10%); }
.store-product-visual { position:relative; display:grid; place-items:center; overflow:hidden; background:radial-gradient(circle at 50% 70%,rgb(255 255 255 / 95%) 0 26%,transparent 57%),linear-gradient(145deg,#edf8f3,#d9efe7); }.store-product-card[data-store-effect="cloud-bed"] .store-product-visual { background:linear-gradient(145deg,#fff8dc,#e9f7ef); }.store-product-card[data-store-effect="entity-coin"] .store-product-visual { background:linear-gradient(145deg,#fff7d8,#ffe28f); }
.store-product-visual > img { width:104px; height:104px; object-fit:contain; filter:drop-shadow(0 7px 7px rgb(42 83 73 / 17%)); }.store-product-visual > .store-bed-preview { width:136px; height:91px; margin-top:-5px; }.store-product-visual > span:last-child { position:absolute; left:8px; bottom:7px; padding:4px 7px; border:1px solid rgb(255 255 255 / 82%); border-radius:14px; color:#446b62; background:rgb(255 255 255 / 86%); box-shadow:0 3px 9px rgb(42 74 66 / 9%); font-size:7px; font-weight:850; }
.store-coin-preview { width:62px; height:62px; display:grid; place-items:center; border:6px solid #e6a71e; border-radius:50%; color:#9b6511; background:radial-gradient(circle at 36% 28%,#fff2a4,#ffc94b 62%,#efa820); box-shadow:inset 0 0 0 3px #ffe781,0 8px 16px rgb(145 98 16 / 20%); }.store-coin-preview i { font-size:20px; font-style:normal; font-weight:950; }
.store-product-copy { padding:11px 12px 8px; }.store-product-card h3 { margin:0 0 5px; color:var(--v3-ink); font-size:11px; }.store-product-card p { min-height:28px; margin:0; color:var(--v3-muted); font-size:8px; line-height:1.55; }.store-product-price { display:flex; align-items:baseline; gap:4px; margin-top:7px; color:#b67818; }.store-product-price b { font-size:15px; }.store-product-price span { font-size:7px; font-weight:800; }
.store-product-card > button { height:33px; margin:0 11px 11px; border:0; border-radius:8px; color:var(--v3-purple-dark); background:var(--v3-purple-soft); font-size:9px; font-weight:850; cursor:pointer; }.store-product-card > button:hover { color:#fff; background:var(--v3-purple); }
.store-secondary-action { display:flex; align-items:center; justify-content:space-between; gap:14px; margin-top:14px; padding:11px 12px; border:1px solid var(--v3-line); border-radius:11px; background:#f8f9fb; }.store-secondary-action > span { display:grid; }.store-secondary-action strong { color:var(--v3-ink); font-size:10px; }.store-secondary-action small { margin-top:3px; color:var(--v3-muted); font-size:8px; }.store-manage-link { min-height:29px; flex:0 0 auto; margin:0; padding:0 9px; font-size:8px; }
.store-fixed-badge { display:inline-flex!important; align-items:center; min-height:28px; padding:0 9px; border-radius:18px; color:#39766d; background:#e5f3ef; font-size:8px; font-weight:850; white-space:nowrap; }
.surface-toast { position:absolute; left:50%; bottom:24px; z-index:5; transform:translateX(-50%); padding:10px 14px; border-radius:10px; color:#fff; background:#277c70; box-shadow:0 10px 24px rgb(24 62 54 / 24%); font-size:10px; font-weight:800; white-space:nowrap; }
.store-redeem-drawer[hidden] { display:none; }
.store-redeem-head { display:grid; grid-template-columns:auto auto 1fr; align-items:center; gap:11px; margin-bottom:12px; padding:12px; border:1px solid #e6e2ff; border-radius:12px; background:linear-gradient(135deg,#f5f3ff,#fff); }
.store-redeem-head > button { min-height:30px; border:1px solid #dcd8f5; padding:0 9px; border-radius:8px; color:var(--v3-purple-dark); background:#fff; font-size:8px; font-weight:850; cursor:pointer; }
.store-redeem-icon { width:38px; height:38px; display:grid; place-items:center; border-radius:11px; background:#fff0cf; font-size:21px; }
.store-redeem-head strong { display:block; color:var(--v3-ink); font-size:12px; }.store-redeem-head p { margin:3px 0 0; color:var(--v3-muted); font-size:8px; }
.store-student-heading { display:flex; align-items:end; justify-content:space-between; gap:10px; margin:0 2px 8px; }.store-student-heading span { color:var(--v3-ink); font-size:10px; font-weight:850; }.store-student-heading small { color:var(--v3-muted); font-size:8px; }
.store-student-list { max-height:390px; display:grid; grid-template-columns:1fr 1fr; gap:7px; overflow:auto; padding:2px; }
.store-student-row { min-width:0; display:grid; grid-template-columns:auto auto minmax(0,1fr) auto; align-items:center; gap:8px; padding:8px; border:1px solid #e5e7ed; border-radius:10px; background:#fbfbfd; cursor:pointer; transition:.15s ease; }
.store-student-row:hover,.store-student-row.is-selected { border-color:#9182eb; background:#f3f0ff; box-shadow:inset 0 0 0 1px #9182eb; }.store-student-row.is-disabled { cursor:not-allowed; opacity:.58; }.store-student-row.is-disabled:hover { border-color:#e5e7ed; background:#fbfbfd; box-shadow:none; }
.store-student-row input { width:15px; height:15px; margin:0; accent-color:var(--v3-purple); }.store-student-avatar { width:29px; height:29px; display:grid; place-items:center; border-radius:50%; color:#fff; background:var(--v3-purple); font-size:9px; font-weight:900; }
.store-student-copy { min-width:0; display:grid; }.store-student-copy strong { overflow:hidden; color:var(--v3-ink); font-size:9px; text-overflow:ellipsis; white-space:nowrap; }.store-student-copy small { margin-top:2px; color:var(--v3-muted); font-size:7px; }
.store-student-points { color:#a36c19; font-size:7px; white-space:nowrap; }.store-student-points b { font-size:10px; }.store-student-action { grid-column:3/-1; color:#6253bd; font-size:7px; font-weight:800; text-align:right; }
.store-redemption-message { min-height:19px; margin:8px 2px 0; color:#237362; font-size:9px; font-weight:750; }.store-redemption-message.is-error { color:#b54752; }
.store-redeem-actions { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:2px; padding:11px 12px; border:1px solid var(--v3-line); border-radius:10px; background:#f8f9fb; }.store-redeem-actions span { max-width:520px; color:var(--v3-muted); font-size:8px; line-height:1.55; }.store-redeem-actions button { min-height:34px; flex:0 0 auto; border:0; padding:0 14px; border-radius:9px; color:#fff; background:var(--v3-purple); font-size:9px; font-weight:850; cursor:pointer; }.store-redeem-actions button:disabled { cursor:not-allowed; opacity:.45; }

/* Teacher-scoped groups: view scores and members first, edit only on demand. */
.group-scope-note { display:grid; grid-template-columns:auto 1fr auto; align-items:center; gap:12px; margin-bottom:12px; padding:13px; border:1px solid #d8e6e1; border-radius:13px; color:#285f57; background:linear-gradient(135deg,#eff8f5,#e3f2ed); }
.group-scope-icon { width:42px; height:42px; display:grid; place-items:center; border-radius:12px; color:#fff; background:#3d9083; box-shadow:0 7px 16px rgb(38 122 108 / 18%); font-size:17px; font-weight:950; }
.group-scope-note strong { display:block; font-size:11px; }
.group-scope-note p { margin:3px 0 0; color:#67817b; font-size:8px; }
.group-count { padding:6px 9px; border-radius:18px; background:rgb(255 255 255 / 72%); font-size:8px; white-space:nowrap; }
.group-count b { margin-right:3px; font-size:12px; }
.group-competition { position:relative; overflow:hidden; margin-bottom:13px; padding:15px; border:1px solid #ded9fb; border-radius:15px; color:#fff; background:linear-gradient(135deg,#6f5bd8 0%,#5744be 54%,#49379f 100%); box-shadow:0 12px 25px rgb(78 59 174 / 16%); }
.group-competition::after { content:""; position:absolute; right:-48px; top:-70px; width:190px; height:190px; border:34px solid rgb(255 255 255 / 6%); border-radius:50%; pointer-events:none; }
.group-competition-head { position:relative; z-index:1; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:10px; }
.group-competition-icon { width:39px; height:39px; display:grid; place-items:center; border:1px solid rgb(255 255 255 / 25%); border-radius:11px; background:rgb(255 255 255 / 14%); font-size:15px; font-weight:950; }
.group-competition-head > div { min-width:0; }
.group-competition-head > div > span { color:#dcd6ff; font-size:7px; font-weight:900; letter-spacing:.13em; }
.group-competition-head h3 { margin:2px 0 3px; color:#fff; font-size:14px; }
.group-competition-head p { margin:0; color:#ddd8ff; font-size:8px; line-height:1.45; }
.group-competition-status { position:relative; z-index:1; display:inline-flex; align-items:center; gap:5px; padding:6px 9px; border:1px solid rgb(255 255 255 / 18%); border-radius:20px; color:#e7e3ff; background:rgb(255 255 255 / 10%); font-size:8px; font-weight:850; white-space:nowrap; }
.group-competition-status.live { color:#194f42; border-color:#c7f5df; background:#dff8eb; }
.group-competition-status.live i { width:6px; height:6px; border-radius:50%; background:#2cbf83; box-shadow:0 0 0 3px rgb(44 191 131 / 16%); }
.group-competition-toolbar { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:12px; margin-top:12px; padding:10px; border:1px solid rgb(255 255 255 / 13%); border-radius:11px; background:rgb(255 255 255 / 9%); }
.group-competition-rule { min-width:0; display:grid; gap:2px; }
.group-competition-rule strong { color:#fff; font-size:9px; }
.group-competition-rule span { color:#d9d4fa; font-size:7px; }
.group-competition-actions { flex:0 0 auto; display:flex; align-items:center; gap:7px; }
.group-competition-actions form { margin:0; }
.group-competition-actions button,.group-competition-actions a { min-height:32px; display:inline-flex; align-items:center; justify-content:center; border:1px solid rgb(255 255 255 / 24%); padding:0 11px; border-radius:8px; color:#fff; background:rgb(255 255 255 / 12%); font-size:8px; font-weight:900; text-decoration:none; cursor:pointer; }
.group-competition-actions .group-competition-start { color:#4f3cad; border-color:#fff; background:#fff; box-shadow:0 6px 14px rgb(34 23 94 / 16%); }
.group-competition-actions .group-competition-end { color:#8f313e; border-color:#ffe2e5; background:#fff0f2; }
.group-competition-actions button:disabled { cursor:not-allowed; opacity:.45; box-shadow:none; }
.lesson-ranking-head { position:relative; z-index:1; display:flex; align-items:center; justify-content:space-between; gap:10px; margin:12px 1px 7px; }
.lesson-ranking-head strong { font-size:9px; }
.lesson-ranking-head span { color:#dcd7fb; font-size:7px; }
.lesson-ranking-list { position:relative; z-index:1; display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:6px; margin:0; padding:0; list-style:none; }
.lesson-ranking-row { min-width:0; display:grid; grid-template-columns:27px minmax(0,1fr) auto; align-items:center; gap:7px; padding:8px; border:1px solid rgb(255 255 255 / 13%); border-radius:10px; background:rgb(255 255 255 / 9%); }
.lesson-ranking-row.is-leading { border-color:#ffe2a3; background:linear-gradient(135deg,rgb(255 221 137 / 22%),rgb(255 255 255 / 10%)); }
.lesson-rank { width:26px; height:26px; display:grid; place-items:center; border-radius:8px; color:#4d3ba6; background:#fff; font-size:9px; font-weight:950; }
.lesson-ranking-row.is-leading .lesson-rank { color:#805606; background:#ffe39a; }
.lesson-ranking-row > div { min-width:0; display:grid; gap:2px; }
.lesson-ranking-row > div strong { overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.lesson-ranking-row > div small { color:#d8d2f8; font-size:7px; }
.lesson-ranking-row > b { font-size:13px; white-space:nowrap; }
.lesson-ranking-row > b small { margin-left:2px; color:#d8d2f8; font-size:7px; }
.group-competition-history { position:relative; z-index:1; margin-top:9px; color:#e6e1ff; font-size:7px; }
.group-competition-history summary { width:max-content; cursor:pointer; font-weight:850; }
.group-competition-history > div { display:flex; flex-wrap:wrap; gap:5px; margin-top:7px; }
.group-competition-history span { display:flex; gap:5px; padding:5px 7px; border-radius:8px; background:rgb(255 255 255 / 10%); }
.group-mode-input { position:absolute; width:1px; height:1px; overflow:hidden; opacity:0; pointer-events:none; }
.group-mode-switch { width:max-content; display:grid; grid-template-columns:1fr 1fr; gap:4px; margin:0 0 12px auto; padding:4px; border:1px solid #e2e4eb; border-radius:11px; background:#f4f5f8; }
.group-mode-switch label { min-width:96px; display:flex; align-items:center; justify-content:center; gap:5px; padding:8px 12px; border-radius:8px; color:#6f7586; font-size:9px; font-weight:850; cursor:pointer; transition:.16s ease; }
.group-mode-switch label span { font-size:11px; }
#groupModeView:checked ~ .group-mode-switch label[for="groupModeView"],
#groupModeEdit:checked ~ .group-mode-switch label[for="groupModeEdit"] { color:#fff; background:linear-gradient(135deg,#7565dc,#5c49c8); box-shadow:0 5px 12px rgb(102 82 210 / 22%); }
.group-view-panel,.group-edit-panel { display:none; }
#groupModeView:checked ~ .group-view-panel { display:block; }
#groupModeEdit:checked ~ .group-edit-panel { display:grid; }
.group-overview-layout { display:grid; grid-template-columns:minmax(220px,.72fr) minmax(450px,1.6fr); gap:14px; }
.group-ranking,.group-member-overview,.group-catalog,.group-assignment { min-width:0; margin:0; padding:14px!important; border:1px solid var(--v3-line)!important; border-radius:13px!important; background:#fff!important; }
.group-ranking { background:linear-gradient(180deg,#fff 0%,#faf9ff 100%)!important; }
.group-section-head { display:flex; align-items:flex-end; justify-content:space-between; gap:10px; margin-bottom:10px; }
.group-section-head span { color:var(--v3-purple-dark); font-size:7px; font-weight:900; letter-spacing:.12em; }
.group-section-head h3 { margin:2px 0 3px; color:var(--v3-ink); font-size:12px; }
.group-section-head p { margin:0; color:var(--v3-muted); font-size:8px; }
.group-section-head > b { padding:5px 8px; border-radius:20px; color:#39766d; background:#e9f6f2; font-size:8px; white-space:nowrap; }
.group-ranking-list { display:grid; gap:7px; margin:0; padding:0; list-style:none; }
.group-ranking-row { display:grid; grid-template-columns:31px minmax(0,1fr) auto; align-items:center; gap:9px; padding:9px; border:1px solid #e8e9ef; border-radius:11px; background:#fff; }
.group-ranking-row.is-top { border-color:#e3ddfa; box-shadow:0 5px 13px rgb(91 72 177 / 6%); }
.group-rank { width:29px; height:29px; display:grid; place-items:center; border-radius:9px; color:#73798a; background:#eff1f4; font-size:9px; font-weight:950; }
.group-rank-1 { color:#805a09; background:linear-gradient(145deg,#ffe9a7,#ffc95f); }
.group-rank-2 { color:#57606d; background:linear-gradient(145deg,#edf1f4,#cfd7dd); }
.group-rank-3 { color:#8a4b29; background:linear-gradient(145deg,#f7d5bd,#eaa779); }
.group-ranking-row > div { min-width:0; display:grid; gap:2px; }
.group-ranking-row > div strong { overflow:hidden; color:#313746; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.group-ranking-row > div small { color:#9297a4; font-size:7px; }
.group-ranking-row > b { color:var(--v3-purple-dark); font-size:14px; }
.group-ranking-row > b small { margin-left:2px; color:#999eaa; font-size:7px; }
.group-member-grid { max-height:330px; display:grid; grid-template-columns:1fr 1fr; gap:8px; overflow:auto; padding:1px 3px 1px 1px; }
.group-member-card { min-width:0; padding:10px; border:1px solid #e5e7ed; border-radius:12px; background:#fbfbfd; }
.group-member-card header { display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:8px; padding-bottom:8px; border-bottom:1px solid #e8e9ee; }
.group-card-mark { width:29px; height:29px; display:grid; place-items:center; border-radius:9px; color:#fff; background:linear-gradient(145deg,#8a78ea,#6552d4); font-size:9px; font-weight:950; }
.group-member-card header div { min-width:0; }
.group-member-card h4 { overflow:hidden; margin:0; color:#303746; font-size:10px; text-overflow:ellipsis; white-space:nowrap; }
.group-member-card header p { margin:2px 0 0; color:#9297a4; font-size:7px; }
.group-member-card header > strong { color:#21806f; font-size:14px; }
.group-member-card header > strong small { color:#8f978f; font-size:7px; }
.group-member-list { display:flex; flex-wrap:wrap; gap:5px; padding-top:8px; }
.group-member-chip { max-width:100%; display:grid; grid-template-columns:auto minmax(0,1fr) auto; align-items:center; gap:5px; padding:4px 6px 4px 4px; border:1px solid #e2e8e5; border-radius:18px; background:#fff; }
.group-member-chip i { width:21px; height:21px; display:grid; place-items:center; border-radius:50%; color:#34786d; background:#e4f2ed; font-size:7px; font-style:normal; font-weight:900; }
.group-member-chip b { overflow:hidden; color:#4e5965; font-size:8px; text-overflow:ellipsis; white-space:nowrap; }
.group-member-chip small { color:#25806f; font-size:7px; white-space:nowrap; }
.group-member-empty { width:100%; padding:12px 8px; color:#9a9eaa; font-size:8px; text-align:center; }
.group-unassigned { display:grid; grid-template-columns:auto minmax(0,1fr); gap:10px; margin-top:9px; padding:8px 10px; border-radius:9px; color:#7d8493; background:#f2f3f6; font-size:8px; }
.group-unassigned strong { color:#606778; white-space:nowrap; }
.group-unassigned span { overflow:hidden; text-overflow:ellipsis; white-space:nowrap; }
.group-edit-panel { grid-template-columns:minmax(280px,.85fr) minmax(360px,1.15fr); gap:14px; }
.group-list { display:grid; gap:7px; }
.group-row { display:grid; grid-template-columns:28px minmax(0,1fr) auto auto auto; align-items:center; gap:6px; margin:0; padding:7px; border:1px solid #e7e9ef; border-radius:10px; background:#fbfbfd; }
.group-mark { width:27px; height:27px; display:grid; place-items:center; border-radius:8px; color:#fff; background:var(--v3-purple); font-size:9px; font-weight:900; }
.group-row label { margin:0; }
.group-row input,.group-create-form input,.group-student-row select { width:100%; min-height:31px; border:1px solid #dfe2e9; padding:0 8px; border-radius:8px; color:var(--v3-ink); background:#fff; font-size:9px; }
.group-row small { color:var(--v3-muted); font-size:8px; white-space:nowrap; }
.group-row button,.group-create-form button,.group-assignment-actions button { min-height:31px; border:1px solid #dcd8f6; padding:0 9px; border-radius:8px; color:var(--v3-purple-dark); background:var(--v3-purple-soft); font-size:8px; font-weight:850; cursor:pointer; }
.group-row button.danger { color:#bd4652; border-color:#f1c8cc; background:#fff4f5; }
.group-create-form { display:grid; grid-template-columns:1fr auto; align-items:end; gap:8px; margin-top:10px; padding-top:10px; border-top:1px solid var(--v3-line); }
.group-create-form label { display:grid; gap:4px; margin:0; color:var(--v3-muted); font-size:8px; }
.group-create-form button,.group-assignment-actions button { color:#fff; border-color:var(--v3-purple); background:var(--v3-purple); }
.group-student-list { max-height:330px; display:grid; grid-template-columns:1fr 1fr; gap:7px; overflow:auto; padding-right:3px; }
.group-student-row { display:grid; grid-template-columns:27px minmax(0,1fr) minmax(92px,.8fr); align-items:center; gap:7px; margin:0; padding:7px; border:1px solid #e7e9ef; border-radius:10px; background:#fbfbfd; }
.group-student-avatar { width:27px; height:27px; display:grid; place-items:center; border-radius:50%; color:#39766d; background:#e5f3ef; font-size:9px; font-weight:900; }
.group-student-row strong { overflow:hidden; font-size:9px; text-overflow:ellipsis; white-space:nowrap; }
.group-assignment-actions { display:flex; align-items:center; justify-content:space-between; gap:10px; margin-top:10px; padding-top:10px; border-top:1px solid var(--v3-line); }
.group-assignment-actions span { color:var(--v3-muted); font-size:8px; }
.group-assignment-actions button:disabled { opacity:.45; cursor:not-allowed; }
.group-empty { min-height:90px; display:grid; place-content:center; justify-items:center; color:var(--v3-muted); text-align:center; }
.group-empty > span { width:34px; height:34px; display:grid; place-items:center; border-radius:10px; color:#fff; background:var(--v3-purple); font-size:14px; font-weight:900; }
.group-empty strong { margin-top:7px; color:var(--v3-ink); font-size:10px; }
.group-empty p { margin:3px 0 0; font-size:8px; }
.group-view-empty { min-height:250px; border:1px dashed #dfe1e8; border-radius:13px; background:#fbfbfd; }
.group-view-empty label { margin-top:12px; padding:8px 13px; border-radius:8px; color:#fff; background:var(--v3-purple); font-size:8px; font-weight:850; cursor:pointer; }
.group-config-page .surface-panel { padding:18px; }

/* Reachable teacher pages retain the same V3 density outside a dialog. */
.v3-compact-page { color:var(--v3-ink); }
.v3-compact-page .standard-head { align-items:center; margin-bottom:15px; }.v3-compact-page .standard-head h1 { margin:3px 0 4px; color:var(--v3-ink); font-size:17px; }.v3-compact-page .standard-head p { color:var(--v3-muted); font-size:10px; }.v3-compact-page .eyebrow { color:var(--v3-purple-dark); font-size:8px; }
.v3-compact-page button,.v3-compact-page .button { min-height:36px; padding:0 14px; border-radius:9px; font-size:10px; font-weight:850; }.v3-compact-page button:not(.button-secondary),.v3-compact-page .button:not(.button-secondary) { color:#fff; border-color:var(--v3-purple); background:var(--v3-purple); }.v3-compact-page .button-secondary { color:#71788a; border-color:var(--v3-line); background:#fff; }
.v3-compact-page .class-entry { gap:14px; padding:17px; border-radius:16px; }.v3-compact-page .class-entry-mark { width:42px; height:42px; border-radius:13px; background:linear-gradient(145deg,#8b78ed,#6552d4); font-size:20px; }.v3-compact-page .class-entry h2 { margin:2px 0 4px; font-size:15px; }.v3-compact-page .class-entry p { font-size:9px; }.v3-compact-page .class-entry small { color:var(--v3-purple-dark); font-size:8px; }
.v3-compact-page .table-scroll { border-color:var(--v3-line); border-radius:14px; box-shadow:0 12px 30px rgb(47 54 83 / 8%); }.v3-compact-page table { font-size:10px; }.v3-compact-page th,.v3-compact-page td { padding:10px 12px; border-color:var(--v3-line); }.v3-compact-page th { color:#5f6679; background:#f3f1ff; }.v3-compact-page .data-chip,.v3-compact-page .availability { padding:3px 7px; color:var(--v3-purple-dark); background:var(--v3-purple-soft); font-size:8px; }.v3-compact-page .table-actions,.v3-compact-page .table-actions a,.v3-compact-page .text-button { font-size:9px; }
.v3-compact-page .surface-panel { padding:20px; border-color:var(--v3-line); border-radius:16px; background:#fff; box-shadow:0 12px 30px rgb(47 54 83 / 8%); }.v3-compact-page .form-panel label { margin-bottom:5px; color:#6f7689; font-size:9px; }.v3-compact-page .form-panel input,.v3-compact-page .form-panel select { min-height:37px; border-color:#d9dce5; border-radius:9px; font-size:10px; }.v3-compact-page .form-panel textarea { min-height:72px; border-color:#d9dce5; border-radius:9px; font-size:10px; }.v3-compact-page .form-actions { justify-content:flex-end; gap:9px; margin-top:14px; }
.teacher-select-body .teacher-select-head h1 { font-size:32px; }.teacher-select-body .teacher-select-head p,.teacher-select-body .selected-class-bar,.teacher-select-body .teacher-select-note { font-size:10px; }.teacher-select-body .class-choice-card,.teacher-select-body .teacher-choice-card { font-size:10px; }.teacher-select-body .teacher-choice-card { min-height:72px; }.teacher-select-body .teacher-choice-card strong,.teacher-select-body .class-choice-card strong { font-size:12px; }.teacher-select-body .teacher-choice-card small,.teacher-select-body .class-choice-card small { font-size:8px; }

@media (max-width:720px) { .v3-modal-backdrop { padding:8px; }.v3-modal { max-height:calc(100vh - 16px); }.v3-modal-scroll,.v3-surface-scroll { padding:14px; }.class-dimension-grid,.store-product-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }.store-student-list { grid-template-columns:1fr; }.personal-report-grid,.personal-subject-grid { grid-template-columns:1fr; }.report-evidence-list { grid-template-columns:1fr; }.personal-report-cover { grid-template-columns:1fr; }.personal-score { width:76px; height:76px; } }
@media (max-width:460px) { .v3-modal-head { padding:14px; }.v3-modal-foot { flex-wrap:wrap; padding:11px 14px; }.v3-modal-foot button,.v3-modal-foot .button,.v3-modal-foot a.button { flex:1 1 auto; }.class-report-summary { overflow:auto; }.class-report-summary > div { flex:0 0 auto; }.class-dimension-grid,.store-product-grid { grid-template-columns:1fr; }.personal-report-cover { grid-template-columns:1fr auto; padding:15px; }.personal-report-cover h2 { font-size:21px; }.personal-score { width:70px; height:70px; }.personal-score strong { font-size:23px; }.store-coin-banner { grid-template-columns:auto 1fr; }.store-exchange-button { grid-column:1/-1; }.store-secondary-action { align-items:stretch; flex-direction:column; }.store-secondary-action .store-manage-link { width:100%; }.store-redeem-head { grid-template-columns:auto auto 1fr; }.store-student-row { grid-template-columns:auto auto minmax(0,1fr); }.store-student-points { grid-column:3; }.store-student-action { grid-column:3; }.store-redeem-actions { align-items:stretch; flex-direction:column; }.store-redeem-actions button { width:100%; } }
@media (max-width:520px) { .surface-inline-action { align-items:flex-start; flex-direction:column; }.history-progress { align-self:flex-start; }.history-row { grid-template-columns:minmax(0,1fr) auto; }.history-row form,.history-row .history-status { grid-column:1/-1; justify-self:end; } }
@media (max-width:800px) { .group-overview-layout,.group-edit-panel { grid-template-columns:1fr!important; }.group-member-grid { max-height:none; }.group-student-list { max-height:none; }.lesson-ranking-list { grid-template-columns:1fr; } }
@media (max-width:560px) { .group-scope-note { grid-template-columns:auto 1fr; }.group-count { grid-column:1/-1; text-align:center; }.group-mode-switch { width:100%; margin-left:0; }.group-mode-switch label { min-width:0; }.group-competition { padding:12px; }.group-competition-head { grid-template-columns:auto 1fr; }.group-competition-status { grid-column:1/-1; width:max-content; }.group-competition-toolbar { align-items:stretch; flex-direction:column; }.group-competition-actions,.group-competition-actions form,.group-competition-actions button,.group-competition-actions a { width:100%; }.group-competition-actions { display:grid; grid-template-columns:1fr 1fr; }.group-competition-actions form:only-child { grid-column:1/-1; }.lesson-ranking-head { align-items:flex-start; flex-direction:column; }.group-member-grid { grid-template-columns:1fr; }.group-unassigned { grid-template-columns:1fr; }.group-unassigned span { white-space:normal; }.group-row { grid-template-columns:28px minmax(0,1fr) auto; }.group-row small { grid-column:2; }.group-row button { grid-row:2; }.group-row button.danger { grid-column:3; }.group-student-list { grid-template-columns:1fr; }.group-create-form { grid-template-columns:1fr; }.group-assignment-actions { align-items:stretch; flex-direction:column; }.group-assignment-actions button { width:100%; } }
@media (prefers-reduced-motion:reduce) { .surface-loading span { animation:none; } }

/* Production V9 academy outfit roster shared by the class shop and full shop page. */
.academy-wardrobe { margin-bottom:16px; padding:16px; border:1px solid #e2e8e4; border-radius:15px; background:#f7f8f6; }
.academy-wardrobe-head { display:flex; align-items:flex-start; justify-content:space-between; gap:16px; margin-bottom:13px; }
.academy-wardrobe-head h3 { margin:3px 0 4px; color:#263e39; font-size:15px; }
.academy-wardrobe-head p { max-width:620px; margin:0; color:#788680; font-size:9px; line-height:1.55; }
.academy-wardrobe-eyebrow { color:#237568; font-size:8px; font-weight:900; letter-spacing:.15em; }
.academy-fit-badge { flex:0 0 auto; padding:6px 9px; border-radius:999px; color:#17685d; background:#e4f3ed; font-size:8px; font-weight:900; white-space:nowrap; }
.academy-wardrobe-grid { display:grid; grid-template-columns:repeat(5,minmax(0,1fr)); gap:9px; }
.academy-wardrobe-item { min-width:0; margin:0; padding:8px 7px 7px; border:1px solid #e2e8e4; border-radius:11px; background:#fff; text-align:center; }
.academy-wardrobe-stage { position:relative; height:86px; display:grid; place-items:center; }
.academy-wardrobe-stage::after { content:""; position:absolute; left:24%; right:24%; bottom:4px; height:10px; border-radius:50%; background:radial-gradient(ellipse,rgb(42 64 58 / 12%),transparent 70%); filter:blur(3px); }
.academy-wardrobe-stage img,.academy-wardrobe-pet { position:relative; z-index:1; width:82px; height:82px; display:block; object-fit:contain; filter:drop-shadow(0 5px 5px rgb(40 70 62 / 12%)); }
.academy-wardrobe-pet.is-growth { background-image:var(--academy-asset); background-position:100% center; background-repeat:no-repeat; background-size:400% 100%; }
.academy-wardrobe-item figcaption { overflow:hidden; margin-top:4px; color:#52635d; font-size:8px; font-weight:800; text-overflow:ellipsis; white-space:nowrap; }

@media (max-width:720px) {
  .academy-wardrobe { padding:13px; }
  .academy-wardrobe-head { gap:10px; }
  .academy-wardrobe-head p { max-width:none; }
  .academy-wardrobe-grid { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .academy-wardrobe-stage { height:102px; }
  .academy-wardrobe-stage img,.academy-wardrobe-pet { width:98px; height:98px; }
}
@media (max-width:390px) {
  .academy-fit-badge { display:none; }
  .academy-wardrobe-head { display:block; }
}