:root{--note-bg-color:#ffffffe6;--note-bg-gradient:linear-gradient(135deg,#fff,#f5f5f5);--note-shadow:0 6px 20px #00000014;--note-shadow-active:0 10px 30px #00000026;--body-font:-apple-system,BlinkMacSystemFont,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;--btn-gradient:linear-gradient(135deg,#89f7fe,#66a6ff)}.quotes-wall-container{-webkit-user-select:none;user-select:none;will-change:transform;backface-visibility:hidden;contain:layout style paint;background-color:#fff;background-image:radial-gradient(#d0d0d0 1px,#0000 1px);background-size:20px 20px;width:100%;height:auto;min-height:calc(100vh - 64px);position:relative;overflow:hidden}#notes-container{cursor:grab;will-change:transform;touch-action:none;contain:layout style paint;backface-visibility:hidden;pointer-events:auto;width:100%;height:auto;min-height:calc(100vh - 64px);padding:20px;transition:transform .1s ease-out;position:relative;overflow:visible;transform:translateZ(0)}#notes-container.panning{cursor:grabbing}.note{width:280px;min-height:180px;box-shadow:var(--note-shadow);cursor:grab;-webkit-user-select:none;user-select:none;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);touch-action:none;will-change:transform;contain:layout style paint;backface-visibility:hidden;pointer-events:auto;border:1px solid #ffffff80;border-radius:12px;padding:20px;transition:all .3s,transform .1s;position:absolute;overflow:hidden;transform:translateZ(0)}@media (max-width:1200px){.note{width:250px;min-height:160px}}@media (max-width:768px){.note{width:200px;min-height:140px;padding:15px;font-size:14px}#notes-container{padding:10px}.quotes-wall-container,#notes-container{min-height:calc(100vh - 60px)}#add-note-container{width:95%;bottom:20px}#add-note-form{flex-direction:column;gap:10px;padding:10px}#note-select{padding:12px 16px;font-size:14px}#add-note-form button{width:100%;height:50px}}@media (max-width:480px){.note{width:180px;min-height:120px;padding:12px;font-size:13px}.reset-view-button{padding:6px 10px;font-size:11px;bottom:110px;right:15px}}@media (orientation:landscape) and (max-height:500px){.quotes-wall-container,#notes-container{min-height:calc(100vh - 50px)}.note{width:180px;min-height:120px;padding:12px;font-size:13px}#add-note-container{width:40%;left:auto;right:20px;transform:none}}.note:hover{box-shadow:var(--note-shadow-active);z-index:100;transform:scale(1.02)rotate(0)!important}.note:active{cursor:grabbing;box-shadow:var(--note-shadow-active);z-index:1000;transition:transform .2s,box-shadow .2s;transform:scale(1.05)!important}.note.dragging{opacity:.8;z-index:1000;will-change:transform;pointer-events:auto;cursor:grabbing;-webkit-user-select:none;user-select:none;transition:none;transform:rotate(5deg)scale(1.05)translateZ(0);box-shadow:8px 8px 20px #00000040}.note.snapped{border:1px solid #64c8ff4d;box-shadow:0 0 15px #64c8ff80}.note.collision{border:1px solid #ff64644d;box-shadow:0 0 15px #ff646480}.note-content{color:#333;white-space:pre-wrap;word-wrap:break-word;text-overflow:ellipsis;-webkit-line-clamp:10;pointer-events:none;-webkit-user-select:text;user-select:text;-webkit-box-orient:vertical;flex:1;margin:0;font-size:14px;line-height:1.4;display:-webkit-box;overflow:hidden}.note-textarea{width:100%;height:100%;min-height:160px;font-family:var(--body-font);color:#333;resize:none;word-wrap:break-word;white-space:pre-wrap;-webkit-user-select:text;user-select:text;background:0 0;border:none;outline:none;padding:0;font-size:1rem;line-height:1.6}#add-note-container{z-index:2000;width:90%;max-width:450px;position:fixed;bottom:30px;left:50%;transform:translate(-50%)}#add-note-form{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#fff,#f8f9fa);border:1px solid #ffffff80;border-radius:20px;gap:12px;padding:12px;transition:all .3s;display:flex;box-shadow:0 8px 30px #0000001a}#add-note-form:focus-within{transform:translateY(-2px);box-shadow:0 12px 40px #00000026}#note-select{width:100%;font-size:1rem;font-family:var(--body-font);color:#333;-webkit-backdrop-filter:blur(5px);backdrop-filter:blur(5px);appearance:none;cursor:pointer;background:#fffffff2 url("data:image/svg+xml;utf8,<svg width='24' height='24' fill='%238ec5fc' xmlns='http://www.w3.org/2000/svg'><path d='M7 10l5 5 5-5z'/></svg>") right 16px center/20px 20px no-repeat;border:2px solid #e0c3fc;border-radius:16px;outline:none;padding:16px 20px;transition:all .3s;box-shadow:0 5px 20px #a0a0ff26}#note-select:focus{border:2px solid #8ec5fc;transform:scale(1.02);box-shadow:0 10px 35px #66a6ff40}#note-select option{color:#333;background:#fff;border-radius:8px;padding:12px;transition:background-color .2s}#note-select option:hover{background-color:#f0f0ff}#add-note-form button{color:#fff;cursor:pointer;background:linear-gradient(135deg,#89f7fe,#66a6ff);border:none;border-radius:16px;flex-shrink:0;justify-content:center;align-items:center;width:56px;height:56px;transition:all .3s cubic-bezier(.68,-.55,.27,1.55);display:flex;position:relative;overflow:hidden;box-shadow:0 6px 20px #66a6ff66}#add-note-form button:hover{transform:scale(1.12)translateY(-3px);box-shadow:0 10px 30px #66a6ff99}#add-note-form button:active{animation:.4s btnRipple;transform:scale(.98)}@keyframes btnRipple{0%{box-shadow:0 0 #66a6ff80}70%{box-shadow:0 0 0 15px #66a6ff33}to{box-shadow:0 0 #66a6ff00}}#add-note-form button svg{width:24px;height:24px}.reset-view-button{color:#fff;cursor:pointer;z-index:10;background-color:#0009;border:none;border-radius:8px;padding:8px 12px;font-size:12px;transition:background-color .3s;position:absolute;bottom:20px;right:20px}.reset-view-button:hover{background-color:#000c}#loading-spinner{z-index:3000;justify-content:center;align-items:center;width:64px;height:64px;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}#loading-spinner .spinner{background:0 0;border:6px solid #e0c3fc;border-top-color:#8ec5fc;border-radius:50%;width:64px;height:64px;animation:1s linear infinite spin}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width:768px){.note{width:250px;min-height:150px}#add-note-container{width:95%;bottom:20px}#notes-container{padding:10px}}