:root{--scale:1;--font-sans:"Plus Jakarta Sans", "Noto Sans SC", -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;--fs-3xs:calc(11px * var(--scale));--fs-2xs:calc(12px * var(--scale));--fs-xs:calc(13px * var(--scale));--fs-sm:calc(14px * var(--scale));--fs-base:calc(15px * var(--scale));--fs-md:calc(16px * var(--scale));--fs-lg:calc(18px * var(--scale));--fs-xl:calc(22px * var(--scale));--fs-display:calc(36px * var(--scale));--topbar-h:calc(50px * var(--scale));--row-h:calc(36px * var(--scale));--input-h:calc(36px * var(--scale));--sidebar-w:calc(268px * var(--scale));--primary:#4f46e5;--primary-light:#eef2ff;--bg:#fafbfc;--bg-surface:#fff;--bg-hover:#f4f5f7;--bg-active:#f0f2ff;--border:#e4e7ec;--border-light:#eef0f3;--text:#1a1d26;--text2:#5c6578;--text3:#8b95a8;--danger:#d92d20;--imp:#16a34a;--imp-bg:#ecfdf5;--gold:#e8940a;--radius:8px;--shadow-sm:0 1px 2px #1018280a}@media (width>=1600px){:root{--scale:1.06}}@media (width>=1920px){:root{--scale:1.14}}@media (width>=2560px){:root{--scale:1.22}}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background:var(--bg);color:var(--text);font-size:var(--fs-base);letter-spacing:.01em;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;line-height:1.55;overflow:hidden}#app{flex-direction:column;height:100vh;display:flex}.topbar{align-items:center;gap:calc(10px * var(--scale));height:var(--topbar-h);padding:0 calc(16px * var(--scale));border-bottom:1px solid var(--border);background:var(--bg-surface);box-shadow:var(--shadow-sm);flex-shrink:0;display:flex}.logo{align-items:center;gap:calc(6px * var(--scale));font-weight:700;font-size:var(--fs-md);letter-spacing:-.02em;white-space:nowrap;display:flex}.logo .emoji{font-size:var(--fs-lg)}.sb-toggle{cursor:pointer;color:var(--text2);background:0 0;border:none;justify-content:center;align-items:center;padding:0;transition:color .15s;display:inline-flex}.sb-toggle:hover{color:var(--text)}.search-wrap{max-width:calc(400px * var(--scale));flex:1;position:relative}.search-wrap input{width:100%;height:var(--input-h);padding:0 calc(32px * var(--scale));border-radius:var(--radius);background:var(--bg-hover);font-family:inherit;font-size:var(--fs-sm);color:var(--text);border:1px solid #0000;outline:none;transition:all .15s}.search-wrap input:focus{background:var(--bg-surface);border-color:var(--primary);box-shadow:0 0 0 3px #4f46e51a}.search-wrap .si{left:calc(10px * var(--scale));color:var(--text3);font-size:var(--fs-sm);pointer-events:none;position:absolute;top:50%;transform:translateY(-50%)}.search-wrap .search-clear{width:calc(24px * var(--scale));height:calc(24px * var(--scale));color:var(--text3);font-size:var(--fs-2xs);cursor:pointer;background:0 0;border:none;border-radius:5px;justify-content:center;align-items:center;line-height:1;transition:all .15s;display:flex;position:absolute;top:50%;right:4px;transform:translateY(-50%)}.search-wrap .search-clear:hover{color:var(--text2);background:#0000000f}.actions{gap:calc(12px * var(--scale));margin-left:auto;display:flex}.edit-ic{display:inline-block;transform:scaleX(-1)}.layout{flex:1;display:flex;overflow:hidden}.sidebar{width:var(--sidebar-w);border-right:1px solid var(--border);background:linear-gradient(#fcfcfd 0%,#f6f7f9 100%);flex-direction:column;flex-shrink:0;min-width:0;min-height:0;transition:width .2s;display:flex;overflow:hidden}.sidebar.hide{border-right:none;width:0;overflow:hidden}.sb-head{padding:calc(10px * var(--scale)) calc(12px * var(--scale)) calc(4px * var(--scale));font-size:var(--fs-2xs);color:var(--text3);letter-spacing:.04em;text-transform:uppercase;-webkit-user-select:none;user-select:none;margin-top:calc(8px * var(--scale));justify-content:space-between;align-items:center;font-weight:700;display:flex}.sb-head:first-child,.sb-category .sb-head{margin-top:0}.sb-category{padding-top:calc(10px * var(--scale));flex-shrink:0}.sb-body{flex-direction:column;flex:1;min-height:0;display:flex;overflow:hidden auto}.sb-groups-section{flex-direction:column;flex:none;display:flex}.sb-groups-scroll{overflow:visible}.sb-tags-section{border-top:1px solid var(--border-light);flex:none}.sb-list.sb-tags{overflow-x:hidden}.sb-head .clear-tag{color:var(--primary);font-size:var(--fs-3xs);cursor:pointer;background:0 0;border:none;padding:0;font-weight:600}.sb-list{padding:0 calc(6px * var(--scale)) calc(2px * var(--scale));overflow-x:hidden}.sb-add-group{justify-content:center;align-items:center;gap:calc(5px * var(--scale));box-sizing:border-box;width:calc(100% - 2 * 10px * var(--scale));margin:calc(4px * var(--scale)) calc(10px * var(--scale)) calc(12px * var(--scale));padding:calc(8px * var(--scale)) calc(10px * var(--scale));border-radius:var(--radius);color:#a1a1aa;font-family:inherit;font-size:var(--fs-2xs);text-align:center;cursor:pointer;background:0 0;border:1px dashed #d4d4d8;transition:color .15s,border-color .15s,background .15s;display:flex}.sb-add-group-icon{color:inherit;display:flex}.sb-add-group:hover{color:var(--primary);background:#4f46e50a;border-color:#4f46e573}.sb-item{align-items:center;gap:calc(6px * var(--scale));min-width:0;min-height:calc(34px * var(--scale));height:auto;padding:calc(4px * var(--scale)) calc(8px * var(--scale));border-radius:calc(6px * var(--scale));cursor:pointer;-webkit-user-select:none;user-select:none;margin-bottom:1px;transition:all .1s;display:flex;overflow:hidden}.sb-item:hover{background:var(--bg-hover)}.sb-item.active{background:var(--bg-active);color:var(--primary);font-weight:600}.sb-item.active.imp{background:var(--imp-bg);color:#15803d}.sb-item .ic{font-size:var(--fs-md);flex-shrink:0}.sb-item .ic.tag-hash{font-size:var(--fs-2xs);color:var(--text3);font-weight:700}.sb-item .nm{text-overflow:ellipsis;white-space:nowrap;min-width:0;font-size:var(--fs-sm);flex:1;line-height:1.4;overflow:hidden}.sb-item .ct{font-size:var(--fs-2xs);color:var(--text3);background:var(--bg-hover);padding:0 calc(6px * var(--scale));border-radius:8px;flex-shrink:0}.sb-item.active .ct{color:var(--primary);background:#4f46e51f}.sb-item.active.imp .ct{color:#15803d;background:#16a34a26}.sb-item .op{opacity:.3;flex-shrink:0;gap:0;display:flex}.sb-item:hover .op{opacity:1}.sb-item.dragging{opacity:.4}.sb-item.dragOver{border-top:2px solid var(--primary)}.sb-foot{padding:calc(8px * var(--scale)) calc(10px * var(--scale));border-top:1px solid var(--border);flex-shrink:0}.sb-stats{gap:calc(10px * var(--scale));font-size:var(--fs-2xs);color:var(--text3);flex-wrap:wrap;justify-content:space-between;min-width:0;padding:0 2px;display:flex}.sb-logout{padding:calc(8px * var(--scale)) calc(10px * var(--scale)) calc(10px * var(--scale));border-top:1px solid var(--border);flex-shrink:0}.main-scroll{flex:1;min-width:0;overflow:hidden auto}.main-inner{width:100%;max-width:1320px;padding:0 calc(18px * var(--scale)) calc(40px * var(--scale));margin:0 auto}.tab-bar{padding:calc(10px * var(--scale)) 2px;background:var(--bg);z-index:6;justify-content:space-between;align-items:center;gap:calc(8px * var(--scale));margin-bottom:calc(6px * var(--scale));display:flex;position:sticky;top:0}.tb-left{align-items:center;gap:calc(4px * var(--scale));min-width:0;display:flex}.tab{height:calc(32px * var(--scale));padding:0 calc(12px * var(--scale));border-radius:calc(6px * var(--scale));color:var(--text2);font-size:var(--fs-xs);cursor:pointer;white-space:nowrap;background:0 0;border:1px solid #0000;flex-shrink:0;font-family:inherit;transition:all .12s}.tab:hover{background:var(--bg-hover);color:var(--text)}.tab.active{background:var(--primary-light);color:var(--primary);border-color:var(--primary);font-weight:600}.tab-sep{width:1px;height:calc(18px * var(--scale));background:var(--border);margin:0 calc(4px * var(--scale));flex-shrink:0}.tab-scroll{gap:calc(4px * var(--scale));scrollbar-width:none;flex-shrink:1;display:flex;overflow-x:auto}.tag-chip{align-items:center;gap:calc(4px * var(--scale));font-size:var(--fs-xs);color:var(--primary);background:var(--primary-light);padding:calc(3px * var(--scale)) calc(10px * var(--scale));cursor:pointer;-webkit-user-select:none;user-select:none;border:1px solid #dbe1fc;border-radius:12px;font-weight:600;display:inline-flex}.tag-chip.search-scope{cursor:default}.search-hint{font-size:var(--fs-xs);color:var(--text2);margin-top:calc(6px * var(--scale))}.sort-chip{align-items:center;gap:calc(4px * var(--scale));font-size:var(--fs-xs);color:var(--text2);border:1px solid var(--border);padding:calc(4px * var(--scale)) calc(10px * var(--scale));cursor:pointer;-webkit-user-select:none;user-select:none;background:0 0;border-radius:12px;font-weight:500;transition:all .15s;display:inline-flex}.sort-chip.active{color:var(--primary);background:var(--primary-light);border-color:var(--primary);font-weight:600}.right{align-items:center;gap:calc(6px * var(--scale));flex-shrink:0;display:flex}.sort-order-btn{padding:0 calc(8px * var(--scale))}.sort-order-btn .n-button__icon{margin:0}.g-block{margin-bottom:calc(8px * var(--scale));border-radius:calc(10px * var(--scale))}.g-head{align-items:center;gap:calc(6px * var(--scale));height:calc(34px * var(--scale));padding:0 calc(8px * var(--scale));border-radius:calc(6px * var(--scale));cursor:pointer;-webkit-user-select:none;user-select:none;background:var(--bg-hover);transition:background .15s;display:flex}.g-head:hover{background:#e8eaed}.g-head .fold{width:calc(18px * var(--scale));color:var(--text2);flex-shrink:0;justify-content:center;align-items:center;display:inline-flex}.g-head .fold svg{width:calc(16px * var(--scale));height:calc(16px * var(--scale))}.g-head .ic{font-size:var(--fs-sm)}.g-head .nm{font-size:var(--fs-sm);font-weight:600}.g-head .ct{font-size:var(--fs-2xs);color:var(--text3);padding:0 calc(6px * var(--scale));background:#fff9;border-radius:8px}.g-head .op{opacity:.3;gap:0;margin-left:auto;display:flex}.g-head:hover .op{opacity:1}.rows{border-bottom:1px solid var(--border-light);padding:calc(2px * var(--scale)) 0}.row{align-items:center;gap:calc(10px * var(--scale));min-height:var(--row-h);padding:0 calc(10px * var(--scale));margin-bottom:calc(2px * var(--scale));border-radius:calc(6px * var(--scale));cursor:default;transition:background .15s;display:flex}.row:hover{background:#f0fdf4}.row.r-imp{box-shadow:inset 4px 0 0 var(--imp)}.row .fav{width:calc(14px * var(--scale));height:calc(14px * var(--scale));font-size:var(--fs-2xs);flex-shrink:0;justify-content:center;align-items:center;display:flex}.row .fav img{width:calc(13px * var(--scale));height:calc(13px * var(--scale))}.row .t{font-size:var(--fs-xs);color:var(--text);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;flex-shrink:0;max-width:32%;font-weight:400;overflow:hidden}.row .t:hover{color:var(--primary)}.row .tags{gap:calc(3px * var(--scale));flex-shrink:0;max-width:260px;display:flex;overflow:hidden}.row .tag{font-size:var(--fs-3xs);color:var(--primary);background:var(--primary-light);padding:calc(2px * var(--scale)) calc(7px * var(--scale));cursor:pointer;-webkit-user-select:none;user-select:none;border-radius:8px;flex-shrink:0;line-height:1.5}.row .tag:hover{background:#e0e7ff}.row .tag.more{color:var(--text3);background:var(--bg-hover);cursor:default}.row .url{min-width:0;font-size:var(--fs-2xs);color:var(--text3);white-space:nowrap;text-overflow:ellipsis;cursor:pointer;direction:ltr;transition:color .15s;overflow:hidden}.row .url:hover{color:var(--primary)}.row .desc{min-width:0;font-size:var(--fs-2xs);color:var(--text2);white-space:nowrap;text-overflow:ellipsis;overflow:hidden}.row .stars{flex-shrink:0;gap:1px;margin-left:auto;display:flex}.row .stars i{font-style:normal;font-size:var(--fs-xs);color:#d8dce2;cursor:pointer;line-height:1}.row .stars i.on,.row .stars i:hover{color:var(--gold)}.row .op{opacity:0;pointer-events:none;flex-shrink:0;gap:2px;transition:opacity .15s;display:flex}.row:hover .op{opacity:1;pointer-events:auto}.empty{padding:calc(60px * var(--scale)) 0;text-align:center;color:var(--text3)}.empty .e{font-size:var(--fs-display);margin-bottom:calc(8px * var(--scale))}.empty .d{font-size:var(--fs-sm);margin-bottom:calc(14px * var(--scale))}.confirm-body{text-align:center}.confirm-body .icon{font-size:var(--fs-display);margin-bottom:calc(8px * var(--scale))}.confirm-body .msg{font-size:var(--fs-sm);margin-bottom:calc(16px * var(--scale));line-height:1.6}.confirm-body .confirm-actions{gap:calc(8px * var(--scale));justify-content:center;margin-left:0;display:flex}
