body { font-family:sans-serif; text-align:center; }
#tasks { display:grid; grid-template-columns:repeat(3,1fr); gap:10px; }
.section { margin:10px; }

.task {
  border:2px solid #ccc;
  margin:8px;
  padding:15px;
  font-size:15px;
  border-radius:10px;
  cursor:pointer;
}

.task::after { content:"❀"; float:right; opacity:0.2; }
.task.done { background-color:#ffd6e8; }
.task.done::after { content:"🌸"; }

#counter { font-size:22px; margin:10px; }

.lesson h2 { text-align:left; margin-left:10px; }
.lesson .task { text-align:center; }

hr { margin:20px 0; border:2px solid #aaa; }

#schoolToggle { position:fixed; left:10px; bottom:10px; }
label[for="schoolToggle"] { position:fixed; left:35px; bottom:10px; font-size:16px; }

#parentPanel {
  display:none;
  position:fixed;
  left:50%;
  bottom:20px;
  transform:translateX(-50%);
  background:#fff;
  border:2px dashed #aaa;
  padding:10px;
  z-index:100;
  width:90%;
  max-width:700px;
  max-height:80vh;
  overflow-y:auto;
}

#parentBtn {
  position:fixed;
  right:10px;
  bottom:5px;
  font-size:10px;
  padding:10px 15px;
}

textarea { width:90%; height:70px; font-size:16px; }
select,button { font-size:16px; margin:5px; }

.lesson .task.parent { font-weight:bold; color:#f70202; }
.lesson .subTask { font-size:12px; margin-left:20px; color:#0721b3; }