/* Cosmos Worksheet Forge. Scoped to .cosmos-wf so the theme is never affected.
   Uses the theme's colour variables, with fallbacks. */
body.cwf-page .content { max-width: var(--max, 1120px); }

.cosmos-wf {
  --w-bg: var(--bg, #0a1633);
  --w-panel: var(--panel, rgba(255,255,255,.04));
  --w-line: var(--panel-border, rgba(255,255,255,.09));
  --w-text: var(--text, #e8ecf6);
  --w-muted: var(--muted, #a7b3d1);
  --w-accent: var(--accent, #f26b1d);
  --w-accent-ink: var(--accent-ink, #fff);
  --w-accent-2: var(--accent-2, #ff9a5c);
  --w-radius: var(--radius, 14px);
  color: var(--w-text);
  line-height: 1.5;
  margin: 0 auto 3rem;
}
.cosmos-wf *, .cosmos-wf *::before, .cosmos-wf *::after { box-sizing: border-box; }
.cosmos-wf button { font: inherit; }

/* Intro */
.cosmos-wf .cwf-intro { margin: 0 0 1.75rem; }
.cosmos-wf .cwf-kicker { margin: 0 0 .35rem; color: var(--w-accent-2); font-size: .82rem; font-weight: 700; letter-spacing: .12em; text-transform: uppercase; }
.cosmos-wf .cwf-title { margin: 0 0 .5rem; font-family: Quicksand, var(--font, system-ui), sans-serif; font-weight: 700; font-size: clamp(1.9rem, 1.3rem + 2vw, 2.7rem); line-height: 1.1; color: #fff; }
.cosmos-wf .cwf-lede { margin: 0; max-width: 66ch; color: var(--w-muted); font-size: 1.05rem; }
.cosmos-wf .cwf-loading { padding: 2rem 0; color: var(--w-muted); }

/* Buttons */
.cosmos-wf .cwf-btn {
  display: inline-flex; align-items: center; justify-content: center; gap: .4rem;
  min-height: 42px; padding: 8px 16px; border-radius: 999px; cursor: pointer;
  background: transparent; color: var(--w-text); border: 1px solid rgba(255,255,255,.22);
  font-weight: 600; font-size: .93rem; text-decoration: none; white-space: nowrap;
  transition: border-color .15s, background .15s, transform .15s;
}
.cosmos-wf .cwf-btn:hover { border-color: rgba(255,255,255,.5); color: #fff; }
.cosmos-wf .cwf-btn[aria-pressed="true"] { border-color: var(--w-accent-2); color: var(--w-accent-2); }
.cosmos-wf .cwf-btn-primary { background: var(--w-accent); border-color: var(--w-accent); color: var(--w-accent-ink); }
.cosmos-wf .cwf-btn-primary:hover { background: #ff7f36; border-color: #ff7f36; color: var(--w-accent-ink); transform: translateY(-1px); }
.cosmos-wf .cwf-btn:disabled { opacity: .45; cursor: not-allowed; transform: none; }
.cosmos-wf .cwf-link { background: none; border: 0; padding: 4px 2px; color: var(--w-accent-2); cursor: pointer; font-size: .9rem; font-weight: 600; }
.cosmos-wf .cwf-link:hover { text-decoration: underline; }
.cosmos-wf :focus-visible { outline: 2px solid var(--w-accent-2); outline-offset: 2px; }

/* Year / course switches */
.cosmos-wf .cwf-controls { display: flex; flex-wrap: wrap; gap: 1rem 2rem; margin: 0 0 1.25rem; }
.cosmos-wf .cwf-control { display: flex; flex-direction: column; gap: .45rem; }
.cosmos-wf .cwf-label { color: var(--w-muted); font-size: .8rem; font-weight: 700; letter-spacing: .08em; text-transform: uppercase; }
.cosmos-wf .cwf-seg { display: inline-flex; gap: 4px; padding: 4px; background: var(--w-panel); border: 1px solid var(--w-line); border-radius: 999px; }
.cosmos-wf .cwf-seg-btn {
  appearance: none; border: 0; margin: 0; cursor: pointer; min-height: 40px;
  padding: .45rem 1.1rem; border-radius: 999px; background: transparent; color: var(--w-muted); font-weight: 600;
  transition: background .15s, color .15s;
}
.cosmos-wf .cwf-seg-btn:hover { color: #fff; }
.cosmos-wf .cwf-seg-btn[aria-pressed="true"] { background: var(--w-accent); color: var(--w-accent-ink); }
.cosmos-wf .cwf-seg-sm .cwf-seg-btn { min-height: 36px; padding: .35rem .9rem; font-size: .9rem; }

/* Topic list */
.cosmos-wf .cwf-panel { background: var(--w-panel); border: 1px solid var(--w-line); border-radius: var(--w-radius); padding: 1rem; }
.cosmos-wf .cwf-list-head { display: flex; justify-content: space-between; align-items: center; gap: 1rem; margin: 0 0 .6rem; }
.cosmos-wf .cwf-list-tools { display: flex; gap: .75rem; }
.cosmos-wf .cwf-search {
  width: 100%; min-height: 46px; padding: .6rem 1rem .6rem 2.6rem; margin: 0 0 .75rem;
  color: var(--w-text); background: rgba(0,0,0,.18) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='18' height='18' fill='none' stroke='%23a7b3d1' stroke-width='2' stroke-linecap='round'%3E%3Ccircle cx='8' cy='8' r='6'/%3E%3Cpath d='m13 13 4 4'/%3E%3C/svg%3E") no-repeat .9rem 50%;
  border: 1px solid var(--w-line); border-radius: 10px; font: inherit; font-size: 1rem;
}
.cosmos-wf .cwf-search::placeholder { color: #7f8bab; }
.cosmos-wf .cwf-search:focus { outline: none; border-color: var(--w-accent-2); }
.cosmos-wf .cwf-chapters, .cosmos-wf .cwf-subs { list-style: none; margin: 0; padding: 0; }
.cosmos-wf .cwf-ch { border-top: 1px solid var(--w-line); }
.cosmos-wf .cwf-group { padding: 1.1rem .4rem .45rem; color: var(--w-accent-2); font-size: .78rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; }
.cosmos-wf .cwf-group:first-child { padding-top: .2rem; }
.cosmos-wf .cwf-group + .cwf-ch { border-top: 0; }
.cosmos-wf .cwf-ch:first-child { border-top: 0; }
.cosmos-wf .cwf-ch-row { display: flex; align-items: center; gap: .5rem; }
.cosmos-wf .cwf-check {
  flex: none; width: 44px; height: 44px; display: grid; place-items: center;
  background: none; border: 0; cursor: pointer; padding: 0;
}
.cosmos-wf .cwf-check::before {
  content: ""; width: 20px; height: 20px; border-radius: 5px; border: 2px solid rgba(255,255,255,.4);
  background: transparent no-repeat center / 14px 14px; transition: background-color .12s, border-color .12s;
}
.cosmos-wf .cwf-check[aria-checked="true"]::before { background-color: var(--w-accent); border-color: var(--w-accent); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' fill='none' stroke='white' stroke-width='2.2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpath d='m2.5 7.5 3 3 6-7'/%3E%3C/svg%3E"); }
.cosmos-wf .cwf-check[aria-checked="mixed"]::before { background-color: var(--w-accent); border-color: var(--w-accent); background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 14 14' stroke='white' stroke-width='2.4' stroke-linecap='round'%3E%3Cpath d='M3 7h8'/%3E%3C/svg%3E"); }
.cosmos-wf .cwf-check:disabled { cursor: default; opacity: .35; }
.cosmos-wf .cwf-ch-toggle {
  flex: 1; min-width: 0; display: flex; align-items: center; gap: .75rem; min-height: 54px;
  padding: .5rem .25rem; background: none; border: 0; color: var(--w-text); text-align: left; cursor: pointer;
}
.cosmos-wf .cwf-ch-num { flex: none; width: 2rem; height: 2rem; display: grid; place-items: center; border-radius: 50%; background: rgba(255,255,255,.07); color: var(--w-accent-2); font-weight: 700; font-size: .9rem; }
.cosmos-wf .cwf-ch.is-on .cwf-ch-num, .cosmos-wf .cwf-ch.is-some .cwf-ch-num { background: rgba(242,107,29,.18); }
.cosmos-wf .cwf-ch-title { flex: 1; min-width: 0; font-weight: 600; font-size: 1.02rem; }
.cosmos-wf .cwf-ch-meta { flex: none; color: var(--w-muted); font-size: .85rem; text-align: right; }
.cosmos-wf .cwf-chev { flex: none; width: 10px; height: 10px; margin: 0 .5rem 0 .25rem; border-right: 2px solid var(--w-muted); border-bottom: 2px solid var(--w-muted); transform: rotate(45deg) translateY(-3px); transition: transform .2s; }
.cosmos-wf .cwf-ch-toggle[aria-expanded="true"] .cwf-chev { transform: rotate(225deg) translate(-2px, -1px); }
.cosmos-wf .cwf-subs { padding: 0 0 .6rem 3.25rem; }
.cosmos-wf .cwf-sub { display: flex; align-items: center; gap: .7rem; min-height: 42px; padding: .3rem .6rem; border-radius: 8px; cursor: pointer; }
.cosmos-wf .cwf-sub:hover { background: rgba(255,255,255,.04); }
.cosmos-wf .cwf-sub input { flex: none; width: 18px; height: 18px; margin: 0; accent-color: var(--w-accent); cursor: pointer; }
.cosmos-wf .cwf-sub-code { flex: none; min-width: 2.2rem; color: var(--w-accent-2); font-weight: 700; font-size: .88rem; }
.cosmos-wf .cwf-sub-title { flex: 1; min-width: 0; }
.cosmos-wf .cwf-sub-n { flex: none; min-width: 2rem; padding: 1px 8px; border-radius: 999px; background: rgba(255,255,255,.07); color: var(--w-muted); font-size: .8rem; text-align: center; }
.cosmos-wf .cwf-sub.is-empty { opacity: .45; cursor: default; }
.cosmos-wf .cwf-sub.is-empty input { cursor: default; }
.cosmos-wf .cwf-empty { padding: 1.25rem .5rem; color: var(--w-muted); }

/* Sticky action bar */
.cosmos-wf .cwf-bar {
  position: sticky; bottom: 12px; z-index: 5; margin: 1rem 0 0;
  display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: .75rem 1.25rem;
  padding: .85rem 1rem; border-radius: var(--w-radius);
  background: rgba(15,31,69,.94); border: 1px solid rgba(255,255,255,.14);
  box-shadow: 0 10px 30px rgba(0,0,0,.35); backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px);
}
.cosmos-wf .cwf-bar-info { display: flex; flex-direction: column; gap: 2px; min-width: 0; }
.cosmos-wf .cwf-sum { font-weight: 600; }
.cosmos-wf .cwf-warn { color: var(--w-accent-2); font-size: .85rem; }
.cosmos-wf .cwf-bar-actions { display: flex; flex-wrap: wrap; align-items: center; gap: .6rem; }
.cosmos-wf .cwf-select {
  min-height: 42px; padding: 0 2rem 0 .9rem; border-radius: 999px; font: inherit; font-size: .9rem;
  color: var(--w-text); background: rgba(0,0,0,.2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='10' height='6' fill='none' stroke='%23a7b3d1' stroke-width='1.6'%3E%3Cpath d='m1 1 4 4 4-4'/%3E%3C/svg%3E") no-repeat right .9rem center;
  border: 1px solid var(--w-line); appearance: none; -webkit-appearance: none; cursor: pointer;
}
.cosmos-wf .cwf-select option { color: #172036; background: #fff; }
.cosmos-wf .cwf-go { min-width: 170px; }

/* Worksheet view */
.cosmos-wf .cwf-tools { display: flex; flex-wrap: wrap; justify-content: space-between; gap: .6rem; margin: 0 0 .75rem; }
.cosmos-wf .cwf-tools-right { display: flex; flex-wrap: wrap; gap: .5rem; }
.cosmos-wf .cwf-status { min-height: 1.4em; margin: 0 0 .5rem; color: var(--w-accent-2); font-size: .9rem; }

.cosmos-wf .cwf-paper {
  max-width: 860px; margin: 0 auto; padding: clamp(18px, 4vw, 48px);
  background: #fff; color: #172036; border-radius: 6px; box-shadow: 0 18px 50px rgba(0,0,0,.45);
}
.cosmos-wf .cwf-paper-head { border-bottom: 2px solid #172036; padding-bottom: 14px; margin-bottom: 8px; }
.cosmos-wf .cwf-brand { display: flex; align-items: baseline; gap: .6rem; color: #586079; font-size: .8rem; letter-spacing: .04em; }
.cosmos-wf .cwf-brand-mark { color: var(--w-accent); font-weight: 800; letter-spacing: .14em; }
.cosmos-wf .cwf-paper-title { margin: .4rem 0 .2rem; font-family: Quicksand, var(--font, system-ui), sans-serif; font-size: clamp(1.3rem, 1rem + 1vw, 1.7rem); line-height: 1.2; color: #172036; }
.cosmos-wf .cwf-paper-topics { margin: 0 0 .8rem; color: #3d4663; font-size: .95rem; }
.cosmos-wf .cwf-paper-meta { display: flex; flex-wrap: wrap; gap: .5rem 1.5rem; align-items: flex-end; font-size: .9rem; font-weight: 600; }
.cosmos-wf .cwf-fill { display: flex; align-items: flex-end; gap: .35rem; flex: 1; min-width: 140px; }
.cosmos-wf .cwf-fill i { flex: 1; border-bottom: 1px solid #8a93ab; height: 1em; }
.cosmos-wf .cwf-section { margin: 1.6rem 0 .4rem; padding: 6px 10px; background: #f0f2f8; border-left: 4px solid var(--w-accent); color: #172036; font-size: 1rem; }
.cosmos-wf .cwf-q { padding: 14px 0 10px; border-bottom: 1px solid #e3e7f0; }
.cosmos-wf .cwf-q:last-of-type { border-bottom: 0; }
.cosmos-wf .cwf-q-top { display: flex; flex-wrap: wrap; align-items: center; gap: .4rem .7rem; margin-bottom: 6px; }
.cosmos-wf .cwf-q-num { flex: none; min-width: 1.9rem; height: 1.9rem; padding: 0 .4rem; display: grid; place-items: center; border-radius: 6px; background: #172036; color: #fff; font-weight: 700; font-size: .9rem; }
.cosmos-wf .cwf-q-src { font-weight: 700; font-size: .9rem; color: #172036; }
.cosmos-wf .cwf-q-tags { display: flex; flex-wrap: wrap; gap: .3rem; margin-left: auto; }
.cosmos-wf .cwf-tag { padding: 2px 9px; border-radius: 999px; background: #fff1e8; color: #a8430a; font-size: .76rem; font-weight: 600; text-decoration: none; }
.cosmos-wf a.cwf-tag:hover { background: #ffe0cc; }
.cosmos-wf .cwf-img { display: block; width: 100%; max-width: 100%; height: auto; }
.cosmos-wf .cwf-space { display: none; }
.cosmos-wf .cwf-ans { margin: 4px 0 0 2.6rem; font-size: 1rem; color: #172036; }
.cosmos-wf .cwf-ans strong { display: inline-grid; place-items: center; width: 1.8rem; height: 1.8rem; margin-left: .3rem; border-radius: 50%; background: #e6f6ee; color: #1d7a4f; }
.cosmos-wf .cwf-sol-head { margin-top: 2.4rem; border-left-color: #2f9e6b; }
.cosmos-wf .cwf-paper-foot { margin-top: 1.6rem; padding-top: 10px; border-top: 1px solid #e3e7f0; color: #6b7390; font-size: .78rem; }

@media (max-width: 640px) {
  .cosmos-wf .cwf-panel { padding: .6rem; }
  .cosmos-wf .cwf-ch-meta { font-size: .74rem; max-width: 5.5rem; }
  .cosmos-wf .cwf-ch-toggle { gap: .55rem; }
  .cosmos-wf .cwf-ch-on { display: none; }
  .cosmos-wf .cwf-subs { padding-left: .5rem; }
  .cosmos-wf .cwf-bar { bottom: 8px; padding: .65rem .75rem; gap: .5rem; }
  .cosmos-wf .cwf-sum { font-size: .9rem; }
  .cosmos-wf .cwf-bar-actions { gap: .45rem; }
  .cosmos-wf .cwf-seg-sm .cwf-seg-btn { padding: .3rem .7rem; font-size: .85rem; }
  .cosmos-wf .cwf-select { min-width: 0; font-size: .85rem; padding-right: 1.8rem; }
  .cosmos-wf .cwf-bar-actions { width: 100%; }
  .cosmos-wf .cwf-go { flex: 1 1 100%; }
  .cosmos-wf .cwf-select { flex: 1; }
  .cosmos-wf .cwf-go { min-height: 44px; }
  .cosmos-wf .cwf-tools-right { width: 100%; }
  .cosmos-wf .cwf-tools-right .cwf-btn { flex: 1 1 auto; }
  .cosmos-wf .cwf-q-tags { margin-left: 0; width: 100%; }
  .cosmos-wf .cwf-paper { border-radius: 4px; padding: 16px 12px; }
  /* Keep exam text readable on phones: wide questions scroll sideways instead of shrinking. */
  .cosmos-wf .cwf-imgwrap { overflow-x: auto; -webkit-overflow-scrolling: touch; margin: 0 -12px; padding: 0 12px; }
  .cosmos-wf .cwf-imgwrap .cwf-img { width: 540px; max-width: none; }
}
@media (prefers-reduced-motion: reduce) { .cosmos-wf * { transition: none !important; } }
