:root{font-family:system-ui,-apple-system,"Segoe UI",sans-serif;color:#403925;background:#f3f1eb;font-synthesis:none;color-scheme:light}
*{box-sizing:border-box}
[hidden]{display:none!important}
body{margin:0}
button,textarea,summary,a{font:inherit}
button,a,summary{-webkit-tap-highlight-color:transparent}
button{color:inherit;background:transparent;border:1px solid transparent;border-radius:5px;cursor:pointer}
button:hover,summary:hover{background:#6b552310}
button:focus-visible,summary:focus-visible,a:focus-visible{outline:2px solid #8a671d;outline-offset:2px}
button:disabled{opacity:.45;cursor:default}
button svg{display:block;width:16px;height:16px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}
.board{max-width:1280px;margin:0 auto;padding:24px}
.board-header{display:flex;align-items:center;gap:16px;margin:0 0 22px}
h1{margin:0;flex:1;font-size:23px;font-weight:600;letter-spacing:-.5px}
.new-note{display:inline-flex;gap:7px;align-items:center;padding:8px 11px;background:#fff7c8;border-color:#c7b870}
.notes-board{display:grid;grid-template-columns:repeat(auto-fill,minmax(240px,1fr));gap:18px;align-items:start}
.note-card,.single-editor{background:#fff3b0;border:1px solid #d6c983;border-radius:5px;box-shadow:0 3px 10px #392e1710;display:flex;flex-direction:column}
.note-card{height:250px}
.note-toolbar{height:35px;min-height:35px;display:flex;align-items:center;gap:3px;padding:3px 5px;border-bottom:1px solid #7860231b;background:#fff7c029}
.note-toolbar button,.note-toolbar summary{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:28px;min-height:27px;padding:4px 6px;font-size:12px;line-height:1;border-radius:4px}
.note-toolbar .note-name{flex:1;min-width:0;white-space:nowrap;text-overflow:ellipsis;overflow:hidden;padding:0 5px;font-size:12px;color:#736333}
.note-toolbar .delete-note{margin-left:auto}
.note-text{display:block;width:100%;min-width:0;flex:1;min-height:0;padding:13px 14px;color:#3c3520;background:transparent;border:0;outline:0;resize:none;font:17px/1.5 system-ui,-apple-system,"Segoe UI",sans-serif;tab-size:4;overflow:auto;overflow-wrap:anywhere}
.note-text::placeholder{color:#897d4d;opacity:1}
.note-footer{min-height:22px;display:flex;align-items:center;gap:5px;padding:2px 9px;color:#87764b;font-size:10px;line-height:1.3;border-top:1px solid #7860230e}
.note-status{flex:1;min-width:0}
.note-footer button{font-size:11px;text-decoration:underline;padding:2px 4px;white-space:nowrap}
.note-footer .storage-error{color:#8d351d}
.board-footer{display:flex;align-items:center;gap:8px;min-height:32px;margin-top:17px;color:#716b5c;font-size:12px}
.board-footer button{padding:4px;text-decoration:underline}
.saved-notes{position:relative}
.saved-notes summary{list-style:none;cursor:pointer;user-select:none}
.saved-notes summary::-webkit-details-marker{display:none}
.saved-notes[open] summary{background:#6b552318}
.note-menu{position:absolute;z-index:2;left:-31px;top:31px;width:220px;max-width:calc(100vw - 10px);max-height:min(260px,65vh);padding:4px;background:#fff9db;border:1px solid #bfb17a;border-radius:5px;box-shadow:0 7px 20px #3e310b26;overflow:auto}
.note-menu button{display:block;text-align:left;width:100%;padding:8px;font-size:12px;line-height:1.35;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.note-menu button[aria-current="true"]{background:#e7d786}
.note-save-menu{position:relative;flex:none}.note-save-menu summary{list-style:none;cursor:pointer;user-select:none}.note-save-menu summary::-webkit-details-marker{display:none}.note-save-menu[open] summary{background:#6b552318}.note-save-actions{position:absolute;z-index:3;right:0;top:31px;width:170px;max-width:calc(100vw - 10px);padding:4px;background:#fff9db;border:1px solid #bfb17a;border-radius:5px;box-shadow:0 7px 20px #3e310b26}.note-save-actions button{display:block;text-align:left;width:100%;padding:8px;font-size:12px;line-height:1.35;white-space:nowrap}.note-save-actions button+button{border-top:1px solid #d5c792;border-radius:0;margin-top:3px}
.single-editor{height:calc(100dvh - 48px);min-height:180px;max-width:640px;margin:24px auto}
.back-link{font-size:12px;color:inherit;text-decoration:none;padding:5px}
.embedded{background:#fff3b0;overflow:hidden}
.embedded #app{height:100dvh;min-height:0}
.embedded .single-editor{height:100%;min-height:0;max-width:none;margin:0;border:0;border-radius:0;box-shadow:none}
.embedded .note-text{padding:10px 12px;font-size:16px;line-height:1.45}
.embedded .note-footer{min-height:20px}
.empty-board{color:#77705f;font-size:14px;padding:20px 0}
.single-editor .note-save-actions{left:0;right:auto}
.board-header .note-open-menu summary{padding:8px 11px;font-size:13px;border:1px solid #c7b870;border-radius:5px;background:#fff7c8}.board-header .note-open-menu .note-save-actions{top:calc(100% + 4px)}.note-open-menu .note-save-actions{width:185px}
@media(max-width:560px){.board{padding:16px}.board-header{margin-bottom:16px}.notes-board{gap:14px}.single-editor{height:calc(100dvh - 24px);margin:12px}.board-header h1{font-size:21px}}