/*@3.COUC.1*/

/*@3.COUC.2*/

/*@3.COUC.3*/
.crs-wrap {
  --crs-top: calc(64px + var(--sa-t));
  --crs-gap: 1.1rem;
  max-width: 1180px;
  margin: 0 auto;
  padding: 1.4rem 1rem 5rem;
}

/*@3.COUC.4*/

/*@3.COUC.5*/
.crs-wrap, .crs-dlg {
  --crs-c: var(--course-color, var(--st-accent, #a78bfa));
  --tint-ink: #ffffff;
  --tint-fill: 15%;
  --tint-on: var(--crs-c);
  --tint-exam: var(--st-danger, #ef4444);
}
:root[data-theme="light"] .crs-wrap,
:root[data-theme="light"] .crs-dlg {
  --tint-ink: #0f1720;
  --tint-fill: 13%;
}

/*@3.COUC.6*/
:where(.crs-wrap, .crs-dlg) :where(button) {
  font: inherit;
  color: inherit;
  background: none;
  border: none;
  margin: 0;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

/*@3.COUC.7*/

.crs-head {
  position: relative;
  padding: .6rem 0 1.1rem;
  isolation: isolate;
}
/*@3.COUC.8*/
.crs-head::before {
  content: '';
  position: absolute;
  inset-block-start: -2.2rem;
  inset-inline-start: -3rem;
  width: 22rem; height: 12rem;
  z-index: -1;
  pointer-events: none;
  background: radial-gradient(closest-side,
    color-mix(in srgb, var(--crs-c) 16%, transparent), transparent 75%);
}
[dir="ltr"] .crs-head::before { inset-inline-start: auto; inset-inline-end: -3rem; }
[data-theme="light"] .crs-head::before { opacity: .55; }

.crs-head-row { display: flex; align-items: flex-start; gap: .75rem; flex-wrap: wrap; }
.crs-head-t { flex: 1 1 16rem; min-width: 0; }

/*@3.COUC.9*/
.crs-code {
  display: inline-flex; align-items: center;
  padding: .12rem .45rem;
  border-radius: var(--radius-sm);
  background: color-mix(in srgb, var(--crs-c) 16%, transparent);
  color: color-mix(in srgb, var(--crs-c) 78%, var(--tint-ink));
  font-family: 'JetBrains Mono', monospace;
  font-size: .74rem; font-weight: 800;
  direction: ltr; unicode-bidi: isolate;
}
.crs-code[hidden] { display: none; }

/*@3.COUC.10*/
.crs-title {
  display: flex; align-items: center; gap: .5rem; flex-wrap: wrap;
  font-family: 'Cairo', sans-serif; font-weight: 800;
  font-size: clamp(1.4rem, 3.4vw, 1.9rem);
  margin: .35rem 0 .3rem;
}
[dir="ltr"] .crs-title { font-family: 'Inter', 'Cairo', sans-serif; }
.crs-title-x {
  min-width: 0;
  background: linear-gradient(135deg, var(--text-primary) 30%, var(--crs-c) 100%);
  -webkit-background-clip: text; -webkit-text-fill-color: transparent;
  background-clip: text;
}
.crs-sub {
  display: flex; align-items: center; flex-wrap: wrap; gap: .35rem .7rem;
  color: var(--text-muted); font-size: .86rem; margin: 0;
}
.crs-sub b { color: var(--text-secondary); font-weight: 700; }
.crs-sub .ltr { direction: ltr; unicode-bidi: isolate; }

.crs-head-a { display: flex; gap: .4rem; flex-wrap: wrap; align-items: center; }

/*@3.COUC.11*/

/*@3.COUC.12*/
.crs-wrap, .crs-dlg { --crs-btn-h: 2.2rem; }
/*@3.COUC.13*/
@media (pointer: coarse) { .crs-wrap, .crs-dlg { --crs-btn-h: 44px; } }

.crs-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: var(--crs-btn-h, 2.2rem);
  padding: .3rem .8rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-card);
  color: var(--text-secondary);
  font-size: .78rem; font-weight: 700;
  text-decoration: none; white-space: nowrap;
  transition: color .18s, border-color .18s, background-color .18s, transform .18s;
}
.crs-btn[hidden] { display: none; }
.crs-btn:hover { color: var(--text-primary); border-color: var(--text-secondary); transform: translateY(-1px); }
.crs-btn:active { transform: scale(.96); }
.crs-btn i { font-size: .78rem; color: var(--text-muted); transition: color .18s; }
.crs-btn:hover i { color: var(--crs-c); }

/*@3.COUC.14*/
.crs-btn--ico {
  position: relative;
  padding: .3rem;
  width: var(--crs-btn-h, 2.2rem);   /*@3.COUC.15*/
  flex: 0 0 auto;
  overflow: hidden;
}
.crs-btn--ico::after {
  content: '';
  position: absolute; inset-inline: 0; inset-block-end: 0;
  height: 2px;
  background: var(--crs-sw, var(--crs-c));
  transition: height .18s;
}
.crs-btn--ico:hover::after { height: 3px; }

/*@3.COUC.16*/
.crs-btn--primary {
  background: var(--crs-c);
  border-color: var(--crs-c);
  color: #fff;
}
.crs-btn--primary i { color: #fff; }
.crs-btn--primary:hover {
  color: #fff;
  background: color-mix(in srgb, var(--crs-c) 85%, #000);
  border-color: color-mix(in srgb, var(--crs-c) 85%, #000);
}
.crs-btn--primary:hover i { color: #fff; }
.crs-btn--danger { color: var(--st-danger, #ef4444); }
.crs-btn--danger i { color: var(--st-danger, #ef4444); }
.crs-btn--danger:hover { border-color: var(--st-danger, #ef4444); color: var(--st-danger, #ef4444); }

.crs-ico {
  display: inline-flex; align-items: center; justify-content: center;
  width: 2rem; height: 2rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-card);
  color: var(--text-muted);
  transition: color .18s, border-color .18s;
}
.crs-ico[hidden] { display: none; }
.crs-ico:hover { color: var(--crs-c); border-color: var(--crs-c); }
.crs-ico--danger:hover { color: var(--st-danger, #ef4444); border-color: var(--st-danger, #ef4444); }

/*@3.COUC.17*/

.crs-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(8.5rem, 1fr));
  gap: .55rem;
  margin-bottom: var(--crs-gap);
}
.crs-stat {
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-card);
  padding: .7rem .8rem;
  min-width: 0;
}
/*@3.COUC.18*/
a.crs-stat, button.crs-stat { display: block; text-decoration: none; transition: border-color .18s, transform .18s; }
button.crs-stat { inline-size: 100%; text-align: start; }
a.crs-stat:hover, button.crs-stat:hover { border-color: var(--crs-c); transform: translateY(-2px); }
.crs-stat-k {
  font-size: .64rem; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: var(--text-muted);
  display: flex; align-items: center; gap: .3rem;
}
.crs-stat-v {
  font-size: 1.5rem; font-weight: 900; line-height: 1.25;
  color: var(--text-primary);
  font-variant-numeric: tabular-nums;
}
.crs-stat-v small { font-size: .72rem; font-weight: 700; color: var(--text-muted); }
/*@3.COUC.19*/
.crs-bar {
  display: block;
  height: 4px; margin-top: .4rem;
  border-radius: var(--radius-pill);
  background: var(--bg-elevated);
  overflow: hidden;
}
.crs-bar > i {
  display: block; height: 100%;
  border-radius: var(--radius-pill);
  background: var(--fill, var(--crs-c));
  transition: inline-size .6s var(--skin-ease-out, ease-out);
}

/*@3.COUC.20*/
.crs-quick {
  display: flex; flex-wrap: wrap; gap: .5rem;
  justify-content: center;
  margin-bottom: var(--crs-gap);
}
.crs-quick[hidden] { display: none; }

.crs-q {
  display: inline-flex; align-items: center; justify-content: center; gap: .5rem;
  min-height: 2.55rem;
  padding: .4rem 1.05rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-card);
  box-shadow: 0 1px 2px var(--shadow-base);
  color: var(--text-secondary);
  font-size: .82rem; font-weight: 700;
  text-decoration: none; white-space: nowrap;
  transition: color .18s, border-color .18s, transform .18s, box-shadow .18s;
}
.crs-q i { font-size: .82rem; color: var(--text-muted); transition: color .18s; }
.crs-q:hover {
  color: var(--text-primary);
  border-color: var(--crs-c);
  transform: translateY(-2px);
  box-shadow: 0 8px 18px -8px var(--brand-glow, var(--shadow-base));
}
.crs-q:hover i { color: var(--crs-c); }
.crs-q:active { transform: scale(.97); }
@media (pointer: coarse) { .crs-q { min-height: 44px; } }

/*@3.COUC.21*/

/*@3.COUC.22*/
.crs-layout { display: grid; grid-template-columns: 1fr; gap: var(--crs-gap); }
/*@3.COUC.23*/
@media (min-width: 1240px) {
  .crs-layout { grid-template-columns: 210px minmax(0, 1fr); gap: 1.6rem; }
}

.crs-rail-wrap { min-width: 0; }
.crs-rail {
  position: sticky;
  top: calc(var(--crs-top) + .6rem);
  display: flex; flex-direction: column; gap: .12rem;
  padding: .45rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-xl);
  background: var(--bg-card);
}
.crs-rail-lbl {
  font-size: .64rem; font-weight: 800; letter-spacing: .06em;
  text-transform: uppercase; color: var(--text-muted);
  padding: .45rem .6rem .3rem;
}
.crs-rail-item {
  display: flex; align-items: center; gap: .55rem;
  width: 100%;
  padding: .48rem .55rem;
  border: 1px solid transparent;
  border-radius: var(--radius-md);
  color: var(--text-secondary);
  font-family: 'Cairo', sans-serif;
  font-size: .82rem; font-weight: 700;
  text-align: start;
  transition: color .18s, background-color .18s, border-color .18s;
}
[dir="ltr"] .crs-rail-item { font-family: 'Inter', 'Cairo', sans-serif; }
.crs-rail-s { display: none; }   /*@3.COUC.24*/
.crs-rail-item i {
  flex: none;
  width: 26px; height: 26px;
  display: grid; place-items: center;
  border-radius: var(--radius-sm);
  background: var(--bg-elevated);
  color: var(--text-muted);
  font-size: .76rem;
  transition: color .18s, background-color .18s;
}
.crs-rail-item:hover { color: var(--text-primary); background: var(--bg-elevated); }
.crs-rail-item:hover i { color: var(--crs-c); }
/*@3.COUC.25*/
.crs-rail-item.is-on {
  --tint: var(--tint-on);
  background: color-mix(in srgb, var(--tint) var(--tint-fill), transparent);
  color: color-mix(in srgb, var(--tint) 72%, var(--tint-ink));
  border-color: color-mix(in srgb, var(--tint) 30%, transparent);
  font-weight: 800;
}
.crs-rail-item.is-on i {
  background: color-mix(in srgb, var(--tint) 22%, transparent);
  color: color-mix(in srgb, var(--tint) 82%, var(--tint-ink));
}
/*@3.COUC.26*/
@media (max-width: 1239px) {
  .crs-rail-wrap { position: sticky; top: calc(var(--crs-top) + .35rem); z-index: 30; }
  .crs-rail {
    position: static;
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(4rem, 1fr));
    gap: .3rem;
    border-radius: var(--radius-lg);
    box-shadow: 0 2px 10px rgba(0, 0, 0, .12);
  }
  .crs-rail-lbl { display: none; }
  .crs-rail-item {
    justify-content: center;
    padding: .45rem .3rem;
    border-radius: var(--radius-md);
    font-size: .75rem;
    text-align: center;
  }
  .crs-rail-item i { display: none; }
  .crs-rail-n { display: none; }
  .crs-rail-s { display: inline; }
  .crs-sec { scroll-margin-top: 3.9rem; }
}

.crs-main { display: grid; gap: var(--crs-gap); min-width: 0; }

/*@3.COUC.27*/

.crs-sec {
  border: 1px solid var(--border-color);
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  overflow: hidden;
  /*@3.COUC.28*/
  scroll-margin-top: .6rem;
}
.crs-sec[hidden] { display: none; }
.crs-sec-head {
  display: flex; align-items: flex-start; gap: .7rem;
  padding: .95rem 1.1rem;
  border-block-end: 1px solid var(--border-color);
}
.crs-sec-ic {
  flex: none;
  width: 32px; height: 32px;
  display: grid; place-items: center;
  border-radius: var(--radius-md);
  background: var(--bg-elevated);
  color: var(--crs-c);
  font-size: .84rem;
}
.crs-sec-t { margin: 0; font-size: 1rem; font-weight: 800; color: var(--text-primary); }
.crs-sec-d { margin: .2rem 0 0; font-size: .78rem; color: var(--text-muted); }
.crs-sec-a { margin-inline-start: auto; display: flex; gap: .4rem; align-items: center; flex-wrap: wrap; }
.crs-sec-body { padding: 1rem 1.1rem 1.1rem; }

/*@3.COUC.29*/
.crs-r {
  display: flex; align-items: center; gap: .55rem;
  min-height: 2.5rem;
  padding: .3rem 0;
}
.crs-r + .crs-r { border-block-start: 1px solid color-mix(in srgb, var(--border-color) 60%, transparent); }
.crs-r.is-empty { opacity: .32; }
.crs-r > i:first-child {
  flex: none; width: 1.1rem; text-align: center;
  color: var(--text-muted); font-size: .8rem;
}
.crs-r-b { flex: 1 1 auto; min-width: 0; }
.crs-r-t {
  display: block;
  font-size: .82rem; font-weight: 700; color: var(--text-primary);
  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;
}
/*@3.COUC.30*/
.crs-r-s { display: block; font-size: .7rem; color: var(--text-muted); margin-top: .05rem; }
.crs-r-e { flex: none; display: flex; align-items: center; gap: .35rem; }
.crs-r-t .ltr, .crs-r-s .ltr { direction: ltr; unicode-bidi: isolate; }

/*@3.COUC.31*/

.crs-chips { display: flex; flex-wrap: wrap; gap: .35rem; margin-bottom: .85rem; }
.crs-chip {
  display: inline-flex; align-items: center; gap: .3rem;
  padding: .28rem .6rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-elevated);
  color: var(--text-secondary);
  font-size: .74rem; font-weight: 700;
  transition: color .18s, background-color .18s, border-color .18s;
}
.crs-chip[hidden] { display: none; }
.crs-chip.is-on {
  --tint: var(--tint-on);
  background: color-mix(in srgb, var(--tint) var(--tint-fill), transparent);
  color: color-mix(in srgb, var(--tint) 72%, var(--tint-ink));
  border-color: color-mix(in srgb, var(--tint) 30%, transparent);
}

.crs-badge {
  display: inline-flex; align-items: center; gap: .25rem;
  padding: .16rem .5rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-elevated);
  color: var(--text-muted);
  font-size: .68rem; font-weight: 800;
  white-space: nowrap;
}
.crs-badge[hidden] { display: none; }
.crs-badge[data-tone="ok"]   { color: var(--st-ok, #10b981);     border-color: color-mix(in srgb, var(--st-ok, #10b981) 35%, transparent); }
.crs-badge[data-tone="mid"]  { color: var(--st-warn, #f59e0b);   border-color: color-mix(in srgb, var(--st-warn, #f59e0b) 35%, transparent); }
.crs-badge[data-tone="bad"]  { color: var(--st-danger, #ef4444); border-color: color-mix(in srgb, var(--st-danger, #ef4444) 35%, transparent); }

.crs-rate {
  display: inline-flex; align-items: baseline; gap: .2rem;
  font-family: 'JetBrains Mono', monospace; font-weight: 800;
  direction: ltr; unicode-bidi: isolate;
}
.crs-rate b { font-size: .78rem; }
.crs-rate small { color: var(--text-muted); font-weight: 600; }
.crs-rate[data-tone="ok"]   { color: var(--st-ok, #10b981); }
.crs-rate[data-tone="mid"]  { color: var(--st-warn, #f59e0b); }
.crs-rate[data-tone="bad"]  { color: var(--st-danger, #ef4444); }

/*@3.COUC.32*/

.crs-mods {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(4.6rem, 1fr));
  gap: .4rem;
}
.crs-mod {
  position: relative;
  display: grid; gap: .18rem; justify-items: center;
  padding: .55rem .3rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-elevated);
  color: var(--text-secondary);
  text-decoration: none;
  transition: border-color .18s, transform .18s;
}
.crs-mod:hover { border-color: var(--crs-c); transform: translateY(-2px); }
.crs-mod-n { font-family: 'JetBrains Mono', monospace; font-size: .78rem; font-weight: 800; color: var(--text-primary); }
.crs-mod-d { font-size: .64rem; font-weight: 800; color: var(--text-muted); }
/*@3.COUC.33*/
.crs-mod[data-due="1"] {
  --tint: var(--st-warn, #f59e0b);
  background: color-mix(in srgb, var(--tint) var(--tint-fill), transparent);
  border-color: color-mix(in srgb, var(--tint) 32%, transparent);
}
.crs-mod[data-due="1"] .crs-mod-d { color: color-mix(in srgb, var(--tint) 74%, var(--tint-ink)); }
/*@3.COUC.34*/
.crs-mod-b { display: block; width: 100%; height: 3px; border-radius: var(--radius-pill); background: var(--bg-card); overflow: hidden; }
.crs-mod-b > i { display: block; height: 100%; background: var(--fill, var(--text-muted)); }
.crs-mod-k { position: absolute; inset-block-start: .3rem; inset-inline-end: .3rem; font-size: .62rem; color: var(--text-muted); }
.crs-mod[data-mark="mastered"] .crs-mod-k { color: var(--st-ok, #10b981); }
.crs-mod[data-mark="unmastered"] .crs-mod-k { color: var(--st-danger, #ef4444); }

/*@3.COUC.50*/
.crs-mod-sheet { display: grid; gap: .8rem; }
.crs-mod-go { inline-size: 100%; min-height: 2.8rem; font-size: .88rem; }
.crs-mod-sum {
  display: grid; grid-template-columns: auto 1fr; gap: .9rem; align-items: center;
  padding: .8rem .9rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg, 14px);
  background: var(--bg-elevated);
}
.crs-mod-pct { display: grid; justify-items: center; gap: .15rem; min-inline-size: 5.2rem; text-align: center; }
.crs-mod-pct b { font-family: 'JetBrains Mono', monospace; font-size: 1.5rem; font-weight: 800; color: var(--fill, var(--text-primary)); line-height: 1.1; }
.crs-mod-pct span { font-size: .68rem; font-weight: 700; color: var(--text-muted); line-height: 1.4; }
.crs-mod-why { list-style: none; margin: 0; padding: 0; display: grid; gap: .3rem; font-size: .76rem; color: var(--text-secondary); }
.crs-mod-why li { display: flex; align-items: baseline; gap: .45rem; }
.crs-mod-why i { flex: none; font-size: .7rem; color: var(--text-muted); }
.crs-mod-why li.is-on i { color: var(--st-ok, #10b981); }
.crs-mod-why bdi { font-family: 'JetBrains Mono', monospace; font-weight: 800; color: var(--text-primary); }
.crs-mod-q { margin: .2rem 0 -.3rem; }
.crs-mod-marks { --tint-on: var(--st-ok, #10b981); display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: .4rem; }
.crs-mod-marks .crs-chip { justify-content: center; min-height: var(--crs-btn-h, 2.2rem); border-radius: var(--radius-md); }
.crs-mod-marks .crs-chip:hover:not(.is-on) { border-color: var(--text-secondary); color: var(--text-primary); }
.crs-mod-note { margin: 0; font-size: .74rem; line-height: 1.7; color: var(--text-muted); }
.crs-mod-wipe { justify-self: start; }
@media (max-width: 420px) { .crs-mod-sum { grid-template-columns: 1fr; } }

/*@3.COUC.35*/

.crs-pred {
  display: grid; gap: .9rem;
  grid-template-columns: 1fr;
}
@media (min-width: 700px) { .crs-pred { grid-template-columns: minmax(0, 15rem) minmax(0, 1fr); align-items: start; } }

.crs-pred-box {
  padding: .95rem 1rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-lg);
  background: var(--bg-elevated);
  text-align: center;
}
.crs-pred-k {
  font-size: .64rem; font-weight: 800; letter-spacing: .05em;
  text-transform: uppercase; color: var(--text-muted);
}
.crs-pred-v {
  font-size: 2.4rem; font-weight: 900; line-height: 1.1;
  color: var(--pred, var(--text-primary));
  font-variant-numeric: tabular-nums;
}
.crs-pred-v small { font-size: .9rem; font-weight: 800; }
.crs-pred-g {
  display: inline-flex; align-items: center; gap: .3rem;
  margin-top: .3rem; padding: .2rem .6rem;
  border-radius: var(--radius-pill);
  background: color-mix(in srgb, var(--pred, var(--crs-c)) 16%, transparent);
  color: color-mix(in srgb, var(--pred, var(--crs-c)) 78%, var(--tint-ink));
  font-family: 'JetBrains Mono', monospace;
  font-size: .8rem; font-weight: 800;
  direction: ltr; unicode-bidi: isolate;
}
.crs-pred-rng { margin-top: .55rem; font-size: .72rem; color: var(--text-muted); font-variant-numeric: tabular-nums; }

/*@3.COUC.36*/
.crs-range {
  position: relative;
  height: 8px; margin: .5rem 0 .2rem;
  border-radius: var(--radius-pill);
  background: var(--bg-card);
  overflow: hidden;
}
.crs-range > i {
  position: absolute; inset-block: 0;
  background: color-mix(in srgb, var(--pred, var(--crs-c)) 45%, transparent);
}
.crs-range > b {
  position: absolute; inset-block: -2px;
  width: 3px; border-radius: 2px;
  background: var(--pred, var(--crs-c));
}
/*@3.COUC.37*/
.crs-range > u {
  position: absolute; inset-block: -3px;
  width: 0; border-inline-start: 2px dashed var(--text-muted);
}

.crs-verdict {
  display: flex; align-items: flex-start; gap: .55rem;
  padding: .7rem .8rem;
  border: 1px solid var(--border-color);
  border-inline-start: 3px solid var(--tone, var(--text-muted));
  border-radius: var(--radius-md);
  background: var(--bg-elevated);
  font-size: .8rem; color: var(--text-secondary);
  line-height: 1.6;
}
.crs-verdict i { color: var(--tone, var(--text-muted)); margin-block-start: .2rem; }
.crs-verdict b { color: var(--text-primary); }

/*@3.COUC.38*/
.crs-ev { width: 100%; border-collapse: collapse; font-size: .76rem; }
.crs-ev th {
  text-align: start; padding: .35rem .4rem;
  font-size: .64rem; font-weight: 800; letter-spacing: .04em;
  text-transform: uppercase; color: var(--text-muted);
  border-block-end: 1px solid var(--border-color);
  white-space: nowrap;
}
.crs-ev td {
  padding: .4rem;
  border-block-end: 1px solid color-mix(in srgb, var(--border-color) 55%, transparent);
  color: var(--text-secondary);
  font-variant-numeric: tabular-nums;
}
.crs-ev tr:last-child td { border-block-end: 0; }
.crs-ev .crs-ev-n { color: var(--text-primary); font-weight: 800; }
.crs-ev .crs-ev-w { color: var(--text-muted); font-size: .7rem; }
.crs-ev-up { color: var(--st-ok, #10b981); }
.crs-ev-dn { color: var(--st-danger, #ef4444); }
/*@3.COUC.39*/
.crs-ev .ltr { display: inline-block; direction: ltr; unicode-bidi: isolate; }
.crs-ev-wrap { overflow-x: auto; }

/*@3.COUC.40*/

.crs-tl { list-style: none; margin: 0; padding: 0; display: grid; gap: .5rem; }
.crs-tl li {
  display: flex; gap: .6rem; align-items: flex-start;
  padding-inline-start: .7rem;
  border-inline-start: 2px solid var(--border-color);
}
.crs-tl-when { flex: none; font-size: .7rem; color: var(--text-muted); font-variant-numeric: tabular-nums; min-width: 5.2rem; }
.crs-tl-what { font-size: .78rem; color: var(--text-secondary); }
.crs-tl-what b { color: var(--text-primary); display: block; }

/*@3.COUC.41*/

.crs-empty {
  display: grid; gap: .45rem; justify-items: center;
  padding: 1.6rem 1rem;
  color: var(--text-muted); text-align: center;
}
.crs-empty i { font-size: 1.4rem; opacity: .55; }
.crs-empty p { margin: 0; font-size: .8rem; max-width: 34rem; line-height: 1.7; }

.crs-sk {
  border-radius: var(--radius-md);
  background: var(--bg-elevated);
  animation: crsSk 1.4s ease-in-out infinite;
}
@keyframes crsSk { 0%, 100% { opacity: .45; } 50% { opacity: .85; } }
@media (prefers-reduced-motion: reduce) { .crs-sk { animation: none; } }

/*@3.COUC.42*/

/*@3.COUC.49*/
.crs-dlg[open] { display: flex; flex-direction: column; }
.crs-dlg > .crs-dlg-h, .crs-dlg > .crs-dlg-f { flex: none; }
.crs-dlg {
  /*@3.COUC.43*/
  margin: auto;
  width: min(560px, calc(100vw - 2rem));
  max-height: 86vh;
  padding: 0;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-xl);
  background: var(--bg-card);
  color: var(--text-primary);
  overflow: hidden;
}
.crs-dlg::backdrop { background: rgba(0, 0, 0, .6); backdrop-filter: blur(4px); }
.crs-dlg-h {
  display: flex; align-items: center; gap: .6rem;
  padding: .9rem 1rem;
  border-block-end: 1px solid var(--border-color);
}
.crs-dlg-t { flex: 1 1 auto; margin: 0; font-size: .98rem; font-weight: 800; }
.crs-dlg-b {
  padding: 1rem;
  flex: 1 1 auto; min-block-size: 0;
  overflow-y: auto; overscroll-behavior: contain;
}
.crs-dlg-f {
  display: flex; justify-content: flex-end; gap: .45rem; flex-wrap: wrap;
  padding: .8rem 1rem;
  border-block-start: 1px solid var(--border-color);
}

/*@3.COUC.44*/

.crs-in, .crs-ta, .crs-sel {
  width: 100%;
  padding: .5rem .75rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-md);
  background: var(--bg-elevated);
  color: var(--text-primary);
  font-family: 'Cairo', sans-serif;
  font-size: .84rem; font-weight: 600;
  transition: border-color .18s, box-shadow .18s;
}
[dir="ltr"] .crs-in, [dir="ltr"] .crs-ta, [dir="ltr"] .crs-sel { font-family: 'Inter', 'Cairo', sans-serif; }
.crs-ta { min-height: 7rem; resize: vertical; line-height: 1.7; }
.crs-in.ltr { direction: ltr; unicode-bidi: isolate; text-align: start; }
.crs-in:focus, .crs-ta:focus, .crs-sel:focus {
  outline: none;
  border-color: var(--crs-c);
  box-shadow: 0 0 0 3px color-mix(in srgb, var(--crs-c) 18%, transparent);
}
.crs-in::placeholder, .crs-ta::placeholder { color: var(--text-muted); font-weight: 500; }
.crs-lbl {
  display: block;
  font-size: .7rem; font-weight: 800;
  color: var(--text-muted);
  margin-bottom: .3rem;
}
.crs-field + .crs-field { margin-top: .8rem; }
.crs-two { display: grid; grid-template-columns: 1fr; gap: .5rem; }
.crs-allday {
  display: flex; align-items: center; gap: .4rem;
  margin-block-start: .4rem;
  font-size: .74rem; font-weight: 600; color: var(--text-secondary);
  cursor: pointer;
}
.crs-allday input { inline-size: 16px; block-size: 16px; margin: 0; accent-color: var(--crs-c); cursor: pointer; }
.crs-in:disabled { opacity: .55; cursor: not-allowed; }
@media (min-width: 520px) { .crs-two { grid-template-columns: 1fr 1fr; } }

/*@3.COUC.45*/

/*@3.COUC.46*/
.crs-toast[hidden] { display: none; }
.crs-toast {
  position: fixed;
  inset-inline: 0;
  bottom: calc(4.6rem + var(--sa-b));
  z-index: 3000;
  display: flex; justify-content: center;
  pointer-events: none;
}
.crs-toast > span {
  padding: .5rem 1.1rem;
  border: 1px solid var(--border-color);
  border-radius: var(--radius-pill);
  background: var(--bg-elevated);
  color: var(--text-primary);
  font-size: .8rem; font-weight: 700;
  box-shadow: 0 8px 24px var(--shadow-base);
}

/*@3.COUC.47*/

@media (max-width: 560px) {
  .crs-wrap { padding-inline: .8rem; }
  /*@3.COUC.48*/
  .crs-ico, .crs-chip, .crs-rail-item { min-height: 40px; }
  .crs-sec-body { padding: .85rem .9rem 1rem; }
  .crs-pred-v { font-size: 2rem; }
}
