:root{--sn-primary:var(--main-primary);--sn-primary-hover:var(--main-primary-dark);--sn-text:#1e293b;--sn-text-secondary:#475569;--sn-text-muted:#64748b;--sn-bg:#fff;--sn-bg-hover:#f8fafc;--sn-border:#e2e8f0;--sn-border-light:#f1f5f9;--sn-shadow:0 2px 8px #0000000f, 0 1px 3px #0000000a;--sn-shadow-hover:0 8px 24px #0000001a, 0 2px 6px #0000000d;--sn-shadow-drag:0 16px 40px #00000026, 0 4px 12px #00000014;--sn-radius:var(--main-radius);--sn-radius-lg:12px;--sn-board-bg:#f8fafc;--sn-board-border:#e2e8f0;--sn-board-dot:#cbd5e1;--sn-yellow-bg:#fff9db;--sn-pink-bg:#ffe4ec;--sn-blue-bg:#e0f0ff;--sn-green-bg:#dffbe8;--sn-purple-bg:#efe3ff;--sn-orange-bg:#fff0db;--sn-yellow-accent:#f5c518;--sn-pink-accent:#e8578b;--sn-blue-accent:#4da6ff;--sn-green-accent:#3ec96b;--sn-purple-accent:#9b6fef;--sn-orange-accent:#f59b42;--sn-yellow-dot:#fbbf24;--sn-pink-dot:#f472b6;--sn-blue-dot:#60a5fa;--sn-green-dot:#34d399;--sn-purple-dot:#a78bfa;--sn-orange-dot:#fb923c;--sn-note-text:#2c3341;--sn-note-text-muted:#64748b}._sn-container{gap:var(--main-space-3);max-width:1300px;padding:0 var(--main-space-4);flex-direction:column;margin:0 auto;display:flex}._sn-container._sn-fullwidth{max-width:none;padding:0 var(--main-space-6)}._sn-board{border-style:solid;border-width:1.5px;border-color:var(--sn-board-border);background-color:var(--sn-board-bg);background-image:radial-gradient(circle, var(--sn-board-dot) .75px, transparent .75px);-webkit-overflow-scrolling:touch;overscroll-behavior:contain;background-size:24px 24px;border-radius:16px;height:calc(100vh - 240px);min-height:500px;position:relative;overflow:auto;box-shadow:inset 0 2px 8px #00000008}._sn-board._sn-panning{cursor:grabbing;-webkit-user-select:none;user-select:none}._sn-board._sn-panning *{pointer-events:none}._sn-spacer{pointer-events:none;position:absolute;top:0;left:0}._sn-empty{justify-content:center;align-items:center;gap:var(--main-space-3);color:var(--sn-text-muted);flex-direction:column;display:flex;position:absolute;top:0;bottom:0;left:0;right:0}._sn-empty svg{opacity:.25}._sn-empty-title{font-size:var(--main-text-lg);color:var(--sn-text-secondary);margin:0;font-weight:600}._sn-empty-desc{font-size:var(--main-text-sm);color:var(--sn-text-muted)}._sn-empty-btn{margin-top:var(--main-space-2);background:var(--sn-primary);color:#fff;border-radius:var(--sn-radius-lg);font-size:var(--main-text-sm);cursor:pointer;-webkit-tap-highlight-color:transparent;border:none;align-items:center;gap:.375rem;min-height:40px;padding:.625rem 1.5rem;font-weight:500;display:inline-flex;box-shadow:0 2px 8px #6366f14d}._sn-empty-btn:hover{opacity:.9}@media (max-width:768px){._sn-container{padding:0 var(--main-space-3)}._sn-board{border-radius:12px;height:calc(100dvh - 280px);min-height:360px}._sn-empty{padding:0 var(--main-space-3);text-align:center}._sn-empty-title{font-size:var(--main-text-base)}._sn-empty-desc{font-size:13px}}@media (max-width:480px){._sn-container{padding:0 var(--main-space-2)}._sn-board{border-radius:8px;height:calc(100dvh - 300px);min-height:320px}}._sn-toolbar{justify-content:space-between;align-items:center;gap:var(--main-space-3);background:var(--sn-bg);border-radius:var(--sn-radius-lg);box-shadow:var(--sn-shadow);border-style:solid;border-width:1px;border-color:var(--sn-border-light);padding:.625rem 1rem;display:flex}._sn-toolbar-left{align-items:center;gap:var(--main-space-3);flex:1;min-width:0;display:flex}._sn-toolbar-right{align-items:center;gap:var(--main-space-2);flex-shrink:0;display:flex}._sn-search-wrap{flex:1;max-width:220px;position:relative}._sn-search-wrap svg{color:var(--sn-text-muted);pointer-events:none;position:absolute;top:50%;left:.625rem;translate:0 -50%}._sn-search{border-style:solid;border-width:1.5px;border-color:var(--sn-border);background:var(--sn-bg-hover);width:100%;color:var(--sn-text);font-size:var(--main-text-sm);-webkit-tap-highlight-color:transparent;border-radius:8px;outline:none;padding:.375rem .75rem .375rem 2rem}._sn-search:focus{border-color:var(--sn-primary);background:var(--sn-bg);box-shadow:0 0 0 3px #6366f11f}._sn-divider{background:var(--sn-border);flex-shrink:0;width:1px;height:18px}._sn-filter-colors{align-items:center;gap:.25rem;display:flex}._sn-color-filter{cursor:pointer;-webkit-tap-highlight-color:transparent;background:0 0;border:2px solid #0000;border-radius:50%;flex-shrink:0;justify-content:center;align-items:center;width:22px;height:22px;padding:0;display:inline-flex}._sn-color-filter:hover{opacity:.8}._sn-color-filter.active{border-color:var(--sn-primary)}._sn-color-filter-all{letter-spacing:.02em;width:auto;height:auto;color:var(--sn-text-muted);border-radius:6px;padding:.125rem .5rem;font-size:11px;font-weight:600}._sn-color-filter-all.active{background:var(--sn-primary);color:#fff;border-color:var(--sn-primary)}._sn-color-dot{border-radius:50%;width:12px;height:12px;display:block}._sn-dot-yellow{background:var(--sn-yellow-dot)}._sn-dot-pink{background:var(--sn-pink-dot)}._sn-dot-blue{background:var(--sn-blue-dot)}._sn-dot-green{background:var(--sn-green-dot)}._sn-dot-purple{background:var(--sn-purple-dot)}._sn-dot-orange{background:var(--sn-orange-dot)}._sn-count{color:var(--sn-text-muted);white-space:nowrap;font-size:12px;font-weight:500}._sn-layout-toggle{border-style:solid;border-width:1.5px;border-color:var(--sn-border);cursor:pointer;width:32px;height:32px;color:var(--sn-text-muted);-webkit-tap-highlight-color:transparent;background:0 0;border-radius:8px;justify-content:center;align-items:center;padding:0;display:none}._sn-layout-toggle:hover{border-color:var(--sn-primary);color:var(--sn-primary);background:#6366f10f}._sn-layout-toggle.active{background:var(--sn-primary);border-color:var(--sn-primary);color:#fff}@media (min-width:1400px){._sn-layout-toggle{display:inline-flex}}._sn-btn-add{background:var(--sn-primary);color:#fff;font-size:var(--main-text-sm);cursor:pointer;white-space:nowrap;-webkit-tap-highlight-color:transparent;border:none;border-radius:8px;align-items:center;gap:.375rem;padding:.375rem .875rem;font-weight:500;display:inline-flex;box-shadow:0 1px 4px #6366f14d}._sn-btn-add:hover{opacity:.9}@media (max-width:768px){._sn-toolbar{gap:var(--main-space-2);flex-wrap:wrap;padding:.5rem .75rem}._sn-toolbar-left{gap:var(--main-space-2);flex-wrap:wrap;flex-basis:100%}._sn-toolbar-right{flex-basis:100%;justify-content:space-between}._sn-search-wrap{flex-basis:100%;order:1;max-width:none}._sn-search{padding-top:.5rem;padding-bottom:.5rem;font-size:16px}._sn-divider{display:none}._sn-filter-colors{-webkit-overflow-scrolling:touch;scrollbar-width:none;flex-basis:100%;order:2;gap:.375rem;padding:2px 0;overflow-x:auto}._sn-filter-colors::-webkit-scrollbar{display:none}._sn-color-filter{width:32px;height:32px}._sn-color-filter-all{width:auto;height:32px;min-height:32px;padding:0 .625rem;font-size:12px}._sn-color-dot{width:14px;height:14px}._sn-btn-add{min-height:36px;font-size:var(--main-text-sm);padding:.5rem 1rem}._sn-count{font-size:11px}}@media (max-width:480px){._sn-toolbar{padding:.5rem}._sn-btn-add{flex:1;justify-content:center}}._sn-note{border-radius:var(--sn-radius-lg);width:260px;min-height:120px;box-shadow:var(--sn-shadow);cursor:default;-webkit-user-select:none;user-select:none;border:1px solid #0000000a;flex-direction:column;display:flex;position:absolute}._sn-note:hover{box-shadow:var(--sn-shadow-hover)}._sn-note._sn-dragging{box-shadow:var(--sn-shadow-drag);opacity:.92;cursor:grabbing}._sn-note._sn-resizing{opacity:.95}._sn-note:before{content:"";border-radius:0 4px 4px 0;width:4px;position:absolute;top:12px;bottom:12px;left:0}._sn-note-yellow:before{background:var(--sn-yellow-accent)}._sn-note-pink:before{background:var(--sn-pink-accent)}._sn-note-blue:before{background:var(--sn-blue-accent)}._sn-note-green:before{background:var(--sn-green-accent)}._sn-note-purple:before{background:var(--sn-purple-accent)}._sn-note-orange:before{background:var(--sn-orange-accent)}._sn-note-yellow{background:var(--sn-yellow-bg)}._sn-note-pink{background:var(--sn-pink-bg)}._sn-note-blue{background:var(--sn-blue-bg)}._sn-note-green{background:var(--sn-green-bg)}._sn-note-purple{background:var(--sn-purple-bg)}._sn-note-orange{background:var(--sn-orange-bg)}._sn-note-top{cursor:grab;touch-action:none;align-items:flex-start;gap:.25rem;padding:.625rem .625rem 0;display:flex}._sn-note-top ._sn-note-title,._sn-note-top ._sn-note-delete,._sn-note-top ._sn-note-color-wrap,._sn-note-top ._sn-note-color-trigger{touch-action:auto}._sn-note._sn-dragging ._sn-note-top{cursor:grabbing}._sn-note-color-wrap{flex-shrink:0;align-self:center;position:relative}._sn-note-color-trigger{cursor:pointer;opacity:0;border:none;border-radius:50%;width:14px;height:14px;padding:0}._sn-note:hover ._sn-note-color-trigger{opacity:1}._sn-trigger-yellow{background:var(--sn-yellow-dot)}._sn-trigger-pink{background:var(--sn-pink-dot)}._sn-trigger-blue{background:var(--sn-blue-dot)}._sn-trigger-green{background:var(--sn-green-dot)}._sn-trigger-purple{background:var(--sn-purple-dot)}._sn-trigger-orange{background:var(--sn-orange-dot)}._sn-note-color-picker{background:var(--sn-bg,#fff);z-index:20;border:1px solid #0000000f;border-radius:8px;flex-wrap:wrap;gap:4px;width:78px;padding:6px;display:none;position:absolute;top:100%;left:50%;translate:-50% 4px;box-shadow:0 4px 12px #00000026}._sn-note-color-wrap._sn-open ._sn-note-color-picker{display:flex}._sn-note-title{min-width:0;color:var(--sn-note-text);cursor:text;-webkit-tap-highlight-color:transparent;background:0 0;border:none;outline:none;flex:1;padding:.125rem 0;font-size:.9375rem;font-weight:700;line-height:1.4}._sn-note-title::placeholder{color:var(--sn-note-text-muted);opacity:.5;font-weight:500}._sn-note-delete{cursor:pointer;width:26px;height:26px;color:var(--sn-note-text-muted);opacity:0;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:0;display:flex}._sn-note:hover ._sn-note-delete{opacity:.6}._sn-note-delete:hover{opacity:1;color:#dc2626;background:#dc262614}._sn-note-format{background:var(--sn-bg,#fff);opacity:0;pointer-events:none;z-index:10;border:1px solid #0000000f;border-radius:6px;align-items:center;gap:2px;padding:.25rem .5rem;display:flex;position:absolute;bottom:.375rem;left:.625rem;right:.625rem;box-shadow:0 2px 8px #0000001f}._sn-note:hover ._sn-note-format,._sn-note:focus-within ._sn-note-format{opacity:1;pointer-events:auto}._sn-fmt-btn{cursor:pointer;width:22px;height:22px;color:var(--sn-note-text);opacity:.55;-webkit-tap-highlight-color:transparent;background:0 0;border:none;border-radius:4px;justify-content:center;align-items:center;padding:0;font-family:Georgia,serif;font-size:12px;line-height:1;display:inline-flex}._sn-fmt-btn:hover{opacity:1;background:#0000000f}._sn-fmt-btn b{font-weight:800}._sn-fmt-btn i{font-style:italic}._sn-fmt-btn u{text-decoration:underline}._sn-fmt-btn s{text-decoration:line-through}._sn-fmt-btn-ol{font-family:var(--main-font);font-size:11px;font-weight:600}._sn-fmt-sep{background:#0000001a;flex-shrink:0;width:1px;height:14px;margin:0 2px}._sn-fmt-colors{align-items:center;gap:3px;display:flex}._sn-fmt-color-dot{cursor:pointer;border:none;border-radius:50%;width:12px;height:12px;padding:0}._sn-fmt-color-dot:hover{opacity:.8}._sn-fmt-color-default{background:var(--sn-note-text);position:relative}._sn-fmt-color-default:after{content:"";background:inherit;border:1.5px solid #fff9;border-radius:50%;position:absolute;top:3px;bottom:3px;left:3px;right:3px}._sn-note-body{flex-direction:column;flex:1;min-height:0;padding:.25rem .625rem 0;display:flex;overflow:hidden}._sn-note-content{min-height:36px;max-height:100%;font-size:var(--main-text-sm);color:var(--sn-note-text);cursor:text;word-break:break-word;-webkit-user-select:text;user-select:text;-webkit-overflow-scrolling:touch;-webkit-tap-highlight-color:transparent;background:0 0;outline:none;flex:1;padding:0;line-height:1.6;overflow-y:auto}._sn-note-content:empty:before{content:attr(data-placeholder);color:var(--sn-note-text-muted);opacity:.4;pointer-events:none}._sn-note-content ul,._sn-note-content ol{margin:.25rem 0;padding-left:1.25rem}._sn-note-content li{margin-bottom:.125rem}._sn-note-content b,._sn-note-content strong{font-weight:700}._sn-note-content i,._sn-note-content em{font-style:italic}._sn-note-meta{justify-content:flex-end;align-items:center;padding:.375rem .625rem;display:flex}._sn-note-color-btn{cursor:pointer;-webkit-tap-highlight-color:transparent;border:2px solid #0000;border-radius:50%;width:20px;height:20px;padding:0}._sn-note-color-btn:hover{opacity:.8}._sn-note-color-btn.active{border-color:#00000040}._sn-note-color-btn[data-color=yellow]{background:var(--sn-yellow-dot)}._sn-note-color-btn[data-color=pink]{background:var(--sn-pink-dot)}._sn-note-color-btn[data-color=blue]{background:var(--sn-blue-dot)}._sn-note-color-btn[data-color=green]{background:var(--sn-green-dot)}._sn-note-color-btn[data-color=purple]{background:var(--sn-purple-dot)}._sn-note-color-btn[data-color=orange]{background:var(--sn-orange-dot)}._sn-note-date{color:var(--sn-note-text-muted);opacity:.6;white-space:nowrap;font-size:11px;font-weight:500}._sn-note-resize{cursor:nwse-resize;opacity:0;border-radius:0 0 var(--sn-radius-lg) 0;z-index:11;touch-action:none;width:18px;height:18px;position:absolute;bottom:0;right:0}._sn-note:hover ._sn-note-resize{opacity:1}._sn-note-resize:before,._sn-note-resize:after{content:"";background:#0003;border-radius:1px;position:absolute}._sn-note-resize:before{width:8px;height:1.5px;bottom:4px;right:4px;translate:-1px 1px;rotate:-45deg}._sn-note-resize:after{width:5px;height:1.5px;bottom:4px;right:4px;translate:1px -1px;rotate:-45deg}@media (max-width:768px){._sn-note-top{align-items:center;gap:.5rem;min-height:40px;padding:.5rem .5rem 0}._sn-note-color-trigger{opacity:1;width:22px;height:22px}._sn-note-title{padding:.25rem 0;font-size:16px}._sn-note-delete{opacity:.7;width:32px;height:32px}._sn-note-content{font-size:16px;line-height:1.5}._sn-note-resize{opacity:.7;width:28px;height:28px}._sn-note-resize:before{width:12px;height:2px;bottom:5px;right:5px;translate:-2px 2px}._sn-note-resize:after{width:7px;height:2px;bottom:5px;right:5px;translate:2px -2px}._sn-note:focus-within ._sn-note-format{opacity:1;pointer-events:auto}._sn-fmt-btn{opacity:.75;width:32px;height:32px}._sn-note-color-btn{width:28px;height:28px}._sn-fmt-color-dot{width:18px;height:18px}._sn-note-color-picker{gap:6px;width:auto;min-width:110px;padding:8px}._sn-note-format{flex-wrap:wrap;gap:4px;padding:.375rem .5rem}._sn-fmt-colors{gap:4px}}@media (max-width:480px){._sn-note{max-width:calc(100vw - 32px)}}