:root{
  --sun:#ffd9d9; --sat:#fff3c4; --hol:#ff6b6b; --line:#333;
  --school:#3b82f6; --holiday:#ef4444; --birthday:#f59e0b; --user:#22c55e;
}
*{box-sizing:border-box; margin:0; padding:0; font-family:"PingFang HK","Microsoft JhengHei","Noto Sans TC",sans-serif;}
body{background:#eef2f6; padding:16px;}
.toolbar{max-width:1120px;margin:0 auto 12px;display:flex;gap:10px;flex-wrap:wrap;align-items:center;
         background:#fff;border-radius:12px;padding:12px;box-shadow:0 2px 8px rgba(0,0,0,.1);}
.toolbar button{font-size:16px;padding:8px 14px;border:none;border-radius:8px;background:#4dabf7;color:#fff;cursor:pointer;}
.toolbar button.print{background:#51cf66;}
.toolbar button.pm-toggle{background:#7950f2;}
.toolbar button.pm-toggle.active{background:#5f3dc4;}
.toolbar label{font-size:15px;}
.toolbar input[type=date]{font-size:15px;padding:4px;}

/* ---------- 家長管理模式 ---------- */
.parent-panel{max-width:1120px;margin:0 auto 14px;background:#fff;border-radius:12px;
  box-shadow:0 2px 8px rgba(0,0,0,.1);padding:14px 16px 16px;}
.parent-panel[hidden]{display:none;}
.pm-head{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:8px;margin-bottom:10px;}
.pm-title{font-size:18px;font-weight:900;color:#5f3dc4;}
.pm-settings{font-size:14px;color:#555;display:flex;align-items:center;gap:10px;}
.pm-settings input{border:1px solid #ccc;border-radius:6px;padding:3px 8px;font-size:14px;width:70px;}
.pm-status{font-size:12px;color:#999;}
.pm-body{display:grid;grid-template-columns:1.2fr 1fr;gap:14px;align-items:start;}
@media (max-width:860px){ .pm-body{grid-template-columns:1fr;} }
.pm-legend{grid-column:1/-1;display:flex;flex-wrap:wrap;gap:12px;font-size:13px;color:#444;margin-bottom:2px;}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;margin-right:4px;vertical-align:middle;}
.d-school{background:var(--school);} .d-holiday{background:var(--holiday);}
.d-birthday{background:var(--birthday);} .d-user{background:var(--user);}

.cal-head{display:flex;align-items:center;gap:8px;margin-bottom:8px;}
.cal-head b{flex:1;text-align:center;font-size:16px;}
.cal-head button{border:1px solid #ccc;background:#fff;border-radius:8px;padding:4px 12px;cursor:pointer;font-size:14px;}
.cal-week{display:grid;grid-template-columns:repeat(7,1fr);text-align:center;font-size:12px;color:#888;margin-bottom:4px;}
.cal-grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3px;}
.cal-day{position:relative;min-height:44px;border:1px solid #e5e5e5;border-radius:8px;cursor:pointer;
  display:flex;flex-direction:column;align-items:center;padding-top:4px;font-size:13px;background:#fff;}
.cal-day:hover{border-color:#7950f2;background:#f5f1ff;}
.cal-day.other{color:#bbb;background:#fafafa;}
.cal-day.today{outline:2px solid #7950f2;}
.cal-day.selected{background:#e9dfff;}
.cal-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:2px;margin-top:auto;padding-bottom:4px;}
.cal-dots i{width:7px;height:7px;border-radius:50%;}
.pm-detail{background:#f8f9fb;border:1px solid #e5e5e5;border-radius:10px;padding:12px;}
.pm-day-title{font-weight:800;margin-bottom:8px;}
.pm-day-events{list-style:none;margin-bottom:10px;}
.pm-day-events li{display:flex;align-items:center;gap:8px;padding:6px 8px;border-radius:8px;margin-bottom:4px;font-size:14px;background:#fff;border:1px solid #eee;}
.pm-day-events .ev-emoji{font-size:16px;}
.pm-day-events .ev-title{flex:1;}
.pm-day-events .ev-del{border:none;background:none;color:#ef4444;cursor:pointer;font-size:16px;}
.pm-day-events .ev-school{color:#1d4ed8;} .pm-day-events .ev-holiday{color:#dc2626;}
.pm-day-events .ev-birthday{color:#b45309;} .pm-day-events .ev-user{color:#15803d;}
.pm-add{display:flex;gap:8px;}
.pm-add input{flex:1;border:1px solid #ccc;border-radius:8px;padding:8px 10px;font-size:14px;}
.pm-add select{border:1px solid #ccc;border-radius:8px;padding:8px 6px;font-size:14px;background:#fff;max-width:110px;}
.pm-add button{border:none;border-radius:8px;background:#22c55e;color:#fff;padding:8px 14px;cursor:pointer;font-size:14px;white-space:nowrap;}
.pm-legend .lg-user{gap:4px;display:flex;flex-wrap:wrap;align-items:center;}

/* ---------- A4 sheet ---------- */
.sheet{
  width:297mm; min-height:210mm; margin:0 auto; background:#fff; padding:8mm;
  display:flex; flex-direction:column;
}
.header{display:flex;align-items:baseline;justify-content:space-between;margin-bottom:3mm;}
.title{font-size:34px;font-weight:900;}
.namebox{font-size:22px;border-bottom:3px solid #333;padding:0 6px;min-width:80mm;display:inline-block;}
.weeklabel{font-size:16px;color:#555;margin-bottom:3mm;}

.grid{display:grid;grid-template-columns:repeat(7,1fr);gap:3mm;flex:1;min-height:150mm;}
.day{border:3px solid var(--line);border-radius:4mm;display:flex;flex-direction:column;overflow:hidden;background:#fff;}
.day.wk6{background:var(--sat);}
.day.wk0{background:var(--sun);}
.day.holiday{background:#ffe0e0; border-color:var(--hol);}

.dhead{padding:2mm 1mm 1mm;text-align:center;border-bottom:2px dashed #999;}
.dw{font-size:30px;font-weight:900;}
.dd{font-size:20px;font-weight:700;}
.badge{display:inline-block;font-size:22px;margin-left:2px;}

.lunch{padding:1.5mm 2mm;border-bottom:2px dashed #999;font-size:15px;display:flex;align-items:center;gap:1mm;}
.lunch span{font-size:19px;}
.lunch select{border:none;background:transparent;font-size:15px;width:100%;outline:none;font-family:inherit;color:#333;}

.plan{height:40%;padding:2mm;font-size:17px;line-height:1.5;outline:none;white-space:pre-wrap;overflow:hidden;}
.plan:empty::before{content:"今日去邊？";color:#ccc;font-size:22px;}

.draw{border-top:2px dashed #999;flex:1;position:relative;cursor:pointer;display:flex;align-items:center;justify-content:center;overflow:hidden;}
.draw::before{content:"🖍️ 畫畫";position:absolute;bottom:1mm;right:2mm;color:#ddd;font-size:14px;pointer-events:none;}
.draw img{max-width:100%;max-height:100%;object-fit:contain;display:block;margin:auto;}
.draw.has-draw::before{content:"✏️ 改畫";color:#aaa;}

/* ---------- 畫畫 modal ---------- */
.draw-modal{position:fixed;inset:0;z-index:100;background:#fff;display:flex;flex-direction:column;}
.draw-modal[hidden]{display:none!important;}
.dm-toolbar{display:flex;flex-wrap:wrap;gap:8px;align-items:center;padding:10px 14px;background:#f4f4f6;border-bottom:1px solid #ddd;}
.dm-title{font-size:17px;margin-right:4px;}
.dm-tools{display:flex;gap:4px;}
.dm-tools button,.dm-actions button{border:1px solid #ccc;background:#fff;border-radius:8px;padding:6px 10px;cursor:pointer;font-size:14px;}
.dm-tools button.active{background:#333;color:#fff;border-color:#333;}
.dm-colors{display:flex;gap:4px;}
.dm-colors button{width:26px;height:26px;border-radius:50%;border:2px solid #fff;box-shadow:0 0 0 1px #ccc;cursor:pointer;padding:0;}
.dm-colors button span{opacity:0;}
.dm-colors button.active{box-shadow:0 0 0 2px #333;}
.dm-size{font-size:13px;display:flex;align-items:center;gap:4px;}
.dm-size input{width:70px;}
.dm-status{font-size:13px;color:#2b8a3e;}
.dm-actions{margin-left:auto;display:flex;gap:6px;}
.dm-actions .dim{color:#666;}
.dm-actions .ok{background:#51cf66;border-color:#51cf66;color:#fff;font-weight:700;}
.dm-canvas-wrap{flex:1;position:relative;overflow:hidden;}
.dm-canvas-wrap canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;cursor:crosshair;}
.dm-note{text-align:center;color:#999;font-size:13px;padding:6px;}

.hint{color:#999;font-size:13px;text-align:center;margin-top:2mm;}

/* ---------- responsive: 手機 / pad ---------- */
.sheet-scroll{max-width:100%;overflow-x:auto;-webkit-overflow-scrolling:touch;}
.sheet{width:297mm;min-height:210mm;margin:0 auto;background:#fff;padding:8mm;display:flex;flex-direction:column;}
@media (max-width:900px){
  body{padding:8px;}
  .toolbar{gap:8px;padding:10px;max-width:100%;}
  .toolbar label{display:flex;align-items:center;gap:6px;width:100%;}
  .toolbar button{font-size:15px;padding:7px 12px;flex:1 1 auto;}
  .toolbar button.print{flex:1;}
  .sheet-scroll{margin:0 -8px;padding:0 8px;}
  .sheet{width:297mm;min-height:auto;}
}
@media (max-width:1180px){
  .draw-modal .dm-toolbar{gap:6px;padding:8px 10px;}
  .dm-tools{flex-wrap:wrap;}
  .dm-colors{gap:3px;}
  .dm-colors button{width:24px;height:24px;}
  .dm-size{width:100%;}
  .dm-size input{flex:1;}
  .dm-actions{margin-left:0;width:100%;justify-content:flex-end;}
}

/* print: A4 landscape, hide toolbar + parent panel */
@page{size:A4 landscape;margin:0;}
@media print{
  body{background:#fff;padding:0;}
  .toolbar,.hint,.parent-panel,.draw-modal{display:none!important;}
  .sheet{box-shadow:none;margin:0;width:297mm;min-height:210mm;}
}