* { box-sizing: border-box; }
body { font-family: system-ui, -apple-system, sans-serif; background: #f6f7f9; margin: 0; color: #222; }
header { display: flex; justify-content: space-between; align-items: center; padding: .9rem 1.6rem; background: #fff; border-bottom: 1px solid #e3e5e8; }
header .brand { font-weight: 600; color: #1a73e8; text-decoration: none; font-size: 1.05rem; }
header nav { font-size: .9rem; color: #666; }
header .user { margin-right: .8rem; }
header .link { background: none; border: 0; color: #1a73e8; cursor: pointer; font-size: .9rem; padding: 0; }
main { max-width: 880px; margin: 0 auto; padding: 1.6rem; }
h1 { margin-top: 0; }
.sub { color: #666; }
.flash { background: #e8f0fe; border: 1px solid #b3d2ff; padding: .6rem 1rem; border-radius: 6px; margin-bottom: 1rem; }
.card { background: #fff; padding: 2rem; border-radius: 8px; box-shadow: 0 1px 3px rgba(0,0,0,.07); }
.login { max-width: 360px; margin: 4rem auto; }
.login label { display:block; font-size:.85rem; margin:.75rem 0 .25rem; }
.login input[type=text], .login input[type=password] { width:100%; padding:.55rem .7rem; border:1px solid #ccc; border-radius:4px; font-size:1rem; }
.login button { width:100%; margin-top:1.25rem; padding:.6rem; background:#1a73e8; color:#fff; border:0; border-radius:4px; font-size:1rem; cursor:pointer; }
.err { color: #b00020; font-size: .85rem; margin-top: .5rem; }

.empty { background:#fff; padding:2rem; border-radius:8px; text-align:center; color:#666; }
.prlist { list-style: none; padding: 0; margin: 0; }
.prcard { background:#fff; padding:1rem 1.25rem; border-radius:8px; margin-bottom:.6rem; box-shadow:0 1px 2px rgba(0,0,0,.05); }
.prcard .title { color:#1a73e8; text-decoration:none; font-weight:600; font-size:1.05rem; }
.prcard .meta { display:flex; gap:1rem; font-size:.85rem; color:#666; margin-top:.4rem; flex-wrap:wrap; }

.back { display:inline-block; margin-bottom:1rem; color:#1a73e8; text-decoration:none; font-size:.9rem; }
.vorlage { background:#fff; border-radius:8px; padding:1.5rem 1.75rem; box-shadow:0 1px 3px rgba(0,0,0,.07); }
.vorlage > header { background:transparent; padding:0 0 1rem; border-bottom:1px solid #e3e5e8; margin-bottom:1.25rem; flex-direction:column; align-items:flex-start; }
.vorlage > header h1 { margin: 0; font-size: .95rem; text-transform: uppercase; letter-spacing: .05em; color: #666; }
.vorlage > header h2 { margin: .25rem 0; font-size: 1.4rem; }
.vorlage > header .meta { display:flex; gap:1rem; font-size:.85rem; color:#666; flex-wrap:wrap; }
.vorlage section { margin: 1rem 0; }
.vorlage h3 { font-size: .95rem; text-transform: uppercase; letter-spacing: .03em; color: #444; margin-bottom: .5rem; }

table.fm { width: 100%; border-collapse: collapse; font-size:.9rem; }
table.fm th, table.fm td { padding: .35rem .55rem; text-align: left; border-bottom: 1px solid #eee; }
table.fm tr.changed { background: #fffbe6; }

ul.files { list-style: none; padding: 0; margin: 0; font-size:.9rem; }
ul.files li { padding: .2rem 0; }
.filestat { color: #666; font-size:.8rem; margin-left:.5rem; }

pre.diff { background: #f0f1f3; padding: .75rem; border-radius: 4px; overflow-x: auto; font-size: .8rem; max-height: 400px; }
details { margin-top: .5rem; }
details summary { cursor: pointer; color: #1a73e8; font-size:.85rem; }

ul.checks { list-style: none; padding: 0; margin: 0; font-size:.9rem; }
ul.checks li { padding: .25rem 0; }
ul.checks li.ok { color: #1f7a3a; }
ul.checks li.warn { color: #b06c00; }

.auto-approve-note { background: #fffae0; border: 1px solid #f0d65c; padding: .6rem .9rem; border-radius: 6px; font-size: .9rem; margin: 1rem 0; }

footer.actions { display: flex; gap: .75rem; margin-top: 1.5rem; padding-top: 1rem; border-top: 1px solid #e3e5e8; flex-wrap: wrap; }
footer.actions form { display: flex; gap: .4rem; flex: 1; min-width: 240px; }
footer.actions input[type=text] { flex: 1; padding: .5rem .65rem; border: 1px solid #ccc; border-radius: 4px; font-size: .9rem; }
.btn { padding: .55rem 1rem; border: 0; border-radius: 4px; font-size: .95rem; cursor: pointer; color: #fff; white-space: nowrap; }
.btn-approve { background: #1f7a3a; }
.btn-changes { background: #d68a00; }
.btn-reject  { background: #a02020; }
.btn:hover { filter: brightness(1.08); }
