@font-face{
  font-family:"IBM Plex Sans Local";
  src:url("../vendor/fonts/IBMPlexSans-SemiBold.ttf") format("truetype");
  font-weight:600;
  font-style:normal;
  font-display:swap
}

:root{
  /* Kept as literal hex values: tools/build_og.mjs extracts these names. */
  --green:#087a45;
  --ink:#17211c;
  --muted:#5f6b64;
  --sg-canvas:#f7f9f7;
  --sg-paper:#fff;
  --sg-ink:#17211c;
  --sg-muted:#5f6b64;
  --sg-line:#d6ded9;
  --sg-line-strong:#b9c7bf;
  --sg-green:#087a45;
  --sg-green-hover:#066438;
  --sg-green-soft:#e8f3ec;
  --sg-green-faint:#f1f6f3;
  --sg-attention:#7a5907;
  --sg-attention-soft:#fff4d6;
  --sg-blue:#2455a6;
  --sg-danger:#b42318;
  --sg-danger-soft:#fff1f0;
  --sg-r-sm:4px;
  --sg-r-control:6px;
  --sg-r-panel:8px;
  --sg-r-dialog:12px;
  --sg-fast:120ms;
  font-family:"Segoe UI",ui-sans-serif,system-ui,-apple-system,BlinkMacSystemFont,sans-serif;
  color:var(--sg-ink);
  background:var(--sg-canvas);
  color-scheme:light;
  font-synthesis:none
}

*{box-sizing:border-box}
html,body{min-height:100%}
html{scroll-behavior:smooth}
body{
  margin:0;
  background:var(--sg-canvas);
  color:var(--sg-ink);
  font-size:15px;
  line-height:1.5;
  -webkit-font-smoothing:antialiased;
  text-rendering:optimizeLegibility
}
#studygroups,#privacy{min-height:100vh;display:flex;flex-direction:column}
[v-cloak]{display:none!important}
::selection{background:#bfe2cc;color:#063d25}
*{scrollbar-color:#98aa9f #edf2ef;scrollbar-width:thin}
button,input,select,textarea{font:inherit;color:inherit}
button{cursor:pointer}
button:disabled{cursor:not-allowed;opacity:.48}
button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,
a:focus-visible,summary:focus-visible{
  outline:2px solid var(--sg-green);
  outline-offset:2px
}
input,select,textarea{caret-color:var(--sg-green)}
a{
  color:var(--sg-green);
  text-decoration-color:transparent;
  text-underline-offset:3px;
  transition:color var(--sg-fast) ease-out,text-decoration-color var(--sg-fast) ease-out
}
a:hover{text-decoration-color:currentColor}
h1,h2,h3,p{overflow-wrap:anywhere}
.muted{color:var(--sg-muted);font-size:13px}

/* Header and portal navigation */
.sb-topbar{
  min-height:64px;
  padding:0 max(20px,calc((100vw - 1180px)/2));
  display:flex;
  align-items:center;
  gap:clamp(18px,3vw,44px);
  background:var(--sg-paper);
  border-bottom:1px solid var(--sg-line);
  position:sticky;
  top:0;
  z-index:40
}
.sb-lead{display:flex;align-items:center;gap:14px;min-width:0;flex:none}
.sb-brand{display:flex;align-items:center;gap:11px;color:var(--sg-ink);text-decoration:none;min-width:0}
.sb-brand:hover{text-decoration:none}
.sb-brand>span:last-child{display:flex;flex-direction:column;line-height:1.15;min-width:0}
.sb-brand b{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:18px;
  font-weight:600;
  letter-spacing:-.015em;
  white-space:nowrap
}
.sb-brand small{color:var(--sg-muted);font-size:11px;margin-top:3px;white-space:nowrap}
.sb-mark{display:grid;place-items:center;width:36px;height:36px;flex:none}
.sb-mark svg{width:100%;height:100%;display:block}
.terms-mark{display:grid;place-items:center;border-radius:8px;background:var(--sg-green);color:#fff;font:600 12px "IBM Plex Sans Local","Segoe UI",sans-serif;letter-spacing:.04em}
.sb-back{
  display:inline-flex;
  align-items:center;
  gap:7px;
  min-height:40px;
  padding:0 10px;
  border:0;
  border-radius:var(--sg-r-control);
  color:var(--sg-muted);
  text-decoration:none;
  font-size:13px;
  font-weight:500;
  white-space:nowrap
}
.sb-back:hover{background:var(--sg-green-faint);color:var(--sg-green);text-decoration:none}
.portal-nav{
  align-self:stretch;
  display:flex;
  align-items:stretch;
  gap:clamp(18px,3vw,40px);
  min-width:0
}
.portal-nav button,.portal-nav a{
  position:relative;
  min-height:0;
  padding:0 2px;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--sg-muted);
  font-size:14px;
  font-weight:500;
  white-space:nowrap;
  text-decoration:none
}
.portal-nav button::after,.portal-nav a::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:transparent
}
.portal-nav button:hover,.portal-nav a:hover{color:var(--sg-ink)}
.portal-nav button.active,.portal-nav a.active{color:var(--sg-green);font-weight:600}
.portal-nav button.active::after,.portal-nav a.active::after{background:var(--sg-green)}
.sb-top-actions{display:flex;align-items:center;gap:8px;margin-left:auto;flex:none}
.langsw{display:inline-flex;border:1px solid var(--sg-line);border-radius:var(--sg-r-control);overflow:hidden}
.langsw button{
  border:0;
  border-left:1px solid var(--sg-line);
  border-radius:0;
  padding:0 12px;
  min-height:40px;
  font-size:12px;
  background:var(--sg-paper);
  color:var(--sg-muted)
}
.langsw button:first-child{border-left:0}
.langsw button.active{background:var(--sg-green-soft);color:var(--sg-green);font-weight:600}

/* Scroll and clipping containers keep the keyboard indicator inside their bounds. */
.langsw button:focus-visible,
.portal-nav button:focus-visible,.portal-nav a:focus-visible,
.section-tabs button:focus-visible,.sessions-tabs button:focus-visible,.admin-nav button:focus-visible,
.course-filters button:focus-visible{
  outline:2px solid var(--sg-green);
  outline-offset:-3px
}

/* Controls */
button{
  border:1px solid var(--sg-line-strong);
  background:var(--sg-paper);
  color:var(--sg-ink);
  border-radius:var(--sg-r-control);
  padding:9px 14px;
  min-height:42px;
  font-weight:600;
  font-size:14px;
  transition:
    background-color var(--sg-fast) ease-out,
    border-color var(--sg-fast) ease-out,
    color var(--sg-fast) ease-out
}
button:hover:not(:disabled){border-color:#8fa197;background:var(--sg-green-faint)}
.primary{background:var(--sg-green);border-color:var(--sg-green);color:#fff}
.primary:hover:not(:disabled){background:var(--sg-green-hover);border-color:var(--sg-green-hover)}
.quiet{background:transparent;border-color:transparent;font-weight:500;color:var(--sg-muted)}
.quiet:hover:not(:disabled){background:var(--sg-green-faint);border-color:transparent;color:var(--sg-green)}
.danger{color:var(--sg-danger);border-color:#df9c96;background:var(--sg-paper)}
.danger:hover:not(:disabled){background:var(--sg-danger-soft);border-color:var(--sg-danger)}

/* Shell, typography and shared surfaces */
.sb-shell{
  flex:1;
  width:100%;
  max-width:1180px;
  margin:0 auto;
  padding:32px 20px 64px;
  display:flex;
  flex-direction:column;
  gap:24px
}
.auth-loading{
  min-height:calc(100vh - 170px);
  display:flex;
  align-items:center;
  justify-content:center;
  gap:12px;
  color:var(--sg-muted)
}
.auth-loading>span{
  width:18px;
  height:18px;
  border:2px solid var(--sg-line-strong);
  border-top-color:var(--sg-green);
  border-radius:50%;
  animation:pending-spin .8s linear infinite
}
.auth-loading p{margin:0}
.panel{
  background:var(--sg-paper);
  border:1px solid var(--sg-line);
  border-radius:var(--sg-r-panel);
  padding:24px
}
.panel h2{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:21px;
  font-weight:600;
  letter-spacing:-.015em;
  line-height:1.25;
  margin:0 0 8px
}
.panel>p{color:var(--sg-muted);line-height:1.6;margin:0 0 4px;font-size:15px;max-width:72ch}
.panel-head{display:flex;align-items:flex-start;justify-content:space-between;gap:20px;margin-bottom:18px}
.panel-head h2{margin:0}
.empty{padding:28px 16px;text-align:center;color:var(--sg-muted)}
.error-panel{border-color:#e4a7a2;background:var(--sg-danger-soft)}
.error-panel h2{color:var(--sg-danger)}
.fineprint{margin:18px 0 0;padding-top:16px;border-top:1px solid var(--sg-line);font-size:12px;color:var(--sg-muted);line-height:1.55}
.hint{color:var(--sg-muted);font-size:12px;line-height:1.5}
.section-intro{
  display:flex;
  align-items:flex-end;
  justify-content:space-between;
  gap:20px;
  margin:0 0 12px
}
.section-intro>div{min-width:0}
.section-intro h2{
  margin:0;
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:20px;
  font-weight:600;
  letter-spacing:-.01em
}
.section-intro p{margin:3px 0 0;color:var(--sg-muted);font-size:13px;line-height:1.5;max-width:70ch}
.section-intro>button{flex:none}

/* Agenda-led overview */
.overview-head{grid-column:1/-1;display:block;min-width:0;padding-top:4px}
.overview-head h1{
  margin:0 0 5px;
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:clamp(32px,4vw,42px);
  font-weight:600;
  line-height:1.08;
  letter-spacing:-.025em
}
.overview-head>p{margin:0;color:var(--sg-muted);font-size:15px;line-height:1.55;max-width:70ch}
.overview-grid{
  display:grid;
  grid-template-columns:repeat(12,minmax(0,1fr));
  gap:32px 24px
}
.overview-section{grid-column:1/-1;min-width:0}
.overview-section>header,.overview-section>.section-head{
  display:flex;
  align-items:baseline;
  justify-content:space-between;
  gap:16px;
  margin-bottom:12px
}
.overview-section h2{
  margin:0;
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:20px;
  font-weight:600;
  letter-spacing:-.01em
}
.course-table-head{
  display:grid;
  grid-template-columns:minmax(220px,2fr) minmax(150px,1fr) minmax(180px,1.25fr) 110px;
  gap:16px;
  padding:0 12px 10px 28px;
  border-bottom:1px solid var(--sg-line-strong);
  color:var(--sg-muted);
  font-size:12px;
  font-weight:600
}
.next-session{
  width:100%;
  min-height:0;
  padding:20px;
  display:grid;
  grid-template-columns:135px minmax(190px,1.5fr) minmax(150px,1fr) minmax(120px,.75fr) auto;
  align-items:center;
  gap:0;
  border:1px solid #c7d8ce;
  border-radius:var(--sg-r-panel);
  background:var(--sg-green-soft);
  color:var(--sg-ink);
  text-align:left
}
button.next-session:hover:not(:disabled){background:#deede4;border-color:#a9c7b5}
.next-session>span{display:flex;flex-direction:column;gap:2px;min-width:0;padding:0 18px;border-left:1px solid #bfd3c6}
.next-session>span:first-child{padding-left:0;border-left:0}
.next-session small{color:#4f685a;font-size:12px;font-weight:400;line-height:1.35;overflow-wrap:anywhere}
.next-session b{font-size:15px;font-weight:600;line-height:1.35;overflow-wrap:anywhere}
.next-time b{font-size:18px;font-variant-numeric:tabular-nums}
.next-topic,.next-place,.next-people{min-width:0}
.next-action{flex-direction:row!important;align-items:center!important;justify-content:flex-end;gap:6px!important;padding-right:0!important;color:var(--sg-green);font-size:13px;font-weight:600;white-space:nowrap}
.next-session-empty{display:flex;align-items:center;justify-content:space-between;gap:24px}
.next-session-empty>div{min-width:0}
.next-session-empty p{margin:3px 0 0;color:#4f685a;font-size:13px;font-weight:400}
.next-session-empty>button{flex:none}
.next-session-section,.overview-updates{min-width:0}

/* Public entry */
.entry{
  display:grid;
  grid-template-columns:minmax(0,1.05fr) 380px;
  gap:clamp(42px,6vw,76px);
  align-items:start;
  padding-top:12px
}
.entry-lead{display:flex;flex-direction:column;gap:20px}
.entry-lead h1{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  margin:0;
  font-size:clamp(36px,4.4vw,50px);
  font-weight:600;
  line-height:1.04;
  letter-spacing:-.03em;
  max-width:11em;
  text-wrap:balance
}
.entry-lead .lead{margin:0;font-size:17px;color:var(--sg-muted);line-height:1.6;max-width:34em}
.signin-panel{border-top:3px solid var(--sg-green);padding-top:21px}
.signin-panel h2{margin-bottom:6px}
.signin-buttons{display:flex;flex-direction:column;gap:9px;margin-top:18px}
.signin-buttons button{width:100%}
.path{list-style:none;margin:4px 0 0;padding:0;display:flex;flex-direction:column;gap:16px}
.path li{display:grid;grid-template-columns:28px minmax(0,1fr);gap:13px;align-items:start}
.path li div{display:flex;flex-direction:column;gap:2px;padding-top:2px}
.path li b{font-size:15px;font-weight:600}
.path li small{font-size:13px;color:var(--sg-muted);line-height:1.5}
.path-no{
  width:26px;
  height:26px;
  border:1px solid var(--sg-line);
  border-radius:var(--sg-r-sm);
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:600;
  background:var(--sg-paper);
  color:var(--sg-muted);
  flex:none
}
.band-note{margin:14px 0 0;font-size:13px;color:var(--sg-muted)}

/* Authenticated progress and sub-navigation */
.rail{
  list-style:none;
  margin:0;
  padding:12px 0;
  display:flex;
  position:relative;
  border-top:1px solid var(--sg-line);
  border-bottom:1px solid var(--sg-line)
}
.rail::before{content:"";position:absolute;left:12%;right:12%;top:24px;height:1px;background:var(--sg-line-strong)}
.rail li{flex:1;display:flex;flex-direction:column;align-items:center;gap:6px;min-width:0}
.rail li span{
  position:relative;
  width:24px;
  height:24px;
  border:1px solid var(--sg-line-strong);
  border-radius:var(--sg-r-sm);
  display:grid;
  place-items:center;
  font-size:11px;
  font-weight:600;
  background:var(--sg-paper);
  color:var(--sg-muted)
}
.rail li small{font-size:11px;color:var(--sg-muted);text-align:center}
.rail li.done span{border-color:var(--sg-green);background:var(--sg-green);color:#fff}
.rail li.current span{border-color:var(--sg-green);background:var(--sg-green-soft);color:var(--sg-green)}
.rail li.current small{color:var(--sg-ink);font-weight:600}
.section-tabs,.admin-nav,.sessions-tabs{
  display:flex;
  gap:22px;
  border-bottom:1px solid var(--sg-line);
  overflow-x:auto;
  scrollbar-width:none
}
.section-tabs::-webkit-scrollbar,.admin-nav::-webkit-scrollbar,.sessions-tabs::-webkit-scrollbar{display:none}
.section-tabs button,.admin-nav button,.sessions-tabs button{
  position:relative;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--sg-muted);
  padding:12px 2px;
  min-height:44px;
  font-weight:500;
  white-space:nowrap
}
.section-tabs button::after,.admin-nav button::after,.sessions-tabs button::after{
  content:"";
  position:absolute;
  left:0;
  right:0;
  bottom:-1px;
  height:2px;
  background:transparent
}
.section-tabs button:hover,.admin-nav button:hover,.sessions-tabs button:hover{
  color:var(--sg-ink);
  background:transparent
}
.section-tabs button.active,.admin-nav button.active,.sessions-tabs button.active{color:var(--sg-green);font-weight:600}
.section-tabs button.active::after,.admin-nav button.active::after,.sessions-tabs button.active::after{background:var(--sg-green)}
.section-tabs button span,.admin-nav button span{
  display:inline;
  margin-left:4px;
  color:inherit;
  font-size:11px;
  font-variant-numeric:tabular-nums
}
.pilot-note{
  padding:12px 14px;
  border:1px solid #dfc36f;
  border-radius:var(--sg-r-control);
  background:var(--sg-attention-soft);
  color:#684b05;
  font-size:14px
}

/* Compact state labels: never color alone */
.status{
  display:inline-flex;
  align-items:center;
  gap:7px;
  flex:none;
  align-self:flex-start;
  white-space:nowrap;
  padding:0;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--sg-muted);
  font-size:12px;
  font-weight:600
}
.status::before{content:"";width:7px;height:7px;border-radius:1px;background:currentColor;flex:none}
.status.available,.status.joined{color:var(--sg-green)}
.status.awaiting_group{color:var(--sg-attention)}
.status.link_released{color:var(--sg-blue)}
.status.rejected{color:var(--sg-danger)}
.course-num{
  font-family:ui-monospace,"SFMono-Regular",Consolas,"Liberation Mono",monospace;
  font-size:12px;
  font-weight:600;
  color:var(--sg-green);
  font-variant-numeric:tabular-nums
}

/* Forms */
.form-grid{display:grid;grid-template-columns:1fr;gap:18px;margin-top:20px}
.form-grid .consent,.form-grid button{grid-column:1/-1}
.form-grid button{justify-self:start}
label{display:flex;flex-direction:column;gap:7px;font-size:13px;font-weight:600;min-width:0}
label small{color:var(--sg-muted);font-weight:400;font-size:12px;line-height:1.45}
input,select,textarea{
  width:100%;
  border:1px solid var(--sg-line-strong);
  border-radius:var(--sg-r-control);
  background:var(--sg-paper);
  padding:10px 12px;
  min-height:44px;
  color:var(--sg-ink);
  outline:none;
  transition:border-color var(--sg-fast) ease-out,background-color var(--sg-fast) ease-out
}
input:hover,select:hover,textarea:hover{border-color:#8fa197}
input:focus,select:focus,textarea:focus{border-color:var(--sg-green)}
textarea{min-height:88px;resize:vertical}
input::placeholder,textarea::placeholder{color:var(--sg-muted);opacity:1}
.consent{
  flex-direction:row;
  align-items:flex-start;
  gap:11px;
  font-weight:400;
  color:var(--sg-muted);
  line-height:1.5;
  font-size:13px;
  background:var(--sg-green-faint);
  border-radius:var(--sg-r-control);
  padding:13px;
  cursor:pointer
}
.consent input{width:20px;height:20px;min-height:20px;margin:1px 0 0;flex:none;accent-color:var(--sg-green)}
.consent-kind{display:block;margin-bottom:2px;color:var(--sg-green);font-size:11px;line-height:1.2;letter-spacing:.04em}
.code-form{margin-top:20px;display:flex;flex-direction:column;gap:14px;max-width:280px}
.code-form input{
  font:600 23px ui-monospace,"SFMono-Regular",Consolas,monospace;
  letter-spacing:.18em;
  text-align:center;
  font-variant-numeric:tabular-nums
}
.code-actions{display:flex;gap:9px}

/* Proof upload */
.upload-panel .guide{margin:16px 0 4px;border:1px solid var(--sg-line);border-radius:var(--sg-r-control);background:#fbfcfb;overflow:hidden}
.upload-panel .guide summary{
  padding:13px 15px;
  cursor:pointer;
  font-size:14px;
  font-weight:600;
  list-style:none;
  display:flex;
  align-items:center;
  gap:8px;
  min-height:44px
}
.upload-panel .guide summary::-webkit-details-marker{display:none}
.upload-panel .guide summary::before{content:"+";color:var(--sg-green);font-weight:600;font-size:16px}
.upload-panel .guide[open] summary::before{content:"–"}
.guide-steps{list-style:none;margin:0;padding:0 15px 16px;display:flex;flex-direction:column;gap:16px}
.guide-steps li{display:flex;gap:12px;align-items:flex-start}
.guide-steps li>span{
  width:24px;
  height:24px;
  border:1px solid #b8d2c2;
  border-radius:var(--sg-r-sm);
  background:var(--sg-green-soft);
  color:var(--sg-green);
  display:grid;
  place-items:center;
  font-size:12px;
  font-weight:600;
  flex:none
}
.guide-steps li>div{display:flex;flex-direction:column;gap:10px;min-width:0}
.guide-steps p{margin:0;font-size:13px;color:var(--sg-muted);line-height:1.55;padding-top:2px}
.guide-steps figure{margin:0;width:100%;max-width:430px}
.guide-steps svg{display:block;width:100%;height:auto}
.guide-link{display:inline-flex;align-items:center;min-height:40px;margin:0 15px 14px;padding:0 2px;font-size:13px;font-weight:600}
.upload-box{display:grid;grid-template-columns:230px 1fr auto;align-items:end;gap:15px;margin-top:18px}
.file-drop{
  min-height:92px;
  border:1px dashed #879a8f;
  border-radius:var(--sg-r-control);
  padding:15px;
  justify-content:center;
  align-items:center;
  text-align:center;
  position:relative;
  background:#fbfcfb;
  gap:4px;
  cursor:pointer
}
.file-drop:hover{background:var(--sg-green-faint);border-color:var(--sg-green)}
.file-drop input{position:absolute;inset:0;opacity:0;cursor:pointer;min-height:0}
.file-drop b{font-size:15px}
.inline-error{margin-top:16px;color:var(--sg-danger);background:var(--sg-danger-soft);border:1px solid #e7aaa5;border-radius:var(--sg-r-control);padding:12px;font-size:14px}

/* Waiting and next steps */
.pending-panel{display:flex;flex-direction:column;align-items:flex-start;gap:11px}
.pending-panel h2,.pending-panel p{margin:0}
.pending-panel small{color:var(--sg-muted);font-size:12px}
.pending-icon{
  display:grid;
  place-items:center;
  width:42px;
  height:42px;
  border:1px solid #dfc36f;
  border-radius:var(--sg-r-control);
  background:var(--sg-attention-soft)
}
.pending-icon span{width:18px;height:18px;border:2px solid #d8bf72;border-top-color:var(--sg-green);border-radius:50%;animation:pending-spin .9s linear infinite}
@keyframes pending-spin{to{transform:rotate(360deg)}}
.pending-panel .next-panel{width:100%;margin-top:7px;padding-top:18px;border-top:1px solid var(--sg-line)}
.next-panel>b{font-size:14px;display:block;margin-bottom:13px}
.next-panel ul{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:11px}
.next-panel li{display:flex;gap:10px;align-items:flex-start}
.next-panel li>span{color:var(--sg-green);font-weight:600;line-height:1.4}
.next-panel li div{display:flex;flex-direction:column}
.next-panel li b{font-size:14px;font-weight:600}
.next-panel li small{font-size:12px;color:var(--sg-muted)}

/* Courses: the row is the reusable unit */
.course-section{display:flex;flex-direction:column;gap:12px}
.course-block{display:flex;flex-direction:column;gap:0}
.course-block+.course-block{margin-top:12px}
.course-block>.section-head{padding:4px 12px 9px}
.course-block>.section-head h3{margin:0;font-size:14px;font-weight:600}
.section-head{display:flex;align-items:baseline;justify-content:space-between;gap:16px;flex-wrap:wrap}
.section-head h2{
  margin:0;
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:20px;
  font-weight:600;
  letter-spacing:-.01em
}
.section-head span{font-size:13px;color:var(--sg-muted);margin-left:auto}
.course-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--sg-line-strong)}
.course-row{
  position:relative;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  padding:16px 12px;
  display:grid;
  grid-template-columns:minmax(220px,2fr) minmax(150px,1fr) minmax(180px,1.25fr) 110px;
  grid-template-areas:"main group session actions";
  gap:16px;
  align-items:center;
  transition:background-color var(--sg-fast) ease-out
}
.course-row:hover{background:var(--sg-green-faint)}
.course-main{grid-area:main;position:relative;display:flex;flex-direction:column;gap:2px;min-width:0;padding-left:18px}
.course-main>i{position:absolute;left:0;top:5px;width:7px;height:7px;border-radius:1px}
.course-main b{font-size:15px;font-weight:600;line-height:1.35}
.course-group-state{grid-area:group;display:flex;flex-direction:column;align-items:flex-start;gap:3px;min-width:0}
.course-group-state p{margin:0;color:var(--sg-muted);font-size:11.5px;line-height:1.4}
.course-session-state{grid-area:session;min-width:0}
.course-session-link{
  width:100%;
  min-height:0;
  padding:2px 0;
  border:0;
  border-radius:0;
  background:transparent;
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  text-align:left
}
.course-session-link:hover:not(:disabled){border-color:transparent;background:transparent;color:var(--sg-green)}
.course-session-link b,.course-session-empty b{max-width:100%;font-size:13px;font-weight:600;line-height:1.35;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.course-session-link small,.course-session-empty small{font-size:11.5px;color:var(--sg-muted);font-weight:400;font-variant-numeric:tabular-nums}
.course-session-empty{display:flex;flex-direction:column;align-items:flex-start;gap:2px;color:var(--sg-muted)}
.course-actions{grid-area:actions;display:flex;justify-content:flex-end;min-width:0}
.course-actions button{min-height:38px;padding:7px 10px;font-size:12px;white-space:normal}
.course-row.joined{background:var(--sg-green-faint)}
.course-block.sessions-disabled .course-table-head,
.course-block.sessions-disabled .course-row{
  grid-template-columns:minmax(220px,2fr) minmax(150px,1fr) 110px
}
.course-block.sessions-disabled .course-row{grid-template-areas:"main group actions"}

/* Notifications */
.updates-page{display:flex;flex-direction:column;gap:0}
.updates-head{align-items:flex-end;margin:0 0 18px}
.updates-head h1{
  margin:0;
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:40px;
  font-weight:600;
  line-height:44px;
  letter-spacing:-.025em
}
.updates-page>.empty{border-top:1px solid var(--sg-line-strong);border-bottom:1px solid var(--sg-line)}
.notification-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--sg-line-strong)}
.notification{
  position:relative;
  display:flex;
  justify-content:space-between;
  gap:18px;
  padding:15px 12px 15px 28px;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  background:transparent
}
.notification.unread{background:var(--sg-green-faint)}
.notification.unread::before{
  content:"";
  position:absolute;
  left:10px;
  top:21px;
  width:7px;
  height:7px;
  border-radius:1px;
  background:var(--sg-green)
}
.notification b{font-size:14px;font-weight:600}
.notification p{margin:3px 0 0;font-size:13px;color:var(--sg-muted);line-height:1.5}
.notification time{white-space:nowrap;color:var(--sg-muted);font-size:11px;font-variant-numeric:tabular-nums}
.notification .note-session{color:var(--sg-ink);font-weight:600}
.notification .note-link{margin-top:7px;min-height:34px;padding:0 8px;font-size:12px}
.overview-notification{border-top:1px solid var(--sg-line-strong)}

/* Study sessions and agenda */
.session-login{max-width:560px;margin:42px auto;width:100%}
.session-login h1{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:32px;
  font-weight:600;
  letter-spacing:-.025em;
  margin:0 0 8px
}
.session-login .signin-buttons{max-width:360px}
.sessions-area{display:flex;flex-direction:column;gap:20px}
.sessions-head{display:flex;align-items:flex-end;justify-content:space-between;gap:24px;padding:4px 0 0}
.sessions-head h1{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:clamp(32px,4vw,42px);
  font-weight:600;
  line-height:1.08;
  letter-spacing:-.025em;
  margin:0 0 7px
}
.sessions-head p{margin:0;color:var(--sg-muted);font-size:15px;max-width:65ch}
.create-session{display:inline-flex;align-items:center;justify-content:center;gap:7px;flex:none;width:auto;padding:9px 14px;font-size:14px;white-space:nowrap}
.course-filters{
  display:flex;
  align-items:center;
  gap:0;
  overflow-x:auto;
  border-bottom:1px solid var(--sg-line);
  scrollbar-width:none
}
.course-filters::-webkit-scrollbar{display:none}
.course-filters button{
  position:relative;
  display:inline-flex;
  align-items:center;
  gap:6px;
  white-space:nowrap;
  min-height:40px;
  padding:8px 13px;
  border:0;
  border-radius:0;
  background:transparent;
  color:var(--sg-muted);
  font-weight:500
}
.course-filters button:hover{background:var(--sg-green-faint);color:var(--sg-ink)}
.course-filters button.active{background:var(--sg-green-soft);color:var(--sg-green);font-weight:600}
.course-filters button span{font-variant-numeric:tabular-nums;font-weight:600}
.session-skeletons,.detail-skeleton{display:flex;flex-direction:column;gap:1px;background:var(--sg-line)}
.session-skeletons span,.detail-skeleton span{
  height:104px;
  border:0;
  border-radius:0;
  background:#eef2ef;
  animation:session-pulse 1.2s ease-in-out infinite alternate
}
.detail-skeleton span:first-child{height:250px}
.detail-skeleton span:nth-child(2){height:145px}
@keyframes session-pulse{to{opacity:.52}}
.session-empty{display:flex;flex-direction:column;align-items:center;text-align:center;gap:8px;padding:36px 20px}
.session-empty h2{margin:0}
.session-empty p{max-width:500px;margin:0 0 8px!important}
.session-empty.compact{padding:24px}
.session-empty.compact p{margin:0!important}
.empty-icon{
  width:36px;
  height:36px;
  display:grid;
  place-items:center;
  border:1px solid #b8d2c2;
  border-radius:var(--sg-r-control);
  background:var(--sg-green-soft);
  color:var(--sg-green);
  font-size:20px
}
.session-groups,.my-session-block{display:flex;flex-direction:column;gap:12px}
.session-groups>section{display:flex;flex-direction:column;gap:8px}
.session-groups>section>h2{font-size:13px;color:var(--sg-muted);font-weight:600;margin:10px 0 0}
.session-list{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--sg-line-strong)}
.session-card{
  position:relative;
  width:100%;
  min-height:0;
  text-align:left;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  padding:15px 12px 15px 28px;
  display:grid;
  grid-template-columns:76px minmax(0,1fr) auto;
  align-items:center;
  gap:5px 18px;
  transition:background-color var(--sg-fast) ease-out
}
.session-card::before{
  content:"";
  position:absolute;
  left:10px;
  top:22px;
  width:7px;
  height:7px;
  border-radius:1px;
  background:var(--kurs,var(--sg-green))
}
.session-card:hover:not(:disabled){background:var(--sg-green-faint);border-color:var(--sg-line)}
.card-span{font-variant-numeric:tabular-nums;font-size:14px;font-weight:600;line-height:1.35}
.card-span small{display:block;font-size:12px;font-weight:400;color:var(--sg-muted)}
.card-body{min-width:0;display:flex;flex-direction:column;gap:3px}
.card-line{display:flex;align-items:center;gap:8px;flex-wrap:wrap;min-width:0}
.card-line .course-num{font-weight:600;font-size:12px;flex:none}
.card-line .course-name{font-size:12.5px;color:var(--sg-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0}
.session-card>.card-body>b{font-size:16px;line-height:1.35;overflow-wrap:anywhere}
.card-side{display:flex;align-items:center;justify-content:flex-end;gap:14px;flex:none}
.card-action{font-size:12.5px;font-weight:600;color:var(--sg-green);white-space:nowrap}
.faces{display:flex}
.faces i{
  width:24px;
  height:24px;
  border-radius:50%;
  display:grid;
  place-items:center;
  font-size:10.5px;
  font-weight:600;
  font-style:normal;
  color:#fff;
  border:2px solid var(--sg-paper);
  margin-left:-7px
}
.faces i:first-child{margin-left:0}
.faces i.rest{background:#e4e9e6;color:#4f5c55}
.session-meta{grid-column:1/-1;color:var(--sg-muted);font-size:13px;font-weight:400;line-height:1.45}

/* Week calendar */
.calendar-toolbar{
  display:grid;
  grid-template-columns:42px minmax(0,1fr) auto 42px;
  align-items:center;
  gap:8px;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  padding:0 0 12px
}
.calendar-toolbar button{min-height:40px;padding:7px 11px}
.calendar-toolbar>b{text-align:center;font-size:14px;font-variant-numeric:tabular-nums}
.week-grid-wrap{overflow:auto;background:var(--sg-paper);border:1px solid var(--sg-line);border-radius:var(--sg-r-panel);isolation:isolate}
.week-grid{
  --slot-h:26px;
  display:grid;
  grid-template-columns:48px repeat(7,minmax(102px,1fr));
  grid-template-rows:auto repeat(var(--slots),var(--slot-h));
  min-width:760px;
  background:var(--sg-paper)
}
.wg-corner{
  position:sticky;
  top:0;
  left:0;
  z-index:6;
  border-bottom:1px solid var(--sg-line);
  background:var(--sg-paper)
}
.wg-dayhead{
  position:sticky;
  top:0;
  z-index:5;
  border-bottom:1px solid var(--sg-line);
  border-left:1px solid var(--sg-line);
  padding:8px 6px;
  text-align:center;
  font-size:11px;
  color:var(--sg-muted);
  background:var(--sg-paper)
}
.wg-dayhead b{display:block;font-size:14px;color:var(--sg-ink);font-weight:600;font-variant-numeric:tabular-nums}
.wg-dayhead.today{background:var(--sg-green-soft)}
.wg-dayhead.today b{color:var(--sg-green)}
.wg-hour{
  grid-column:1;
  position:sticky;
  left:0;
  z-index:4;
  align-self:start;
  margin-top:-6px;
  padding-right:7px;
  background:var(--sg-paper);
  color:var(--sg-muted);
  text-align:right;
  font-size:10.5px;
  font-variant-numeric:tabular-nums
}
.wg-col{
  grid-row:2/-1;
  position:relative;
  border-left:1px solid var(--sg-line);
  background-color:var(--sg-paper);
  background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='1' height='52' viewBox='0 0 1 52'%3E%3Cpath d='M0 51.5H1' stroke='%23d6ded9' stroke-width='1'/%3E%3C/svg%3E");
  background-size:100% calc(var(--slot-h)*2);
  background-repeat:repeat-y
}
.wg-col.today{background-color:var(--sg-green-faint)}
.wg-event{
  position:absolute;
  display:flex;
  flex-direction:column;
  gap:1px;
  align-items:flex-start;
  text-align:left;
  overflow:hidden;
  min-height:0;
  padding:4px 6px;
  border:1px solid;
  border-radius:var(--sg-r-sm);
  font-weight:400;
  transition:filter var(--sg-fast) ease-out
}
.wg-event:hover:not(:disabled){filter:brightness(.96);z-index:3}
.wg-event time{font-size:10px;font-weight:600;font-variant-numeric:tabular-nums;opacity:.92}
.wg-event b{font-size:11.5px;line-height:1.25;max-width:100%;overflow:hidden}
.wg-event small{font-size:10px;opacity:.86;max-width:100%;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.wg-event .wg-people{margin-top:auto}
.wg-legend{display:flex;flex-wrap:wrap;gap:12px;font-size:11.5px;color:var(--sg-muted)}
.wg-legend span{display:inline-flex;align-items:center;gap:6px}
.wg-legend i{width:8px;height:8px;border-radius:1px;flex:none}

/* Session details */
.session-back{align-self:flex-start;display:inline-flex;align-items:center;gap:7px;padding-left:0}
.session-detail{display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:32px;align-items:start}
.session-detail-main{
  display:flex;
  flex-direction:column;
  align-items:flex-start;
  gap:14px;
  padding:4px 24px 0 0;
  border:0;
  border-radius:0;
  background:transparent
}
.detail-course{display:flex;align-items:baseline;gap:9px;min-width:0;color:var(--sg-muted);font-size:13px}
.detail-course .course-num{color:var(--sg-green);font-weight:600}
.detail-course>span:last-child{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.session-detail-main h1{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:clamp(30px,4vw,42px);
  font-weight:600;
  letter-spacing:-.025em;
  line-height:1.08;
  margin:0
}
.detail-facts{
  display:grid;
  grid-template-columns:1fr 1fr;
  gap:14px 24px;
  width:100%;
  padding:17px 0;
  border-top:1px solid var(--sg-line-strong);
  border-bottom:1px solid var(--sg-line-strong)
}
.detail-facts span{display:flex;flex-direction:column;gap:3px;font-size:14px}
.detail-facts b{font-size:12px;color:var(--sg-muted);font-weight:600}
.session-description{white-space:pre-wrap;color:var(--sg-ink)!important;font-size:15px!important;line-height:1.65!important;margin:0!important}
.meeting-link,.meeting-locked,.cancelled-note{width:100%;border-radius:var(--sg-r-control);padding:14px 15px}
.meeting-link{display:flex;align-items:center;justify-content:space-between;gap:16px;background:var(--sg-green-soft);color:var(--sg-green)}
.meeting-link>div{display:flex;flex-direction:column;gap:3px}
.meeting-link small{font-size:11px;color:#456554}
.meeting-host{overflow-wrap:anywhere}
.meeting-link a{display:inline-flex;align-items:center;min-height:40px;padding:0 13px;border-radius:var(--sg-r-control);background:var(--sg-green);color:#fff;font-size:13px;font-weight:600}
.meeting-locked{background:#edf1ee;color:var(--sg-muted);font-size:13px}
.cancelled-note{background:var(--sg-danger-soft);color:var(--sg-danger);border:1px solid #e7aaa5}
.cancelled-note p{color:#7a3430;margin:4px 0 0;font-size:13px}
.session-detail.cancelled .session-detail-main h1{color:#7a3430}
.session-detail-side{display:flex;flex-direction:column;gap:16px;position:sticky;top:88px}
.roster-head>div{display:flex;align-items:center;justify-content:space-between;gap:16px}
.roster-head h2{margin:0}
.roster-head>div>span{font-weight:600;color:var(--sg-green);font-variant-numeric:tabular-nums}
.roster-head>small{display:block;color:var(--sg-green);font-size:12px;margin-top:3px}
.participant-list{list-style:none;margin:0;padding:0;display:flex;flex-direction:column;gap:0;max-height:330px;overflow:auto;border-top:1px solid var(--sg-line)}
.participant-list li{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--sg-line)}
.participant-list li>span:last-child{display:flex;flex-direction:column;font-size:13px;font-weight:600}
.participant-list small{font-size:10px;color:var(--sg-muted);font-weight:400}
.participant-avatar{width:30px;height:30px;border-radius:50%;background:var(--sg-green-soft);color:var(--sg-green);display:grid;place-items:center;font-size:12px;font-weight:600;flex:none}
.display-name-prompt{background:var(--sg-green-soft);padding:12px;border-radius:var(--sg-r-control)}
.display-name-prompt input{background:#fff}
.detail-primary-actions,.detail-share-actions{display:flex;flex-wrap:wrap;gap:8px}
.detail-primary-actions .primary{flex:1}
.session-ended-hint{margin:0;width:100%;font-size:13px;color:var(--sg-muted)}
.detail-share-actions{padding-top:4px;border-top:1px solid var(--sg-line)}
.detail-share-actions button{font-size:12px;padding:8px 10px;min-height:38px}
.permanent-delete{align-self:flex-start;margin-top:4px}
.source-note{font-size:11px!important;margin:0!important;padding-top:12px;border-top:1px solid var(--sg-line)}
.unavailable-panel{max-width:640px;margin:20px auto;text-align:center;display:flex;flex-direction:column;align-items:center;gap:10px}
.unavailable-panel h1{font-size:26px;margin:0}
.unavailable-panel p{margin:0 0 8px!important}

/* Dialogs and editor */
.modal-backdrop{
  position:fixed;
  inset:0;
  z-index:80;
  background:rgba(12,25,18,.58);
  display:grid;
  place-items:center;
  padding:20px;
  overflow:auto
}
.session-editor,.confirm-dialog{
  width:min(700px,100%);
  max-height:calc(100vh - 40px);
  overflow:auto;
  background:var(--sg-paper);
  border:1px solid var(--sg-line-strong);
  border-radius:var(--sg-r-dialog)
}
.session-editor>header{
  position:sticky;
  top:0;
  z-index:3;
  background:var(--sg-paper);
  display:flex;
  justify-content:space-between;
  align-items:flex-start;
  gap:18px;
  padding:20px 22px 15px;
  border-bottom:1px solid var(--sg-line)
}
.session-editor h2{font-size:23px;margin:0}
.modal-close{font-size:22px;padding:4px 11px;min-width:40px}
.session-editor form{display:grid;grid-template-columns:1fr 1fr;gap:17px;padding:20px 22px 22px}
.session-editor .wide{grid-column:1/-1}
.time-fields{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.time-fields>.field-error{grid-column:1/-1}
.format-choice{border:0;padding:0;margin:0;display:flex;gap:16px}
.format-choice legend{font-size:13px;font-weight:600;margin-bottom:7px}
.format-choice label{
  flex:1;
  flex-direction:row;
  align-items:center;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  padding:10px 2px;
  cursor:pointer
}
.format-choice label:has(input:checked){border-bottom-color:var(--sg-green);color:var(--sg-green)}
.format-choice input{width:18px;height:18px;min-height:0;accent-color:var(--sg-green)}
.field-error{color:var(--sg-danger)!important;font-weight:500!important}
.timezone-note{margin:0;color:var(--sg-muted);font-size:12px;line-height:1.5}
.editor-actions{
  position:sticky;
  bottom:-22px;
  z-index:2;
  display:flex;
  justify-content:flex-end;
  gap:9px;
  margin:4px -22px -22px;
  padding:14px 22px calc(14px + env(safe-area-inset-bottom));
  border-top:1px solid var(--sg-line);
  background:var(--sg-paper)
}
.confirm-dialog{width:min(440px,100%);padding:22px;overflow:visible}
.confirm-dialog h2{font-size:21px;margin:0 0 8px}
.confirm-dialog p{color:var(--sg-muted);font-size:14px;line-height:1.55;margin:0 0 20px}
.confirm-dialog>div{display:flex;justify-content:flex-end;gap:9px}

/* Admin workbench */
.admin-area{display:flex;flex-direction:column;gap:20px}
.admin-split{display:grid;grid-template-columns:220px minmax(0,1fr);gap:16px;align-items:start}
.queue{background:var(--sg-paper);border:1px solid var(--sg-line);border-radius:var(--sg-r-panel);padding:10px;height:max-content}
.queue h2{font-size:14px;margin:5px 8px 10px;display:flex;justify-content:space-between}
.queue h2 span{color:var(--sg-green);font-variant-numeric:tabular-nums}
.queue>button{
  position:relative;
  display:flex;
  width:100%;
  min-height:0;
  text-align:left;
  flex-direction:column;
  align-items:flex-start;
  gap:2px;
  border:0;
  border-radius:var(--sg-r-control);
  margin:0 0 2px;
  padding:10px 10px 10px 20px
}
.queue>button::before{content:"";position:absolute;left:8px;top:16px;width:6px;height:6px;border-radius:1px;background:var(--sg-line-strong)}
.queue>button b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;max-width:100%}
.queue>button small{color:var(--sg-muted);font-size:11px;font-weight:400}
.queue>button.active{background:var(--sg-green-soft);color:var(--sg-green)}
.queue>button.active::before{background:var(--sg-green)}
.review{background:var(--sg-paper);border:1px solid var(--sg-line);border-radius:var(--sg-r-panel);overflow:hidden;display:flex;flex-direction:column}
.review-head{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:14px 18px;border-bottom:1px solid var(--sg-line)}
.review-head div{display:flex;flex-direction:column;gap:2px;min-width:0}
.review-head b{font-size:15px}
.review-head small{font-size:12px;color:var(--sg-muted)}
.review-body{display:grid;grid-template-columns:minmax(0,1fr) 310px;min-height:540px}
.proof-preview{background:#252827;padding:14px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:9px;min-height:420px;overflow:auto}
.proof-preview img{max-width:100%;max-height:640px;background:#fff;border-radius:var(--sg-r-sm)}
.proof-preview iframe{width:100%;height:620px;border:0;background:#fff;border-radius:var(--sg-r-sm)}
.proof-preview>span{color:#fff;font-size:13px}
.proof-preview a{color:#bfe6d0;font-size:12px}
.course-picker{padding:18px;display:flex;flex-direction:column;gap:12px;border-left:1px solid var(--sg-line)}
.suggestions{border:1px solid var(--sg-line);border-radius:var(--sg-r-control);max-height:220px;overflow:auto}
.suggestions button{display:block;border:0;border-bottom:1px solid var(--sg-line);border-radius:0;text-align:left;width:100%;font-weight:400;min-height:0;padding:9px 11px}
.suggestions button:last-child{border-bottom:0}
.suggestions button:hover{background:var(--sg-green-soft)}
.selected-courses{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--sg-line)}
.selected-courses button{
  display:flex;
  justify-content:flex-start;
  gap:8px;
  text-align:left;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  min-height:0;
  padding:9px 2px;
  font-weight:400;
  font-size:13px
}
.selected-courses button b{font-family:ui-monospace,Consolas,monospace;font-size:12px;color:var(--sg-green)}
.selected-courses button span{margin-left:auto;color:var(--sg-muted)}
.review-foot{display:flex;align-items:center;justify-content:space-between;gap:16px;padding:13px 18px;border-top:1px solid var(--sg-line);background:#fbfcfb}
.review-foot>span{font-size:13px;color:var(--sg-muted)}
.review-foot div{display:flex;gap:9px}
.reject-form{margin:0;padding:15px 18px;background:var(--sg-danger-soft);border-top:1px solid #e5aaa5}
.reject-form label span{color:var(--sg-danger);font-size:13px}
.reject-form textarea,.reject-form input{border-color:#cf8f89}
.reject-form>div{display:flex;gap:8px;margin-top:10px}
.new-group{display:flex;flex-direction:column;gap:12px;padding:17px;margin-bottom:18px;border:1px dashed #879a8f;border-radius:var(--sg-r-control);background:#fbfcfb}
.new-group>div:first-child{display:flex;flex-direction:column;gap:4px}
.new-group small{color:var(--sg-muted);line-height:1.45;font-size:12px}
.new-group button.primary{align-self:flex-start}
.new-group .picked{margin:0;color:var(--sg-green);font-size:14px}
.group-rows{display:flex;flex-direction:column;gap:0;border-top:1px solid var(--sg-line-strong)}
.group-rows article{
  display:grid;
  grid-template-columns:minmax(0,1fr) 150px 90px 300px;
  gap:16px;
  align-items:center;
  padding:13px 2px;
  border-bottom:1px solid var(--sg-line)
}
.group-id{display:flex;flex-direction:column;gap:2px;min-width:0}
.group-id b{font-size:14px;font-weight:600}
.group-id small{font-size:11px;color:var(--sg-muted)}
.group-waiting{font-size:13px;color:var(--sg-muted)}
.group-rows form{display:flex;gap:8px}
.group-rows form input{font-size:13px;min-height:40px}
.group-rows form button{flex:none}
.join-row{
  display:grid;
  grid-template-columns:minmax(0,1fr) 210px auto;
  gap:20px;
  align-items:center;
  background:transparent;
  border:0;
  border-bottom:1px solid var(--sg-line);
  border-radius:0;
  padding:15px 2px
}
.join-course{display:flex;flex-direction:column;gap:4px;min-width:0}
.join-course b{font-size:15px;font-weight:600}
.join-course small{font-size:12px;color:var(--sg-muted)}
.join-phone{display:flex;flex-direction:column;gap:2px}
.join-phone small{font-size:11px;color:var(--sg-muted);font-weight:600}
.join-phone strong{font-family:ui-monospace,Consolas,monospace;font-size:15px;font-weight:600;font-variant-numeric:tabular-nums}
.join-actions{display:flex;gap:8px}
.join-row .reject-form{grid-column:1/-1;margin-top:12px;border:1px solid #e5aaa5;border-radius:var(--sg-r-control)}
.join-filter{display:grid;grid-template-columns:minmax(0,1.3fr) minmax(0,1.3fr) minmax(0,.9fr) auto;gap:12px;align-items:end;margin:0 0 6px}
.join-filter label span{font-size:12px;color:var(--sg-muted)}
.join-filter input,.join-filter select{min-height:40px;font-size:14px}
.join-filter button{white-space:nowrap}
.join-hint{margin:6px 0 0;background:var(--sg-green-soft);border-radius:var(--sg-r-control);padding:14px 16px;font-size:13px;color:#0a5c36;line-height:1.55}
.admin-list{display:flex;flex-direction:column;gap:10px}

/* Feedback, footer and privacy */
.sb-toast{
  position:fixed;
  left:50%;
  bottom:24px;
  transform:translateX(-50%);
  z-index:70;
  background:var(--sg-ink);
  color:#fff;
  border:1px solid #314039;
  border-radius:var(--sg-r-control);
  padding:11px 15px;
  max-width:min(440px,calc(100vw - 32px));
  font-size:14px
}
footer{
  display:flex;
  justify-content:center;
  flex-wrap:wrap;
  gap:8px;
  color:var(--sg-muted);
  font-size:12px;
  padding:19px 20px;
  border-top:1px solid var(--sg-line);
  background:var(--sg-paper);
  margin-top:auto
}
.prose{max-width:760px;margin:0 auto}
.prose h1{
  font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;
  font-size:30px;
  font-weight:600;
  letter-spacing:-.025em;
  margin:8px 0 14px
}
.prose .privacy-date{margin:-7px 0 18px;color:var(--sg-muted);font-size:13px}
.prose h2{font-size:17px;margin:28px 0 6px}
.prose p{color:var(--sg-muted);line-height:1.65;margin:0}

@media(max-width:1080px){
  .portal-nav{gap:20px}
  .sb-back-lbl{display:none}
  .admin-split{grid-template-columns:190px minmax(0,1fr)}
  .review-body{grid-template-columns:minmax(0,1fr) 280px}
  .group-rows article{grid-template-columns:minmax(0,1fr) 130px 80px 250px}
}

@media(max-width:900px){
  .entry{grid-template-columns:1fr;gap:30px}
  .entry-lead h1{max-width:14em}
  .upload-box{grid-template-columns:1fr}
  .session-detail{grid-template-columns:1fr;gap:22px}
  .session-detail-main{padding-right:0}
  .session-detail-side{position:static}
  .admin-split{grid-template-columns:1fr}
  .queue{display:flex;align-items:flex-start;overflow:auto;gap:4px}
  .queue h2{min-width:max-content;padding-top:7px}
  .queue>button{min-width:200px}
  .review-body{grid-template-columns:1fr}
  .course-picker{border-left:0;border-top:1px solid var(--sg-line)}
  .group-rows article{grid-template-columns:1fr;gap:9px}
  .join-row{grid-template-columns:1fr;gap:11px}
  .join-filter{grid-template-columns:1fr}
  .join-actions{justify-content:flex-start}
}

@media(max-width:700px){
  html{scroll-behavior:auto}
  .sb-topbar{min-height:56px;padding:0 14px;gap:0 8px;flex-wrap:wrap}
  .sb-mark{width:32px;height:32px}
  .sb-brand b{font-size:17px}
  .sb-brand small,.sb-back-lbl{display:none}
  .sb-lead{order:1;gap:6px;height:56px}
  .sb-back{min-width:38px;min-height:38px;justify-content:center;padding:0 9px}
  .sb-topbar.authenticated .sb-back{display:none}
  .sb-topbar.authenticated .sb-lead{flex:1}
  .portal-nav{
    order:3;
    flex:0 0 calc(100% + 28px);
    align-self:auto;
    height:44px;
    margin:0 -14px;
    padding:0 14px;
    gap:24px;
    overflow-x:auto;
    border-top:1px solid var(--sg-line);
    background:var(--sg-paper);
    scrollbar-width:none
  }
  .portal-nav::-webkit-scrollbar{display:none}
  .portal-nav button,.portal-nav a{min-height:44px;flex:none}
  .section-tabs{display:flex}
  .sb-top-actions{order:2;gap:6px;height:56px}
  .sb-top-actions>.quiet:first-of-type{display:none}
  .langsw button{min-height:38px;padding:0 10px}
  .sb-shell{padding:20px 14px 52px;gap:20px}
  .panel{padding:17px 16px}
  .overview-head{align-items:flex-start;flex-direction:column;gap:12px}
  .overview-head h1{font-size:29px}
  .overview-grid{display:flex;flex-direction:column;gap:28px}
  .section-intro{align-items:flex-start}
  .section-intro>button{padding-left:8px;padding-right:8px}
  .next-session{grid-template-columns:1fr;gap:0;padding:16px}
  .next-session>span{padding:11px 0 0;margin-top:11px;border-left:0;border-top:1px solid #bfd3c6}
  .next-session>span:first-child{padding-top:0;margin-top:0;border-top:0}
  .next-action{align-items:flex-start!important;padding-top:12px!important}
  .next-session-empty{align-items:flex-start;flex-direction:column;gap:14px}
  .next-session-empty>button{width:100%}
  .course-table-head{display:none}
  .entry{display:flex;flex-direction:column;gap:24px;padding-top:2px}
  .entry-lead{display:contents}
  .entry-lead h1{order:1;font-size:34px;max-width:11em}
  .entry-lead .lead{order:2;font-size:15px}
  .signin-panel{order:3}
  .path{order:4}
  .form-grid{grid-template-columns:1fr}
  .code-form{max-width:none}
  .code-actions{flex-wrap:wrap}
  .rail{padding:10px 0}
  .rail::before{top:22px}
  .rail li small{font-size:9.5px}
  .notification{flex-direction:column;gap:5px;padding-right:8px}
  .notification time{align-self:flex-start}
  .updates-head{align-items:flex-start;gap:12px}
  .updates-head h1{font-size:29px;line-height:32px}
  .course-row{
    padding:15px 8px;
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"main main" "group group" "session actions";
    gap:10px 14px;
    align-items:end
  }
  .course-main{padding-left:16px}
  .course-group-state{align-items:flex-start}
  .course-session-state{align-self:center}
  .course-session-link{width:auto;max-width:100%}
  .course-actions{align-self:center}
  .course-actions button{width:auto;min-width:0;justify-self:auto}
  .course-block.sessions-disabled .course-row{
    grid-template-columns:minmax(0,1fr) auto;
    grid-template-areas:"main main" "group actions"
  }
  .sessions-head{align-items:flex-start;flex-direction:column;gap:14px}
  .sessions-head h1{font-size:29px}
  .create-session{width:100%}
  .sessions-tabs{gap:18px}
  .sessions-tabs button{font-size:13px}
  .course-filters button{padding-left:11px;padding-right:11px}
  .session-card{grid-template-columns:62px minmax(0,1fr);padding:14px 8px 14px 24px;gap:5px 12px}
  .session-card::before{left:8px;top:21px}
  .card-side{grid-column:1/-1;justify-content:space-between;width:100%;padding-top:3px}
  .calendar-toolbar{grid-template-columns:40px minmax(0,1fr) auto 40px;gap:6px}
  .calendar-toolbar .quiet{display:inline-flex;align-items:center;justify-content:center;min-width:0;padding:6px 8px;font-size:11px}
  .calendar-toolbar>b{font-size:12px}
  .week-grid{--slot-h:24px;grid-template-columns:42px repeat(7,132px);min-width:0}
  .week-grid-wrap{
    height:clamp(320px,calc(100dvh - 235px),620px);
    overflow:auto;
    overscroll-behavior:contain;
    border-radius:var(--sg-r-control)
  }
  .wg-dayhead{font-size:10.5px}
  .wg-dayhead b{font-size:13px}
  .detail-facts{grid-template-columns:1fr;gap:12px;padding:15px 0}
  .session-detail-main h1{font-size:29px}
  .session-detail-main,.session-detail-side{
    padding-left:0;
    padding-right:0;
    border-left:0;
    border-right:0;
    border-radius:0
  }
  .session-detail-side{border-bottom:0}
  .detail-primary-actions,.detail-share-actions{flex-direction:column;width:100%}
  .detail-primary-actions button,.detail-share-actions button{width:100%}
  .modal-backdrop{padding:0;align-items:stretch}
  .session-editor{
    width:100%;
    height:100dvh;
    max-height:100dvh;
    border:0;
    border-radius:0
  }
  .session-editor>header{padding:16px 16px 13px}
  .session-editor form{grid-template-columns:1fr;padding:16px;min-height:calc(100dvh - 68px)}
  .session-editor .wide{grid-column:1}
  .time-fields{grid-column:1}
  .format-choice{gap:10px}
  .editor-actions{
    bottom:-16px;
    margin:4px -16px -16px;
    padding:13px 16px calc(13px + env(safe-area-inset-bottom))
  }
  .editor-actions .primary{flex:1}
  .confirm-dialog{align-self:center;margin:14px;width:calc(100% - 28px);height:auto;max-height:calc(100dvh - 28px)}
  .admin-nav{gap:18px}
  .queue{margin-left:-14px;margin-right:-14px;border-left:0;border-right:0;border-radius:0;padding-left:14px;padding-right:14px}
  .review{margin-left:-14px;margin-right:-14px;border-left:0;border-right:0;border-radius:0}
  .review-head{align-items:flex-start;flex-direction:column}
  .proof-preview{min-height:330px}
  .review-foot{position:sticky;bottom:0;z-index:4;align-items:flex-start;flex-direction:column}
  .review-foot div{width:100%}
  .review-foot button{flex:1}
  .group-rows article{padding:14px 0}
  .group-rows form{flex-direction:column}
  .join-actions{display:grid;grid-template-columns:1fr 1fr}
  .sb-toast{left:12px;right:12px;bottom:12px;transform:none;max-width:none}
  footer{padding-left:14px;padding-right:14px}
}

@media(prefers-reduced-motion:reduce){
  html{scroll-behavior:auto}
  *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important}
  .auth-loading>span,.pending-icon span{animation:none;border-top-color:var(--sg-line-strong)}
}

@media(forced-colors:active){
  .status::before,.course-row::before,.notification.unread::before,.session-card::before{forced-color-adjust:auto;background:CanvasText}
  .primary{forced-color-adjust:auto}
}

/* Compass reference images deliberately retain Compass' own visual language. */
.compass-shot{
  --cx:#454545;
  --cb:#1474b8;
  --cl:rgba(69,69,69,.25);
  font-family:Roboto,Arial,sans-serif;
  color:var(--cx);
  background:#f6f6f9;
  border:1px solid var(--sg-line);
  border-radius:var(--sg-r-control);
  overflow:hidden;
  font-size:9px;
  line-height:1.3
}
.compass-shot .cs-bar{background:#fff;border-bottom:.8px solid var(--cl);display:flex;align-items:center;gap:10px;padding:9px 12px}
.compass-shot .cs-logo{width:34px;height:12px;border-radius:2px;background:#0e7c3a}
.compass-shot .cs-nav{width:22px;height:8px;border-radius:2px;background:#e4e4e9;margin-left:auto}
.compass-shot .cs-nav+.cs-nav{margin-left:0}
.compass-shot .cs-avatar{width:14px;height:14px;border-radius:50%;background:#d5d5dc}
.compass-shot .cs-body{padding:12px}
.compass-shot .cs-h1{font-family:"Gill Sans MT","Gill Sans",Calibri,Arial,sans-serif;font-weight:300;font-size:17px;margin-bottom:10px}
.compass-shot .cs-filters{display:grid;grid-template-columns:repeat(4,1fr);gap:7px;margin-bottom:12px}
.compass-shot .cs-filters i{height:16px;border-radius:3px;background:#ececf1}
.compass-shot .cs-row{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:11px}
.compass-shot .cs-count{color:#6d6d75}
.compass-shot .cs-btn{border:.8px solid var(--cb);color:var(--cb);border-radius:4px;padding:0 10px;height:22px;display:inline-flex;align-items:center;letter-spacing:.09em;background:#fff;position:relative}
.compass-shot .cs-list i{display:block;height:15px;border-radius:3px;background:#fff;border:.8px solid var(--cl);margin-bottom:5px}
.compass-shot.dim{background:#dededf;padding:10px}
.compass-shot .cs-dialog{background:#fff;border-radius:5px;padding:12px}
.compass-shot .cs-dh{font-family:"Gill Sans MT","Gill Sans",Calibri,Arial,sans-serif;font-weight:300;font-size:15px;margin-bottom:9px}
.compass-shot .cs-th{display:grid;grid-template-columns:1fr 1.9fr 1.1fr .6fr;gap:8px;background:#f2f2f5;padding:5px 7px;color:#6d6d75;font-size:8px}
.compass-shot .cs-tr{display:grid;grid-template-columns:1fr 1.9fr 1.1fr .6fr;gap:8px;padding:6px 7px;border-bottom:.8px solid #edeef1}
.compass-shot .cs-tr i{height:7px;border-radius:2px;background:#e6e6ec}
.compass-shot .cs-df{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-top:11px}
.compass-shot .cs-ghost{border:.8px solid var(--cl);border-radius:4px;padding:0 10px;height:20px;display:inline-flex;align-items:center;color:#6d6d75}
.compass-shot .cs-link{color:var(--cb);display:inline-flex;align-items:center;gap:5px;position:relative}
.compass-shot .cs-link::before{content:"";width:8px;height:8px;border:1.2px solid var(--cb);border-top:0;border-left:0;transform:rotate(45deg) translate(-1px,-1px);flex:none}
.compass-shot .cs-target::after{content:"";position:absolute;inset:-6px -8px;border:1px dashed var(--sg-green);border-radius:var(--sg-r-control);pointer-events:none}
@media(max-width:700px){
  .compass-shot{font-size:8px}
  .compass-shot .cs-h1{font-size:14px}
}

/* Weitere Nachweise ergaenzen den vorhandenen Kurszugang. */
.proof-panel > summary { cursor:pointer; font-weight:600; }
.proof-semester { display:grid; gap:6px; margin:18px 0; max-width:400px; }
.proof-panel .pending-panel { margin-top:18px; }

/* V1 entry and account surfaces */
.entry-subjects{margin:26px auto 0;width:min(650px,100%)}
.entry-subjects h2{font-size:16px;margin:0 0 12px}
.entry-subjects ul{list-style:none;padding:0;margin:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:8px 16px;font-size:13px}
.entry-subjects li{border-top:1px solid var(--sg-line);padding-top:8px}
.entry-subjects p{font-size:12px;color:var(--sg-muted);line-height:1.5;margin-top:13px}
.entry{
  display:block;
  width:min(760px,100%);
  margin:0 auto;
  padding-top:10px
}
.entry-lead{align-items:center;text-align:center;gap:13px}
.entry-kicker{
  color:var(--sg-green);
  font-size:12px;
  font-weight:600;
  letter-spacing:.03em;
  text-transform:uppercase
}
.entry-lead h1{max-width:18em}
.entry-lead .lead{max-width:54em}
.entry .path{width:100%;display:grid;grid-template-columns:repeat(3,1fr);gap:12px;margin:9px 0 0;text-align:left}
.entry .path li{grid-template-columns:26px minmax(0,1fr);gap:9px}
.entry .path li b{font-size:13px}
.entry .path li small{font-size:12px}
.signin-panel{width:min(650px,100%);margin:28px auto 0}
.entry-choice{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:18px}
.entry-choice-button{
  display:flex;
  flex-direction:column;
  gap:3px;
  padding:13px;
  border:1px solid var(--sg-line-strong);
  border-radius:var(--sg-r-control);
  color:var(--sg-ink);
  text-decoration:none;
  background:var(--sg-paper)
}
.entry-choice-button:hover{border-color:var(--sg-green);background:var(--sg-green-faint);text-decoration:none}
.entry-choice-button b{color:var(--sg-green)}
.entry-choice-button small{color:var(--sg-muted);font-size:12px;line-height:1.4}
.entry-switch{padding:0;margin:10px 0 0;min-height:32px}
.signin-email{margin-top:19px;padding-top:18px;border-top:1px solid var(--sg-line)}
.signin-email h3{font-size:16px;margin:0 0 4px}
.signin-email p{margin:0 0 12px;color:var(--sg-muted);font-size:13px}
.signin-email form:not(.code-form){display:flex;flex-direction:column;align-items:stretch;gap:12px}
.signin-email form:not(.code-form) label{flex:none}
.signin-email form:not(.code-form) button{flex:none;align-self:flex-start}
.signin-divider{display:flex;align-items:center;gap:10px;margin:20px 0 0;color:var(--sg-muted);font-size:12px}
.signin-divider::before,.signin-divider::after{content:"";height:1px;background:var(--sg-line);flex:1}
.signin-divider span{padding:0 3px}
.provider-recovery{margin-top:22px;padding-top:18px;border-top:1px solid var(--sg-line)}
.provider-recovery>p{margin:0;color:var(--sg-muted);font-size:13px}
.auth-error{margin-top:15px}
.account-setup{max-width:700px;margin:0 auto}
.account-setup .setup-email-heading{margin:18px 0 4px;font-size:14px}
.account-setup .setup-email-address{margin:0 0 4px;color:var(--sg-muted)}
.account-setup .setup-email-address b{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;color:var(--sg-ink);font-size:13px}
.account-setup .consent{margin-top:15px}
.account-setup>button{margin-top:17px}
.page-head{max-width:760px;margin:0 auto 4px}
.page-head h1{font-family:"IBM Plex Sans Local","Segoe UI",sans-serif;font-size:clamp(29px,4vw,40px);line-height:1.1;letter-spacing:-.025em;margin:0 0 5px}
.page-head p{margin:0;color:var(--sg-muted);max-width:65ch}
.account-page{display:flex;flex-direction:column;gap:18px;max-width:760px;margin:0 auto}
.account-card{display:flex;flex-direction:column;gap:12px}
.account-card h2{margin:0;font-size:18px}
.account-card>p{margin:0}
.account-recipient{display:flex;align-items:center;gap:10px;flex-wrap:wrap}
.account-recipient b{font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:13px}
.email-change{display:flex;flex-direction:column;gap:12px;margin-top:3px}
.email-change p{margin:0}
.email-recipients{display:flex;flex-direction:column;gap:10px;padding-top:14px;border-top:1px solid var(--sg-line)}
.email-recipients>p{margin:0;color:var(--sg-muted);font-size:13px}
.email-recipients>[role=group]{display:flex;flex-wrap:wrap;gap:8px}
.email-recipients>[role=group] button{display:inline-flex;align-items:center;gap:8px;min-height:38px;font-family:ui-monospace,"SFMono-Regular",Consolas,monospace;font-size:12px}
.email-recipients>[role=group] button.active{border-color:var(--sg-green);background:var(--sg-green-soft);color:var(--sg-green)}
.email-recipients .code-form{max-width:300px;margin-top:2px}
.account-marketing{display:flex;align-items:center;justify-content:space-between;gap:14px;padding:13px 0;border-top:1px solid var(--sg-line);border-bottom:1px solid var(--sg-line)}
.account-marketing p{margin:0;color:var(--sg-muted);font-size:13px}
.account-marketing p span,.account-marketing p small{display:block}
.account-marketing p small{margin-top:3px;font-size:11px}
.account-marketing button{flex:none}

/* Proof batches retain original files for retry and use object URLs only for previews. */
.proof-track{display:flex;flex-wrap:wrap;gap:9px 16px;border:1px solid var(--sg-line);border-radius:var(--sg-r-control);padding:13px;margin:17px 0 4px}
.proof-track legend{width:100%;font-size:13px;font-weight:600;padding:0}
.track-option{flex-direction:row;align-items:center;gap:7px;font-weight:500;background:var(--sg-green-faint);padding:9px 11px;border-radius:var(--sg-r-control);cursor:pointer}
.track-option input{width:18px;height:18px;min-height:18px;accent-color:var(--sg-green)}
.proof-track .hint{width:100%}
.upload-box{display:flex;flex-direction:column;align-items:stretch;gap:11px}
.upload-box>.primary{align-self:flex-start}
.file-drop{min-height:80px}
.upload-files{display:flex;flex-direction:column;gap:7px}
.upload-file{display:grid;grid-template-columns:48px minmax(0,1fr) auto;align-items:center;gap:10px;border:1px solid var(--sg-line);border-radius:var(--sg-r-control);padding:7px 9px}
.upload-preview{width:48px;height:48px;object-fit:cover;border-radius:3px;background:var(--sg-green-faint)}
.pdf-preview{display:grid;place-items:center;color:var(--sg-green);font-size:12px;font-weight:600;text-decoration:none;border:1px solid var(--sg-line)}
.upload-meta{display:flex;flex-direction:column;min-width:0}
.upload-meta b{font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.upload-meta small{font-size:11px;color:var(--sg-muted)}
.upload-file>.quiet{font-size:12px;padding:6px 8px;min-height:34px}
.pending-track,.requested-track{color:var(--sg-green)!important;font-size:13px!important;font-weight:600}

/* Admin previews show the whole returned proof, with a legacy single-file fallback. */
.preview-files{display:flex;flex-direction:column;gap:16px;width:100%}
.preview-file{display:flex;flex-direction:column;align-items:stretch;gap:7px}
.preview-file img,.preview-file iframe{width:100%;max-width:100%;max-height:620px}
.preview-file>div{display:flex;align-items:center;gap:8px;flex-wrap:wrap;color:#fff;font-size:12px}
.preview-file>div b{overflow-wrap:anywhere}
.preview-file>div small{color:#c2cec8}
.preview-file>div a{margin-left:auto}

.join-dialog form{display:flex;flex-direction:column;gap:14px}
.join-dialog form>div{margin-top:3px}

/* Legal pages use the same restrained reading width as the privacy page. */
.legal-page h1{max-width:23ch}
.legal-page h2{margin-top:30px}
.legal-page ul{padding-left:21px;color:var(--sg-muted);line-height:1.65}
.legal-page a{overflow-wrap:anywhere}

@media(max-width:700px){
  .entry{padding-top:2px}
  .entry-lead{display:flex}
  .entry-lead h1{order:initial;font-size:34px;max-width:12em}
  .entry-lead .lead{order:initial}
  .entry .path{display:flex;flex-direction:column;gap:9px;margin-top:8px}
  .entry .path li{grid-template-columns:26px minmax(0,1fr)}
  .signin-panel{order:initial;margin-top:22px}
  .entry-choice{grid-template-columns:1fr}
  .signin-email form:not(.code-form){display:flex;flex-direction:column;align-items:stretch}
  .signin-email form:not(.code-form) button{width:100%}
  .account-marketing{align-items:flex-start;flex-direction:column}
  .account-marketing button{width:100%}
  .upload-file{grid-template-columns:42px minmax(0,1fr) auto;gap:8px;padding:6px}
  .upload-preview{width:42px;height:42px}
  .upload-file>.quiet{font-size:11px}
}