:root{--bg:#f4f6f8;--card:#fff;--text:#17202a;--muted:#667085;--line:#d0d5dd;--brand:#b42318;--yellow:#fff3b0;--green:#d1fadf;--orange:#fff4e5;}
*{box-sizing:border-box} body{margin:0;font-family:Arial,Helvetica,sans-serif;background:var(--bg);color:var(--text);} header{position:sticky;top:0;background:#fff;border-bottom:1px solid var(--line);z-index:10;padding:14px 18px;box-shadow:0 2px 10px rgba(0,0,0,.06)} h1{margin:0 0 8px 0;font-size:24px} h2{margin:0 0 10px 0;font-size:22px} h3{margin:18px 0 8px 0}.statusline{display:flex;gap:14px;align-items:center;font-size:13px;color:var(--muted);margin-bottom:8px}.cloud{padding:3px 8px;border-radius:999px;background:#eef2ff;color:#3538cd}.toolbar,nav{display:flex;gap:8px;flex-wrap:wrap;margin-top:8px}button,.button{border:1px solid var(--line);background:#fff;border-radius:8px;padding:8px 12px;cursor:pointer;font-weight:600;color:var(--text);text-decoration:none}button:hover,.button:hover{background:#f2f4f7}button.active,nav button.active{background:var(--brand);border-color:var(--brand);color:white}.danger{color:#b42318;border-color:#fecdca}.edit-toggle.active{background:#fff4e5;border-color:#f79009}.publicbar{justify-content:flex-end}section{margin:18px;padding:18px;background:var(--card);border:1px solid var(--line);border-radius:12px;box-shadow:0 1px 2px rgba(0,0,0,.04)}.hero{text-align:center;background:#1d2939;color:#fff}.hero h2{font-size:34px}.hero p{font-size:20px;margin:8px 0}.smalltext{font-size:14px!important;color:#d0d5dd}.section-head{display:flex;align-items:center;justify-content:space-between;gap:12px}.hint{background:#f8fafc;border:1px solid #e4e7ec;border-radius:8px;padding:10px;color:#475467}.empty{color:var(--muted);font-style:italic}table{width:100%;border-collapse:collapse;margin-top:8px;font-size:14px}th,td{border:1px solid var(--line);padding:7px 8px;text-align:left;vertical-align:middle}th{background:#f2f4f7;position:sticky;top:122px;z-index:4}td:nth-child(1),td:nth-child(4),td:nth-child(5),td:nth-child(6),td:nth-child(7),td:nth-child(8){white-space:nowrap}input,select{width:100%;border:1px solid #98a2b3;border-radius:6px;padding:7px 8px;font-size:14px;background:#fff}.small{min-width:72px;max-width:115px}.wide{min-width:210px}.yellow{background:var(--yellow)}.readonly{display:inline-block;min-height:20px}.fw-name{font-weight:600}.badge{display:inline-block;padding:3px 8px;border-radius:999px;font-weight:700;font-size:12px}.done{background:var(--green);color:#027a48}.open{background:#f2f4f7;color:#475467}.grid{display:grid;grid-template-columns:repeat(2,minmax(300px,1fr));gap:14px}.card{border:1px solid var(--line);border-radius:10px;padding:12px;background:#fff}.card h3{margin-top:0}footer{text-align:center;color:var(--muted);font-size:13px;padding:20px}tr:nth-child(even){background:#fcfcfd}.entry-table input:focus, input:focus, select:focus{outline:3px solid #84caff;border-color:#1570ef}
@media (max-width:900px){section{margin:10px;padding:12px}table{font-size:13px;display:block;overflow-x:auto;white-space:nowrap}.grid{grid-template-columns:1fr}header{position:relative}th{position:static}.toolbar,nav{overflow-x:auto;flex-wrap:nowrap}.wide{min-width:180px}}
@media print{header .toolbar, header nav, footer, .edit-toggle{display:none!important}header{position:static;box-shadow:none}section{box-shadow:none;break-inside:avoid;margin:10px 0}.entry-table{display:none}body{background:#fff}th{position:static}}

.login-card{max-width:720px;margin:32px auto}.login-row{display:flex;gap:10px;align-items:center;margin:14px 0}.login-row input{max-width:260px}.dark{color:#475467!important}.login-card code{background:#f2f4f7;border:1px solid var(--line);border-radius:6px;padding:3px 6px;word-break:break-all}.publicbar{align-items:center}
@media (max-width:700px){.login-row{flex-direction:column;align-items:stretch}.login-row input{max-width:none}}

.login-divider{margin:10px 0;text-align:center;color:#667085;font-size:13px;}
.google-login{width:100%;background:#fff;color:#1f2937;border:1px solid #d0d5dd;}
.google-login:hover{background:#f9fafb;}

/* v18: Klassenwertung ohne separate Alterspunkte-Spalte; Spaltenbreite automatisch */
table.auto-width{width:max-content;min-width:100%;table-layout:auto;}
table.auto-width th, table.auto-width td{white-space:nowrap;width:auto;}
table.entry-table.auto-width th, table.entry-table.auto-width td{white-space:nowrap;}
table.entry-table.auto-width td:nth-child(4){min-width:220px;}
@media (max-width:900px){table.auto-width{min-width:max-content;}}
