/* Original ornamental frames; scoring actions sit outside the frame. */
.morality-score-options { display:grid; grid-template-columns:repeat(10,minmax(0,1fr)); gap:6px; padding:0; margin:0; border:0; }
.morality-score-options legend { margin-bottom:10px; font-size:14px; }
.morality-score-options label { position:relative; cursor:pointer; }
.morality-score-options input { position:absolute; opacity:0; width:1px; height:1px; }
.morality-score-options label > span { display:flex; justify-content:center; align-items:baseline; gap:3px; padding:10px 0; min-height:44px; border:1px solid var(--line); border-radius:8px; background:var(--surface-soft); font-size:20px; font-weight:750; }
.morality-score-options small { font-size:11px; font-weight:400; }
.morality-score-options input:checked + span { color:var(--accent); border-color:var(--accent); background:color-mix(in srgb,var(--accent) 8%,var(--surface)); box-shadow:inset 0 0 0 1px var(--accent); }
.morality-score-options input:focus-visible + span { outline:3px solid var(--accent); outline-offset:2px; }
.morality-optional-note { margin-top:16px; font-size:13px; color:var(--muted); }
.morality-optional-note summary { cursor:pointer; padding:6px 0; }
.morality-optional-note input { width:100%; min-height:42px; margin-top:8px; font-size:16px; }
.morality-card { position:relative; isolation:isolate; border:0; border-radius:0; background:none; padding:0; filter:none; display:flex; flex-direction:column; gap:4px; }
.morality-card::before,.morality-card::after { content:none; }
.morality-card.is-warning { border:0; background:none; }
.morality-card-detail { position:relative; isolation:isolate; display:flex; flex:1; flex-direction:column; justify-content:center; align-items:center; min-height:128px; padding:18px 14px 14px; border-radius:8px; }
.rank-frame-art { position:absolute; inset:0; width:100%; height:100%; z-index:-1; pointer-events:none; overflow:visible; filter:drop-shadow(0 2px 2px color-mix(in srgb,var(--depth) 22%,transparent)); }
.rank-panel { fill:color-mix(in srgb,var(--shine) 15%,var(--surface)); }
.rank-platinum .rank-panel,.rank-diamond .rank-panel { fill:color-mix(in srgb,var(--gem) 9%,var(--surface)); }
.rank-star .rank-panel,.rank-king .rank-panel,.rank-legend .rank-panel,.rank-myth .rank-panel { fill:color-mix(in srgb,var(--depth) 78%,#081426); }
.rank-star .morality-card-detail h3,.rank-king .morality-card-detail h3,.rank-legend .morality-card-detail h3,.rank-myth .morality-card-detail h3 { color:#fff; }
.morality-card:is(.rank-star,.rank-king,.rank-legend,.rank-myth) .rank-score .morality-score,
.morality-card:is(.rank-star,.rank-king,.rank-legend,.rank-myth) .rank-score .rank-name { color:var(--shine); text-shadow:0 1px 3px #0008; }
.rank-crystals { filter:drop-shadow(0 0 2px var(--gem)); }
.rank-orbit { opacity:.45; filter:drop-shadow(0 0 2px var(--gem)); }
.rank-sparks { animation:rank-sparkle 3.5s ease-in-out infinite alternate; }
.rank-myth .rank-frame-art { filter:drop-shadow(0 0 3px var(--gem)); }
.rank-myth .rank-crystals { animation:rank-jewel-glow 3s ease-in-out infinite alternate; }

/* The classroom card uses the same enamel interior and metal light as the promotion emblem. */
#moralityCards .morality-card-detail .rank-panel { fill:#0c172c; }
#moralityCards .morality-card-detail .rank-frame-art { filter:drop-shadow(0 2px 1px color-mix(in srgb,var(--depth) 65%,transparent)) drop-shadow(0 0 5px color-mix(in srgb,var(--gem) 28%,transparent)); transition:filter .2s ease; }
#moralityCards .morality-card-detail:is(:hover,:focus-visible) .rank-frame-art { filter:drop-shadow(0 3px 2px color-mix(in srgb,var(--depth) 70%,transparent)) drop-shadow(0 0 8px color-mix(in srgb,var(--gem) 50%,transparent)); }
#moralityCards .morality-card-detail h3 { color:#f8f7f2; font-weight:800; letter-spacing:.02em; text-shadow:0 1px 3px #000b; }
#moralityCards .morality-card-detail .rank-score .morality-score,
#moralityCards .morality-card-detail .rank-score .rank-name { color:var(--shine); text-shadow:0 1px 3px #000c,0 0 8px color-mix(in srgb,var(--gem) 32%,transparent); }
#moralityCards .morality-card-detail .morality-score strong { font-weight:900; font-variant-numeric:tabular-nums; background:linear-gradient(180deg,var(--shine) 14%,var(--shine) 48%,var(--metal) 100%); background-clip:text; -webkit-background-clip:text; -webkit-text-fill-color:transparent; }
#moralityCards .morality-card-detail .rank-name { letter-spacing:.05em; }
#moralityCards .morality-rank-stars { gap:3px; margin-top:3px; }
#moralityCards .morality-rank-stars .rank-star-mark { width:16px; height:16px; opacity:.48; filter:none; }
#moralityCards .morality-rank-stars .rank-star-mark:not(.is-earned) .star-outline { fill:#18243a; stroke:color-mix(in srgb,var(--shine) 56%,#48546a); }
#moralityCards .morality-rank-stars .rank-star-mark:not(.is-earned) .star-core { fill:#26344d; }
#moralityCards .morality-rank-stars .rank-star-mark:not(.is-earned) .star-facet { opacity:.16; }
#moralityCards .morality-rank-stars .rank-star-mark.is-earned { opacity:1; filter:drop-shadow(0 0 3px var(--gem)) drop-shadow(0 1px 1px var(--depth)); }
#moralityCards .rank-enamel-light { opacity:.9; }
#moralityCards .rank-wings { filter:drop-shadow(0 0 1px color-mix(in srgb,var(--gem) 45%,transparent)); }
#moralityCards .rank-sparks,
#moralityCards .rank-crystals,
#moralityCards .rank-evolving-gem { animation:none; }
/* One short reflection travels along the engraved edge; the rest of the crest stays still. */
#moralityCards .original-polished .polish-edge-light { stroke-dasharray:5 95; stroke-width:1.1; opacity:0; filter:drop-shadow(0 0 1.7px var(--shine)); animation:rank-card-glint 10s linear var(--rank-glint-delay,0s) infinite; }
@keyframes rank-card-glint {
  0%,12% { opacity:0; stroke-dashoffset:15; }
  17% { opacity:.9; stroke-dashoffset:0; }
  38% { opacity:.7; stroke-dashoffset:-85; }
  43%,100% { opacity:0; stroke-dashoffset:-110; }
}
@media(max-width:760px) { #moralityCards .morality-rank-stars .rank-star-mark { width:17px; height:17px; } }
@media(prefers-reduced-motion:reduce) { #moralityCards .morality-card-detail .rank-frame-art { transition:none; } #moralityCards .original-polished .polish-edge-light { animation:none; opacity:.25; stroke-dasharray:none; filter:none; } }

@keyframes rank-sparkle { from {opacity:.25;} to {opacity:1;filter:drop-shadow(0 0 3px var(--gem));} }
@media(prefers-reduced-motion:reduce) { .morality-card .rank-orbit,.morality-card .rank-sparks,.morality-card .rank-crystals { animation:none; } }
.morality-card-detail h3 { color:var(--ink); margin:0; font-size:20px; line-height:1.25; }
.rank-score { display:block; margin:1px 0 0; }
.rank-score .morality-score { color:var(--depth); }
.morality-card-detail .morality-score strong { font-size:38px; line-height:1.05; letter-spacing:-1px; }
.rank-score .rank-name { display:block; color:var(--depth); font-size:13px; line-height:17px; font-weight:800; letter-spacing:1px; }
.morality-card-actions { position:relative; display:grid; grid-template-columns:1fr 1fr; gap:6px; margin:0 7px; }
.morality-card-actions button { min-height:32px; height:32px; padding:0; background:var(--surface); border:1px solid color-mix(in srgb,var(--metal) 35%,var(--line)); border-radius:7px; color:var(--depth); box-shadow:0 1px 2px rgb(0 0 0 / 4%); }
.morality-card-actions button:hover { background:color-mix(in srgb,var(--shine) 35%,var(--surface)); }
.morality-card-detail:focus-visible { outline:3px solid var(--accent); outline-offset:2px; }
.rank-star .rank-jewel,.rank-king .rank-jewel,.rank-legend .rank-jewel,.rank-myth .rank-jewel { animation:rank-jewel-glow 3s ease-in-out infinite alternate; }
@keyframes rank-jewel-glow { to {filter:drop-shadow(0 0 4px var(--gem));fill:var(--shine);} }
@media(prefers-reduced-motion:reduce) { .morality-card .rank-jewel { animation:none; } }
.morality-toolbar { display:flex; gap:8px; margin-left:auto; }
.morality-toolbar button { width:auto; min-height:36px; padding:6px 12px; white-space:nowrap; }
/* Rows grow with the names; two centered names per line. */
.student-cadre-role-picker { height:auto; min-height:44px; grid-auto-rows:minmax(34px,auto); align-items:stretch; }
.student-cadre-role-picker .student-cadre-select { height:100%; min-height:34px; overflow:visible; align-items:center; }
.student-cadre-role-picker .student-cadre-selection { display:block; flex:1; min-width:0; white-space:normal; overflow:visible; text-overflow:clip; }
.cadre-name-grid { display:flex; flex-wrap:wrap; justify-content:center; align-items:center; gap:2px 8px; width:100%; }
.cadre-name-grid > span { flex:0 1 calc(50% - 4px); text-align:center; white-space:normal; overflow-wrap:anywhere; line-height:1.5; }
.cadre-name-grid > span:only-child { flex-basis:100%; }
.student-cadre-role-picker .student-cadre-select.has-selection .student-assignment-plus { display:none; }
/* Bounded modal, with a scrolling body and persistent header/footer. */
.morality-dialog[open] { display:flex; flex-direction:column; max-height:calc(100dvh - 24px); overflow:hidden; }
.morality-dialog > header { flex:0 0 auto; position:relative; }
.morality-dialog > .morality-dialog-content { min-height:0; overflow:auto; overscroll-behavior:contain; }
.cadre-weekly-dialog { width:min(800px,calc(100vw - 24px)); }
.cadre-weekly-dialog header small { display:block; font-size:12px; color:var(--muted); margin-top:4px; }
.cadre-weekly-dialog #cadreWeeklyForm { display:flex; flex-direction:column; min-height:0; overflow:hidden; margin:0; padding:0; }
.weekly-scroll { overflow:auto; overscroll-behavior:contain; min-height:0; padding:0 20px; }
.weekly-enable { display:flex; align-items:center; gap:9px; padding:12px 0; font-weight:700; }
.weekly-enable input { width:18px; height:18px; accent-color:var(--accent); }
.weekly-dates { display:grid; grid-template-columns:1fr 1fr; gap:12px; }
.weekly-dates label { display:grid; gap:5px; font-size:13px; }
.weekly-dates input { min-width:0; width:100%; height:38px; }
.weekly-explainer { padding:10px; background:var(--surface-soft); border-radius:8px; font-size:12px; line-height:1.6; color:var(--muted); }
.weekly-role-list section { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); column-gap:24px; }
.weekly-role-list section h3 { grid-column:1/-1; font-size:13px; margin:12px 0 4px; color:var(--muted); }
.weekly-role-row { display:flex; gap:10px; justify-content:space-between; align-items:center; padding:8px 0; border-bottom:1px solid var(--line); }
.weekly-role-row > span:first-child { min-width:0; }
.weekly-role-row[hidden] { display:none; }
.weekly-role-list section:not(:has(.weekly-role-row:not([hidden]))) { display:none; }
.weekly-filter { display:flex; gap:8px; align-items:center; font-size:13px; margin:10px 0; }
.weekly-filter input { width:16px; height:16px; accent-color:var(--accent); }
.weekly-role-row strong { font-size:14px; }
.weekly-role-row small { display:block; color:var(--muted); font-size:12px; overflow-wrap:anywhere; }
.weekly-points { display:flex; align-items:center; gap:5px; flex-shrink:0; }
.weekly-points input { width:56px; min-height:36px; text-align:center; }
.weekly-footer { flex:0 0 auto; display:flex; justify-content:flex-end; gap:10px; padding:12px 20px; background:var(--surface); border-top:1px solid var(--line); }
.weekly-footer button { width:auto; min-width:90px; }
#weeklySettingsError { color:var(--accent); margin:0; padding:0 20px; font-size:13px; }
@media screen and (min-width:1100px) {
 .morality-card { height:clamp(112px,calc((100dvh - 210px) / 5 - 7px),170px); min-height:112px; }
 .morality-card-detail { min-height:0; padding:13px 8px 10px; }
 .morality-card-detail h3 { font-size:16px; line-height:19px; }
 .morality-card-detail .morality-score strong { font-size:30px; line-height:30px; }
 .rank-score .rank-name { font-size:11px; line-height:14px; letter-spacing:0; }
 .morality-card-actions button { min-height:26px; height:26px; }
 .morality-card-detail .morality-card-status { font-size:9px; line-height:11px; }
 .morality-card.is-warning .morality-card-detail { padding-top:10px; padding-bottom:9px; }
 .morality-card.is-warning .morality-score strong { font-size:25px; line-height:25px; }
}
@media screen and (max-width:760px) {
 .morality-card { padding:0; }
 .morality-card-detail { min-height:145px; padding:20px 16px; }
 .morality-card-detail h3 { font-size:22px; }
 .morality-card-detail .morality-score strong { font-size:42px; }
 .rank-score .rank-name { font-size:14px; line-height:20px; }
 .morality-card-actions button { min-height:40px; height:40px; }
 .morality-toolbar { gap:5px; }
 .morality-toolbar button { padding:5px 7px; font-size:11px; }
 .morality-header h2 { font-size:18px; }
 .weekly-scroll { padding:0 12px; }
 .weekly-dates { gap:8px; }
 .weekly-role-list section { grid-template-columns:1fr; }
 .weekly-footer { padding:10px 12px; }
}

/* Compact roster summary and optional scoring reasons. */
.home-student-directory-title { display:flex; flex-wrap:wrap; align-items:baseline; gap:6px 14px; }
.home-student-directory-title .roster-count-note { font-size:12px; font-weight:400; color:var(--muted); white-space:nowrap; align-self:flex-end; padding-bottom:2px; }
.morality-reason-options { display:flex; flex-wrap:wrap; gap:8px; border:0; padding:0; margin:18px 0 14px; }
.morality-reason-options legend { font-size:14px; margin-bottom:10px; }
.morality-reason-options label { position:relative; cursor:pointer; }
.morality-reason-options input { position:absolute; opacity:0; width:1px; height:1px; }
.morality-reason-options span { display:block; padding:8px 12px; border:1px solid var(--line); border-radius:8px; font-size:14px; background:var(--surface-soft); }
.morality-reason-options input:checked + span { color:var(--accent); border-color:var(--accent); background:color-mix(in srgb,var(--accent) 8%,var(--surface)); }
.morality-reason-options input:focus-visible + span { outline:2px solid var(--accent); outline-offset:2px; }
.morality-reason-options .morality-add-tag { min-height:36px; padding:7px 12px; border:1px dashed var(--muted); border-radius:8px; background:transparent; color:var(--muted); font-size:14px; cursor:pointer; }
.morality-reason-options .morality-add-tag:hover,.morality-reason-options .morality-add-tag:focus-visible { border-color:var(--accent); color:var(--accent); background:color-mix(in srgb,var(--accent) 5%,var(--surface)); }
.morality-tag-editor { display:inline-flex; align-items:center; gap:3px; min-height:36px; padding:2px 4px; border:1px dashed var(--accent); border-radius:8px; }
.morality-tag-editor input { position:static; opacity:1; width:112px; height:30px; padding:3px 6px; border:0; background:transparent; color:var(--ink); font-size:14px; outline:none; }
.morality-tag-editor button { min-width:28px; min-height:28px; padding:0; border:0; border-radius:6px; background:var(--surface-soft); color:var(--ink); cursor:pointer; }
.morality-tag-editor .morality-tag-save { color:var(--accent); }
.morality-custom-reason { display:grid; gap:8px; font-size:13px; color:var(--muted); }
.morality-custom-reason input { width:100%; min-height:42px; font-size:16px; }
@media (max-width:600px) {
 .morality-score-options { gap:4px; }
 .morality-score-options label > span { font-size:15px; gap:0; }
 .morality-score-options small { display:none; }
 .morality-reason-options { gap:6px; }
 .morality-reason-options span { padding:8px 10px; font-size:13px; }
}

/* Quiet, unranked state: no gem, metal bevel, shimmer or tier ornaments. */
.rank-unranked-frame { --unranked-line:#77808c; }
.rank-unranked-panel { fill:#222a36; stroke:var(--unranked-line); stroke-width:1; }
#moralityCards .rank-practice .rank-frame-art,
#moralityCards .rank-practice .morality-card-detail:is(:hover,:focus-visible) .rank-frame-art,
.rank-practice .rank-unranked-frame { filter:none; }
#moralityCards .rank-practice .rank-name { color:#b5bec9; font-weight:500; letter-spacing:0; text-shadow:none; }
#moralityCards .rank-practice .morality-score { color:#c0c7d0; background:none; -webkit-text-fill-color:currentColor; -webkit-text-stroke:0; text-shadow:none; filter:none; }

#moralityCards .rank-practice .morality-score strong { color:#c0c7d0; background:none; -webkit-text-fill-color:currentColor; -webkit-text-stroke:0; text-shadow:none; filter:none; }
