:root {
  color-scheme:light dark;
  font:16px/1.5 -apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
  color:#202124;
  background:#fff;
  --muted:#62666d;
  --border:#dadce0;
  --surface:#f6f7f8;
  --button:#202124;
  --button-text:#fff;
  --error:#a32020;
}
* { box-sizing:border-box }
body { margin:0 }
[hidden] { display:none!important }
button,input { font:inherit }
button { min-height:44px; padding:9px 14px; cursor:pointer; border:1px solid var(--border); border-radius:8px }
button:disabled { cursor:default; opacity:.5 }
button:focus-visible,input:focus-visible,summary:focus-visible { outline:2px solid currentColor; outline-offset:3px }
.primary { color:var(--button-text); background:var(--button); border-color:var(--button); font-weight:600 }
.quiet { color:inherit; background:transparent }
.quiet:hover:not(:disabled),.release:hover { background:var(--surface) }
main { max-width:760px; margin:auto; padding:12px 16px calc(24px + env(safe-area-inset-bottom)) }
header { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:20px }
h1,h2,p { margin:0 }
h1 { font-size:20px; font-weight:600; line-height:1.4 }
h2 { font-size:20px; font-weight:600; line-height:1.4 }
.muted { color:var(--muted); font-size:14px }
#origin { overflow-wrap:anywhere; font-size:12px }
#signin,#enrollment { max-width:420px; margin:64px auto 0 }
#signin p,#enrollment p { margin:12px 0 20px; color:var(--muted) }
#login,#enroll { width:100% }
#enroll-form { display:grid; gap:10px }
label { font-size:14px }
input { width:100%; min-height:44px; padding:10px; color:inherit; background:transparent; border:1px solid var(--border); border-radius:8px }
.checkbox { display:flex; align-items:center; gap:10px; min-height:44px }
.checkbox input { width:18px; height:18px; min-height:0; flex-shrink:0 }
[role=alert] { color:var(--error); margin:12px 0; overflow-wrap:anywhere }
.list-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:4px }
#refresh { font-size:14px; min-height:40px; padding:6px 12px }
#empty { margin:24px 0 }
.release { display:block; width:100%; padding:14px 0; text-align:left; border:0; border-bottom:1px solid var(--border); border-radius:0; background:transparent; color:inherit }
.release-summary { display:block; font-size:16px; font-weight:500; overflow-wrap:anywhere; white-space:pre-wrap }
.release-meta { display:block; font-size:13px; color:var(--muted); margin-top:4px; overflow-wrap:anywhere }
dialog { padding:16px; width:min(640px,calc(100% - 16px)); max-height:calc(100dvh - 16px); border:1px solid var(--border); border-radius:12px; color:inherit; background:Canvas; overscroll-behavior:contain }
dialog::backdrop { background:#0008 }
.dialog-heading { display:flex; align-items:center; justify-content:space-between; gap:12px; margin-bottom:8px }
#close { min-height:40px; padding:6px 10px }
.summary-label { margin-top:16px }
#release-summary { white-space:pre-wrap; overflow-wrap:anywhere; margin:4px 0 16px; font-weight:500; unicode-bidi:plaintext }
dl { display:grid; gap:4px; margin:16px 0 }
dt { margin-top:8px; font-size:13px; color:var(--muted) }
dd { margin:0; font-size:14px; overflow-wrap:anywhere; font-family:ui-monospace,SFMono-Regular,Consolas,monospace }
#release-detail { margin:12px 0; overflow-wrap:anywhere; white-space:pre-wrap }
details { border-top:1px solid var(--border); padding-top:12px; margin-top:16px }
summary { cursor:pointer; font-size:14px; padding:4px 0 }
ol { margin:12px 0; padding-left:22px }
li { margin-bottom:12px; font-size:14px; overflow-wrap:anywhere; white-space:pre-wrap }
li time { display:block; color:var(--muted); font-size:12px }
#decision-actions { margin-top:20px; border-top:1px solid var(--border); padding-top:16px }
.buttons { display:flex; justify-content:flex-end; gap:8px; margin-top:12px }
@media (prefers-color-scheme:dark) {
  :root { color:#e8eaed; background:#18191b; --muted:#adb0b6; --border:#414348; --surface:#242629; --button:#e8eaed; --button-text:#202124; --error:#ffb4ab }
  dialog { background:#18191b }
}
@media (max-width:420px) {
  main { padding-left:12px; padding-right:12px }
  dialog { padding:12px }
  h1 { font-size:19px }
  #signin,#enrollment { margin-top:40px }
}
