:root{font-family:Arial,sans-serif;color:#283039;background:#e9e6df}*{box-sizing:border-box}body{margin:0}button,input,select{font:inherit}button{cursor:pointer}#app{height:100dvh;display:flex;flex-direction:column;overflow:hidden}header{height:62px;display:flex;align-items:center;justify-content:space-between;padding:0 26px;background:#f7f4eb;border-bottom:1px solid #ccc5b6}.brand{font-family:Georgia,serif;font-size:21px;letter-spacing:.13em}.brand small{display:block;font:9px Arial;letter-spacing:.3em;color:#8a867d}.weeknav{display:flex;align-items:center;gap:14px}.weeknav button{border:0;background:transparent;font-size:25px}.weeknav strong{min-width:240px;text-align:center;font:17px Georgia}.status{font:10px Arial;letter-spacing:.13em;background:#e9d5bd;padding:8px 10px;border-radius:20px}#notice{padding:7px 24px;background:#fff8df;font-size:12px;text-align:center}main{flex:1;min-height:0;display:flex;padding:18px 18px 12px 22px;gap:0}.sheet{background:#fffefa;border-radius:22px 12px 12px 22px;box-shadow:0 8px 30px #4d443329;flex:1;min-width:0;display:flex;flex-direction:column;overflow:hidden}.note-strip{height:44px;display:flex;gap:30px;align-items:center;padding:0 42px;border-bottom:1px solid #ddd7c9;color:#9a978e;font-size:11px;letter-spacing:.1em}.note-strip span:first-child{color:#313940;font-weight:bold}.spread{display:grid;grid-template-columns:1fr 1fr;flex:1;min-height:0}.page{padding:18px 5% 22px;display:flex;flex-direction:column;min-height:0}.left{border-right:3px double #d5d0c7}.pagehead{display:flex;justify-content:space-between;border-bottom:1px solid #333b3f;padding:0 1px 10px;margin-bottom:2px;font:15px Georgia;letter-spacing:.09em}.daygrid{display:flex;flex-direction:column;flex:1;min-height:0}.day{position:relative;border-bottom:1px solid #7c7c75;min-height:0;flex:1;overflow:hidden;background-image:radial-gradient(#aeb0ad .8px,transparent 1px);background-size:26px 27px;background-position:0 43px}.day.weekend{flex:.68}.dayhead{position:absolute;top:8px;left:8px;z-index:2;font:17px Georgia;background:#fffefaee;padding:1px 4px}.dayhead b{font-size:20px;font-weight:400}.day canvas{position:absolute;inset:0;width:100%;height:100%;touch-action:none;z-index:3}.events{position:absolute;inset:0;pointer-events:none;z-index:1}.event{position:absolute;max-width:85%;font-family:"Comic Sans MS","Segoe Print",cursive;font-size:19px;color:#172d40;background:#fffefadd;padding:2px 6px;border-radius:4px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.event small{font:11px Arial;color:#6f7e88;display:block}.tabs{display:flex;flex-direction:column;justify-content:space-around;width:29px}.tabs button{height:8.1%;border:0;border-radius:0 7px 7px 0;background:#d8d3c8;font-size:9px;writing-mode:vertical-rl;color:#555;letter-spacing:.07em}.tabs button.current{background:#566a71;color:white}footer{min-height:60px;background:#f7f4eb;border-top:1px solid #d0c9ba;display:flex;align-items:center;justify-content:space-between;padding:8px 22px;gap:8px}.tools,.extras{display:flex;align-items:center;gap:7px}.tools button,.extras button,.dialog-actions button{border:1px solid #c9c6be;background:white;border-radius:8px;padding:9px 12px;font-size:13px}.tools button.selected{background:#263940;color:white}.tools label{font-size:12px;display:flex;align-items:center;gap:5px;margin-left:6px}input[type=color]{width:31px;height:30px;border:0;background:transparent}#debug{position:absolute;right:34px;bottom:68px;width:295px;max-height:60vh;overflow:auto;background:#fffefa;z-index:9;border:1px solid #c9c2b6;border-radius:12px;padding:17px;box-shadow:0 10px 30px #0003;font-size:13px}#debug h2,dialog h2{margin:0 0 12px;font:20px Georgia}#debug select{display:block;width:100%;margin:7px 0 13px;padding:7px}#debugData{white-space:pre-wrap;line-height:1.5}dialog{border:1px solid #c9c2b6;border-radius:14px;padding:22px;max-width:450px}dialog::backdrop{background:#1c272994}dialog input{display:block;width:100%;margin-top:6px;padding:9px}.dialog-actions{display:flex;flex-wrap:wrap;gap:8px;margin-top:18px}#toast{position:absolute;bottom:72px;left:50%;transform:translateX(-50%);background:#283940;color:white;border-radius:8px;padding:9px 14px;opacity:0;pointer-events:none;transition:.2s}#toast.show{opacity:1}#writingHint{font-size:11px;color:#6a6255;white-space:nowrap}#finishWriting:disabled{opacity:.4;cursor:default}#finishWriting:not(:disabled){background:#263940;color:white}@media(orientation:portrait){main,footer,header,#notice{display:none}#app:after{content:"Bitte das iPad ins Querformat drehen";position:absolute;inset:0;display:grid;place-items:center;text-align:center;padding:30px;font:24px Georgia;background:#f7f4eb}}@media(max-width:850px){header{height:48px;padding:0 10px}.brand{font-size:15px}.weeknav strong{min-width:150px;font-size:13px}.status{font-size:8px}main{padding:7px}.page{padding:8px 4%}.note-strip{height:29px;padding:0 15px}.dayhead{font-size:13px}.dayhead b{font-size:16px}footer{min-height:48px;padding:4px}.tools button,.extras button{padding:6px;font-size:11px}#writingHint{display:none}}
#app, #app main, #app .sheet, #app .page, #app .day, #app canvas { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; -webkit-tap-highlight-color: transparent; } #app .day, #app canvas { touch-action: none; } #app input, #app select { -webkit-user-select: text; user-select: text; }
.sheet, .sheet * { -webkit-user-select: none; user-select: none; -webkit-touch-callout: none; }
.sheet { position: relative; touch-action: none; }
#noteCanvas { position: absolute; inset: 0; width: 100%; height: 100%; z-index: 5; pointer-events: none; touch-action: none; }
.note-mode #noteCanvas, .eraser-mode #noteCanvas { pointer-events: auto; }
.tabs { width: 22px; }
.tabs button { width: 100%; padding: 0; text-align: center; }

/* Paper surface and compact iPad controls. */
#app { position:relative; }
header { height:44px; flex:none; padding:0 18px; }
.brand { font-size:15px; }
.brand small { font-size:7px; }
.weeknav button { font-size:17px; padding:4px; }
.weeknav strong { font-size:13px; }
.status { font-size:8px; padding:5px 8px; }
#notice { font-size:10px; padding:3px 8px; }
main { padding:7px 0 7px 10px; }
.sheet { box-shadow:0 4px 15px #4d443321; border-radius:12px 0 0 12px; }
.note-strip { flex:0 0 8%; min-height:32px; height:auto; }
.left { border-right:3px double #d5d0c7; box-shadow:inset -7px 0 9px -9px #555; }
.page { padding:10px 4% 12px; }
.pagehead { font-size:12px; padding-bottom:6px; }
#rightDays .day:nth-child(-n+2) { flex:1.4; }
#rightDays .day:nth-child(n+3) { flex:.6; }
.day { background-image:radial-gradient(#b7b9b6 .7px,transparent 1px); border-color:#969a97; }
.dayhead { font-size:14px; }
.dayhead b { font-size:17px; }
.events { z-index:4; }
.event { max-width:80%; padding:0; border-radius:0; background:none; font-family:Noteworthy,"Segoe Print","Comic Sans MS",cursive; font-size:clamp(12px,1.6vw,20px); line-height:1.05; white-space:normal; overflow:visible; text-overflow:clip; pointer-events:auto; cursor:pointer; }
.event small { background:none; font-size:9px; color:inherit; opacity:.7; }
.event.all-day { writing-mode:vertical-rl; text-orientation:mixed; white-space:normal; max-width:20px; max-height:90px; font-size:clamp(11px,1.2vw,15px); }
.event.hidden-event { opacity:.7; }
.hidden-toggle { position:absolute; top:5px; right:5px; z-index:6; border:0; background:#fffefaad; color:#777; font-size:16px; width:24px; height:24px; padding:0; }
.hidden-toggle[hidden] { display:none; }
#noteCanvas, .note-mode #noteCanvas, .eraser-mode #noteCanvas { pointer-events:none; }
.tabs { align-self:stretch; width:25px; justify-content:stretch; }
.tabs button { flex:1; height:auto; min-height:0; border-bottom:1px solid #bcb8af; border-radius:0 5px 5px 0; }
footer { position:absolute; z-index:8; bottom:12px; left:50%; transform:translateX(-50%); min-height:0; width:max-content; max-width:calc(100% - 70px); padding:5px 7px; border:1px solid #d0c9ba; border-radius:15px; background:#f7f4ebed; box-shadow:0 2px 12px #0002; }
.tools button,.extras button { padding:5px 8px; font-size:11px; }
.tools,.extras { gap:4px; }
.tools label { margin-left:3px; }
input[type=color] { width:25px; height:26px; }
#eventEditor { width:min(470px,90vw); max-height:90dvh; overflow:auto; }
#eventEditor form { display:grid; gap:9px; }
#eventEditor label { display:grid; gap:4px; font-size:12px; }
#eventEditor input,#eventEditor select,#eventEditor textarea { width:100%; border:1px solid #c9c2b6; border-radius:7px; padding:7px; background:#fff; color:#283039; }
#eventEditor .edit-row { display:grid; grid-template-columns:1fr 1fr; gap:12px; align-items:end; }
#eventEditor .check-label { display:flex; align-items:center; }
#editAllDay { width:auto!important; }
#timeFields[hidden] { display:none; }
#eventEditor .dialog-actions { justify-content:flex-end; }
#editDelete { color:#a13b37; }
#editSave { background:#263940; color:white; }
@media(max-width:850px){
  header { height:38px; }
  .note-strip { min-height:27px; }
  .page { padding:6px 3% 8px; }
  .dayhead { font-size:11px; }
  .dayhead b { font-size:13px; }
  footer { bottom:5px; }
  .tools button,.extras button { padding:4px 5px; font-size:10px; }
}
