:root { color-scheme: light dark; }
* { box-sizing: border-box; }
body { margin: 0; font: 14px/1.45 system-ui, sans-serif; background: #f5f5f7; color: #1c1c1e; }
header { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; padding: 10px 14px; background: #1c1c1e; color: #fff; position: sticky; top: 0; z-index: 5; }
.brand { font-weight: 700; font-size: 17px; }
.brand .sub { font-weight: 400; font-size: 11px; opacity: .65; margin-left: 8px; }
nav button, .period-picker button { background: #2c2c2e; color: #eee; border: 1px solid #3a3a3c; padding: 6px 10px; border-radius: 8px; cursor: pointer; }
nav button.active { background: #0a84ff; border-color: #0a84ff; }
.period-picker { margin-left: auto; display: flex; gap: 8px; align-items: center; font-size: 12px; }
select { padding: 5px; border-radius: 6px; }
main { padding: 14px; max-width: 1200px; }
.meeting { background: #fff; border-radius: 12px; padding: 12px; margin-bottom: 14px; box-shadow: 0 1px 3px rgba(0,0,0,.08); }
.meeting h3 { margin: 0 0 8px; font-size: 15px; }
table { border-collapse: collapse; width: 100%; font-size: 13px; }
th, td { border: 1px solid #d7d7dc; padding: 5px 7px; text-align: left; vertical-align: top; }
th { background: #eeeef1; position: sticky; top: 56px; }
tr.slotrow { cursor: pointer; }
tr.slotrow:hover { background: #eef4ff; }
.free { color: #b04a00; font-style: italic; }
.badge { display: inline-block; border-radius: 6px; padding: 1px 6px; font-size: 11px; margin-left: 4px; }
.badge.male { background: #d6e4ff; }
.badge.female { background: #ffd6e7; }
.badge.st { background: #ffe3b3; }
.badge.norm { background: #ffd2d2; }
.badge.draft { background: #d9f2d9; }
.warn { border-radius: 6px; padding: 3px 8px; font-size: 12px; margin: 2px 0; }
.warn.confirm { background: #ffe0e0; border: 1px solid #e05252; }
.warn.info { background: #e8f0fe; border: 1px solid #9db8e8; }
.warn.family { background: #e6f6e6; border: 1px solid #67a067; }
.cand { padding: 8px; border-bottom: 1px solid #e2e2e6; cursor: pointer; }
.cand:hover { background: #eef4ff; }
.cand.armed { background: #fff2c9; }
.cand .sub { color: #666; font-size: 12px; }
#sidepanel { position: fixed; right: 0; top: 0; bottom: 0; width: min(520px, 100%); background: #fff; box-shadow: -2px 0 8px rgba(0,0,0,.2); overflow-y: auto; padding: 14px; z-index: 10; }
#sidepanel h2 { margin-top: 0; font-size: 16px; }
#sidepanel .close { float: right; }
button { font: inherit; }
.norms-list li { margin-bottom: 4px; }
.hint { background: #fff8e6; border: 1px solid #e5c878; border-radius: 10px; padding: 10px; margin-bottom: 12px; font-size: 13px; }
.small { font-size: 12px; color: #666; }
/* формы вида «Участники» */
.formgrid { display: flex; flex-wrap: wrap; gap: 8px 12px; align-items: flex-end; margin: 8px 0; }
.formgrid label { display: flex; flex-direction: column; gap: 2px; font-size: 11px; color: #555; }
.formgrid input, .formgrid select { padding: 5px; border-radius: 6px; border: 1px solid #c7c7cc; font: inherit; background: #fff; color: inherit; }
.flagboxes { display: flex; flex-wrap: wrap; gap: 4px 14px; margin: 6px 0 10px; }
.flagbox { font-size: 12px; display: inline-flex; gap: 5px; align-items: center; }