/* Full-card rank frames. Decorative metal surrounds the entire student card. */
.morality-card {
  --frame:polygon(8% 0,92% 0,100% 8%,100% 92%,92% 100%,8% 100%,0 92%,0 8%);
  position:relative; isolation:isolate; border:0; border-radius:0; background:none; padding:7px 7px 8px;
  filter:drop-shadow(0 2px 3px color-mix(in srgb,var(--depth) 28%,transparent));
}
.morality-card::before { content:''; position:absolute; inset:0; z-index:-2; clip-path:var(--frame); background:linear-gradient(135deg,var(--depth) 0%,var(--shine) 16%,var(--metal) 30%,var(--depth) 44%,var(--shine) 52%,var(--metal) 63%,var(--shine) 82%,var(--depth)); background-size:200% 200%; }
.morality-card::after { content:''; position:absolute; inset:4px; z-index:-1; clip-path:var(--frame); background:linear-gradient(145deg,color-mix(in srgb,var(--shine) 35%,var(--surface)),var(--surface) 42%,color-mix(in srgb,var(--metal) 17%,var(--surface))); box-shadow:inset 0 0 12px color-mix(in srgb,var(--depth) 20%,transparent); }
.morality-card.rank-silver { --frame:polygon(0 0,23% 4%,50% 0,77% 4%,100% 0,97% 44%,100% 88%,82% 100%,18% 100%,0 88%,3% 44%); }
.morality-card.rank-gold { --frame:polygon(0 0,20% 7%,35% 0,50% 5%,65% 0,80% 7%,100% 0,97% 30%,100% 76%,86% 94%,50% 100%,14% 94%,0 76%,3% 30%); }
.morality-card.rank-platinum { --frame:polygon(0 8%,12% 0,28% 7%,50% 0,72% 7%,88% 0,100% 8%,95% 40%,100% 76%,83% 96%,50% 100%,17% 96%,0 76%,5% 40%); }
.morality-card.rank-diamond { --frame:polygon(0 13%,15% 0,35% 6%,50% 0,65% 6%,85% 0,100% 13%,94% 50%,100% 82%,74% 95%,50% 100%,26% 95%,0 82%,6% 50%); }
.morality-card.rank-star { --frame:polygon(0 0,22% 8%,36% 2%,50% 0,64% 2%,78% 8%,100% 0,94% 29%,100% 53%,95% 80%,74% 94%,50% 100%,26% 94%,5% 80%,0 53%,6% 29%); }
.morality-card.rank-king,.morality-card.rank-legend,.morality-card.rank-myth { --frame:polygon(0 0,16% 8%,27% 0,38% 6%,50% 0,62% 6%,73% 0,84% 8%,100% 0,96% 25%,100% 60%,93% 82%,76% 95%,50% 100%,24% 95%,7% 82%,0 60%,4% 25%); }
.morality-card.rank-diamond::after,.morality-card.rank-star::after { inset:5px; }
.morality-card.rank-king::after,.morality-card.rank-legend::after,.morality-card.rank-myth::after { inset:6px; }
.morality-card.is-warning { border:0; background:none; }
.morality-card-detail h3 { color:var(--ink); }
.rank-score { display:block; margin:1px 0 0; }
.rank-score .morality-score { color:var(--depth); }
.rank-score .rank-name { display:block; color:var(--depth); font-size:9px; line-height:11px; letter-spacing:1px; }
.morality-card-actions { position:relative; z-index:1; }
.morality-card-actions button { background:color-mix(in srgb,var(--surface) 88%,var(--shine)); border-color:color-mix(in srgb,var(--metal) 45%,var(--line)); border-radius:6px; color:var(--depth); }
.rank-star::before,.rank-king::before,.rank-legend::before,.rank-myth::before { animation:rank-metal-flow 9s ease-in-out infinite alternate; }
.rank-legend::before,.rank-myth::before { animation-duration:6s; }
@keyframes rank-metal-flow { from {background-position:0% 0%;} to {background-position:100% 100%;} }
@media(prefers-reduced-motion:reduce) { .morality-card::before { 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; }
.cadre-name-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:4px 8px; width:100%; }
.cadre-name-grid > span { white-space:normal; overflow-wrap:anywhere; line-height:1.5; }
.cadre-name-grid > span:only-child { grid-column:1 / -1; }
.student-cadre-role-picker { height:auto; min-height:74px; align-items:stretch; }
.student-cadre-role-picker .student-cadre-select { height:auto; min-height:44px; overflow:visible; }
.student-cadre-role-picker .student-cadre-selection { display:block; flex:1; min-width:0; white-space:normal; overflow:visible; text-overflow:clip; }
.student-cadre-role-picker .student-cadre-select.has-selection .student-assignment-plus { display:none; }
.cadre-weekly-dialog { width:min(740px,calc(100vw - 24px)); }
.cadre-weekly-dialog header small { display:block; font-size:12px; color:var(--muted); margin-top:5px; }
.weekly-enable { display:flex; align-items:center; gap:9px; padding:16px 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:7px; font-size:13px; }
.weekly-dates input { min-width:0; width:100%; height:42px; }
.weekly-explainer { padding:12px; background:var(--surface-soft); border-radius:8px; }
.weekly-role-list section h3 { font-size:13px; margin:18px 0 8px; color:var(--muted); }
.weekly-role-row { display:flex; gap:12px; justify-content:space-between; align-items:center; padding:10px 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:12px 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:6px; flex-shrink:0; }
.weekly-points input { width:64px; min-height:38px; text-align:center; }
.weekly-footer { position:sticky; bottom:-1px; display:flex; justify-content:flex-end; gap:10px; padding:12px 0; background:var(--surface); }
.weekly-footer button { width:auto; min-width:90px; }
#weeklySettingsError { color:var(--accent); }
@media screen and (min-width:1100px) {
  .morality-card { padding:6px 6px 8px; }
  .morality-card-detail .morality-score strong { font-size:25px; line-height:26px; }
  .morality-card-detail h3 { font-size:13px; line-height:15px; }
  .morality-card-actions button { height:25px; min-height:25px; }
}
@media screen and (max-width:760px) {
  .morality-card { padding:10px 10px 12px; }
  .morality-card-detail .morality-score strong { font-size:34px; }
  .rank-score .rank-name { font-size:11px; line-height:15px; }
  .morality-toolbar { gap:5px; }
  .morality-toolbar button { padding:5px 7px; font-size:11px; }
  .morality-header h2 { font-size:18px; }
  .weekly-dates { gap:8px; }
}