:root {font-family:system-ui,sans-serif;color:var(--neutral-900);background:var(--mist-050)}*{box-sizing:border-box}body{margin:0}main{max-width:1500px;margin:auto;padding:28px;display:grid;grid-template-columns:minmax(270px,340px) minmax(0,1fr);gap:24px;align-items:start}.panel{background:var(--white);border:1px solid var(--mist-200);border-radius:14px;padding:24px;box-shadow:0 6px 24px var(--fx-shadow-subtle)}h1{font-size:32px;margin:6px 0 28px}h2{font-size:22px}.eyebrow{font-size:11px;letter-spacing:.16em;color:var(--neutral-300)}label{display:grid;gap:8px;font-size:14px}button,input,select,textarea{font:inherit}button,select,input[type=number]{min-height:44px;border:1px solid var(--mist-400);border-radius:8px;padding:9px 12px;background:var(--white);color:inherit}button{cursor:pointer}button:disabled{opacity:.5;cursor:default}select,textarea{max-width:100%;width:100%}.primary{background:var(--neutral-700);color:var(--white);width:100%;font-weight:700}.settings{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin:24px 0}.settings input{width:100%}.checks{display:flex;gap:20px;margin-bottom:20px}.checks label{display:flex;align-items:center}.hint,#storage-status,#catalog-status,#audio-status{font-size:13px;line-height:1.6;color:var(--neutral-300)}.note-heading{display:flex;justify-content:space-between;align-items:center;gap:12px}fieldset{border:0;padding:0;margin:0;min-width:0}textarea{resize:vertical;border:1px solid var(--mist-400);border-radius:8px;padding:14px;line-height:1.6;margin:8px 0 20px}.tools{display:flex;flex-wrap:wrap;gap:8px;align-items:center;margin-bottom:12px}.tools label{display:flex;align-items:center}.tools select{width:auto}.tools [aria-pressed=true]{background:var(--neutral-700);color:var(--white)}a{color:var(--blue-900)}[hidden]{display:none!important}:focus-visible{outline:3px solid var(--gold-500);outline-offset:3px}@media(max-width:850px){main{grid-template-columns:1fr;padding:12px}.panel{padding:18px}}
fieldset:disabled #board{pointer-events:none;opacity:.5}
#editor .note-controls{display:flex;align-items:center;gap:1rem}
#editor .note-toolbar,#editor .note-asset-chooser{min-width:0}
#editor #note-attachments{display:flex;flex-wrap:wrap;gap:8px;margin:12px 0}
.picture-window{position:fixed;width:min(480px,calc(100vw - 16px));max-height:calc(100dvh - 16px);overflow:auto;background:var(--white);border:1px solid var(--mist-400);border-radius:12px;box-shadow:0 12px 40px var(--fx-shadow-strong)}
.picture-window-bar{display:flex;position:sticky;top:0;background:var(--mist-050);border-bottom:1px solid var(--mist-200);padding:4px;gap:8px}
.picture-window-handle{flex:1;text-align:left;cursor:move;touch-action:none}
.picture-window img{display:block;width:100%;height:100%;min-height:0;object-fit:contain;padding:8px 8px 28px}
@media(max-width:600px){#editor .note-controls{flex-wrap:wrap;gap:0}}

.picture-window{display:grid;grid-template-rows:auto minmax(0,1fr);height:310px;min-width:min(240px,100vw);min-height:min(160px,100dvh);max-width:100vw;overflow:hidden}
.picture-window-resize{position:absolute;right:0;bottom:0;width:36px;height:30px;min-height:30px;padding:0;border-radius:8px 0 0 0;cursor:nwse-resize;touch-action:none}

#editor{position:relative}
#editor .note-controls{padding-right:56px;min-height:60px}
#editor #note-delete{position:absolute;right:0;top:8px;width:44px;height:44px;min-height:44px;padding:10px;display:grid;place-items:center;color:var(--red-600);background:var(--red-50);border:1px solid var(--red-300);border-radius:12px}
#editor #note-delete.trash-ready{border:2px dashed var(--red-600)}
#editor #note-delete.trash-over{color:var(--white);background:var(--red-600);transform:scale(1.1)}
#editor #note-attachments .note-picture-icon{display:grid;place-items:center;flex:0 0 44px;width:44px;height:44px;padding:0;text-decoration:none;font-size:14px;font-weight:700}
#editor .note-asset-chooser .btn,#editor .note-picture-icon{touch-action:none;user-select:none;-webkit-user-select:none;cursor:grab}
#editor .trash-dragging{opacity:.45;cursor:grabbing}
.trash-drag-preview{position:fixed;z-index:100000;pointer-events:none;border-radius:12px;padding:12px;background:var(--neutral-500);color:var(--white);box-shadow:0 4px 14px var(--fx-shadow-strong)}
#editor:disabled #note-attachments{pointer-events:none;opacity:.5}

#editor .note-asset-chooser .btn,#editor #note-attachments .note-picture-icon{background:var(--note-color);border-color:var(--note-color);color:var(--note-ink)}
#editor .note-asset-chooser .btn[aria-pressed="true"]{box-shadow:0 0 0 2px var(--white),0 0 0 4px var(--note-color);font-weight:700}

input,select,textarea{background:var(--white);color:var(--neutral-900);accent-color:var(--blue-900)}
textarea::placeholder{color:var(--neutral-300)}
:root{--mp-drawer-shadow:var(--elevation-2)}

#text{min-height:182px;max-height:70vh;overflow:auto;resize:vertical;white-space:pre-wrap;overflow-wrap:anywhere;border:1px solid var(--mist-400);border-radius:8px;padding:14px;line-height:1.6;margin:8px 0 20px;background:var(--white);color:var(--neutral-900)}
#text:empty::before{content:attr(data-placeholder);color:var(--neutral-300);pointer-events:none}
#text .template-instruction{color:var(--red-600);font-style:italic}