.notes-module{--note-yellow:#fff7d8;--note-pink:#f8e6df;--note-sage:#eef1e6}.notes-toolbar{display:flex;gap:8px;flex-wrap:wrap;align-items:center}.notes-toolbar .btn{padding:9px 14px;gap:6px}.notes-status{font-size:12px;min-height:20px;margin:12px 0;color:var(--muted)}.notes-recovery:not(:empty){padding:16px;background:#f7e1d2;border:1px solid #cf9176;border-radius:9px;margin-bottom:15px}.notes-recovery .btn{margin:4px}.notes-viewport{height:600px;height:min(65vh,700px);min-height:360px;position:relative;overflow:hidden;border:1px solid var(--line);border-radius:12px;background-color:#edece3;background-image:radial-gradient(#bfc6b5 1px,transparent 1px);background-size:22px 22px;touch-action:none;isolation:isolate;cursor:grab}.notes-viewport:focus-visible{outline:3px solid var(--orange);outline-offset:3px}.notes-board{position:absolute;inset:0;transform-origin:0 0}.notes-card{position:absolute;width:275px;background:var(--note-yellow);border:1px solid #e8dfbd;border-radius:8px;box-shadow:0 5px 14px #344d3810;overflow:hidden;cursor:default}.notes-card.notes-checklist{background:var(--note-sage);border-color:#d4dccb}.notes-card.notes-image{background:var(--white);border-color:var(--line)}.notes-drag{display:block;width:100%;text-align:left;padding:14px 17px;border:0;border-bottom:1px solid #0000000c;background:#ffffff24;font-weight:650;color:var(--ink);cursor:grab;overflow-wrap:anywhere;touch-action:none}.notes-drag:active{cursor:grabbing}.notes-drag:focus-visible{outline-offset:-3px}.notes-dragging{z-index:2;box-shadow:0 10px 22px #253c3528}.notes-copy{padding:16px 17px;margin:0;white-space:pre-wrap;overflow-wrap:anywhere;font-size:14px;max-height:350px;overflow:auto;touch-action:pan-y}.notes-card img{display:block;width:100%;max-height:340px;object-fit:contain;padding:10px;pointer-events:none}.notes-tasks{padding:12px 17px;max-height:350px;overflow:auto;touch-action:pan-y}.notes-task{display:flex;gap:10px;align-items:flex-start;padding:5px 0;font-size:14px;overflow-wrap:anywhere}.notes-task input{margin:6px 0 0;accent-color:var(--green);flex-shrink:0}.notes-task span{min-width:0}.notes-task:has(input:checked) span{text-decoration:line-through;color:var(--muted)}.notes-card-actions{display:flex;justify-content:flex-end;border-top:1px solid #00000009;padding:0 6px}.notes-card-actions .plain{font-size:11px;min-height:38px}.notes-empty{width:min(440px,90%);margin:90px auto;text-align:center;color:var(--muted);pointer-events:none}.notes-empty h2{font:27px var(--serif);color:var(--ink);margin:10px 0}.notes-empty p{font-size:13px}.notes-empty small{font-size:10px}.notes-empty-mark{font-size:48px;color:var(--orange)}.notes-view-controls{justify-content:flex-end;margin-top:10px}.notes-view-controls .btn{min-width:43px}.notes-view-controls span{min-width:45px;text-align:center}.notes-list{height:auto;max-height:none;min-height:360px;overflow:visible;touch-action:auto;padding:20px;cursor:default}.notes-list .notes-board{position:static;display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;align-items:start}.notes-list .notes-card{position:static;width:auto}.notes-list .notes-drag{cursor:default;touch-action:auto}.notes-list .notes-empty{grid-column:1/-1}.notes-dialog{border:1px solid var(--line);border-radius:14px;background:var(--white);color:var(--ink);width:min(520px,92vw);max-height:90vh;padding:26px}.notes-dialog::backdrop{background:#20372b66}.notes-dialog h2{margin-bottom:20px}.notes-field{display:block;font-size:12px;margin:14px 0}.notes-field input,.notes-field textarea{display:block;width:100%;margin-top:6px;border:1px solid #bfc9b9;border-radius:6px;background:white;color:var(--ink);padding:10px;font:14px var(--sans)}.notes-field textarea{resize:vertical}.notes-field input:focus,.notes-field textarea:focus{outline:2px solid var(--green);outline-offset:1px}@media(max-width:560px){.notes-toolbar .btn{font-size:11px;padding:9px 11px}.notes-list{padding:12px}.notes-list .notes-board{grid-template-columns:1fr}.notes-viewport:not(.notes-list){height:60vh}.notes-module .help{font-size:10px}.notes-empty{margin:55px auto}.notes-dialog{padding:20px}}
.notes-drawing-toolbar{padding:10px;background:var(--white);border:1px solid var(--line);border-radius:10px;margin:10px 0}.notes-drawing-toolbar .btn{font-size:11px;min-height:36px;padding:6px 10px}.notes-drawing-toolbar [aria-pressed=true]{background:var(--green);color:var(--white);border-color:var(--green)}.notes-tool-field{display:flex;gap:7px;align-items:center;font-size:11px;padding:2px 5px}.notes-tool-field input[type=color]{width:34px;height:30px;padding:2px;border:1px solid var(--line);border-radius:5px;background:var(--white)}.notes-tool-field select{border:1px solid var(--line);border-radius:5px;background:var(--white);color:var(--ink);padding:6px;font:inherit}.notes-drawing-layer{position:absolute;left:-10000px;top:-10000px;overflow:visible;pointer-events:none;z-index:3}.notes-drawing-hit{cursor:move}.notes-viewport[data-tool=erase] .notes-drawing-hit{cursor:crosshair}.notes-viewport[data-tool=pan]{cursor:grab}.notes-viewport[data-tool=brush],.notes-viewport[data-tool=arrow],.notes-viewport[data-tool=line],.notes-viewport[data-tool=rectangle],.notes-viewport[data-tool=ellipse]{cursor:crosshair}.notes-viewport:not([data-tool=select]) .notes-card{pointer-events:none}.notes-selected{box-shadow:0 0 0 2px var(--orange),0 5px 14px #344d3810}.notes-resize{position:absolute;right:0;bottom:0;width:23px;height:23px;background:transparent;border:0;color:var(--muted);cursor:ew-resize;touch-action:none}.notes-card-actions{padding-right:24px}.notes-list .notes-resize,.notes-list .notes-drawing-layer{display:none}.notes-list .notes-card{pointer-events:auto!important}.notes-drawing-summary{grid-column:1/-1;background:var(--white);border:1px solid var(--line);padding:12px;border-radius:8px;font-size:12px}.notes-drawing-summary .btn{margin-left:8px}.notes-tools-list:after{content:'Buka tampilan papan untuk menggambar.';font-size:11px;color:var(--muted);padding:4px}.notes-toolbar button:disabled{opacity:.45}.notes-card:focus-within{z-index:2}.notes-viewport:not([data-tool=select]) .notes-drawing-hit{cursor:inherit}

.notes-card.notes-heading{background:transparent;border:1px solid transparent;box-shadow:none;overflow:visible}.notes-heading .notes-drag{font-size:30px;line-height:1.25;font-weight:750;background:transparent;border:0;padding:12px 14px}.notes-heading .notes-card-actions{border:0;opacity:0}.notes-heading:hover .notes-card-actions,.notes-heading:focus-within .notes-card-actions,.notes-heading.notes-selected .notes-card-actions{opacity:1}.notes-heading.notes-selected{outline:2px dashed var(--orange)}.notes-viewport[data-tool=connect] .notes-card{pointer-events:auto;cursor:crosshair}.notes-viewport[data-tool=connect] .notes-drag{cursor:crosshair}.notes-viewport[data-tool=connect] .notes-drawing-hit{pointer-events:none}
