:root{color-scheme:dark;font-family:ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,sans-serif;line-height:1.5}*{box-sizing:border-box;margin:0;padding:0}html,body,#root{height:100%;overflow:hidden;background:#1a1a2e;color:#fafafa}.app{display:flex;flex-direction:column;height:100vh}.header{display:flex;align-items:center;justify-content:space-between;padding:.75rem 1.5rem;background:#0000004d;border-bottom:1px solid rgba(255,255,255,.08);flex-shrink:0}.header h1{font-size:1.3rem;font-weight:700;letter-spacing:-.02em;background:linear-gradient(135deg,#ff6b6b,#feca57,#48dbfb,#ff9ff3);background-clip:text;-webkit-background-clip:text;color:transparent}.add-btn{padding:.5rem 1.2rem;border:none;border-radius:.5rem;background:#6c5ce7;color:#fff;font-size:.9rem;font-weight:600;cursor:pointer;transition:background .2s,transform .1s}.add-btn:hover{background:#7c6cf7;transform:scale(1.05)}.add-btn:active{transform:scale(.95)}.board{flex:1;position:relative;overflow:hidden;background:radial-gradient(circle at 20% 30%,rgba(108,92,231,.08) 0%,transparent 50%),radial-gradient(circle at 80% 70%,rgba(255,107,107,.06) 0%,transparent 50%),#1a1a2e}.note{position:absolute;width:160px;height:160px;padding:1.5rem 1rem 1rem;border-radius:.25rem;cursor:grab;-webkit-user-select:none;user-select:none;box-shadow:2px 4px 12px #0000004d,inset 0 -2px #00000014;transition:box-shadow .2s;display:flex;align-items:flex-start}.note:before{content:"";position:absolute;top:0;left:50%;transform:translate(-50%);width:30px;height:10px;background:#0000001a;border-radius:0 0 4px 4px}.note:hover{box-shadow:4px 8px 20px #0006,inset 0 -2px #00000014}.note.dragging{cursor:grabbing;box-shadow:8px 16px 32px #00000080,inset 0 -2px #00000014;opacity:.9}.note-text{font-size:.85rem;font-weight:600;color:#000000bf;word-break:break-word;line-height:1.4;pointer-events:none}.note-edit{width:100%;height:100%;border:none;background:transparent;font-size:.85rem;font-weight:600;color:#000000bf;resize:none;outline:none;font-family:inherit;line-height:1.4}.note-delete{position:absolute;top:4px;right:6px;width:22px;height:22px;border:none;background:#00000026;color:#00000080;font-size:1rem;border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;opacity:0;transition:opacity .2s,background .2s;line-height:1}.note:hover .note-delete{opacity:1}.note-delete:hover{background:#0000004d;color:#000c}