:root{--bg: #f4f4f1;--surface: #fff;--surface-soft: #f7f7f4;--ink: #1b1b19;--ink-2: #33332e;--muted: #9a9a93;--muted-2: #b3b3aa;--border: #e6e6e0;--border-soft: #ecece6;--danger: #b4453f;--mono: ui-monospace, "SF Mono", Menlo, monospace}@keyframes sl-fade{0%{opacity:0}to{opacity:1}}@keyframes sl-rise{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:none}}*{box-sizing:border-box}body{margin:0;background:var(--bg);color:var(--ink);font-family:Helvetica Neue,Helvetica,Arial,sans-serif;-webkit-font-smoothing:antialiased}textarea,input,button,select{font-family:inherit}.sl-scroll::-webkit-scrollbar{width:10px}.sl-scroll::-webkit-scrollbar-thumb{background:#dcdcd6;border-radius:6px;border:3px solid var(--bg)}.app{min-height:100vh}.topbar{position:sticky;top:0;z-index:20;background:#f4f4f1d9;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border-bottom:1px solid var(--border)}.topbar__inner{max-width:1120px;margin:0 auto;padding:16px 24px;display:flex;align-items:center;gap:16px;flex-wrap:wrap}.brand{display:flex;align-items:baseline;gap:10px;margin-right:auto}.brand__name{font-size:17px;font-weight:700;letter-spacing:-.01em}.brand__count{font-family:var(--mono);font-size:12px;color:var(--muted)}.sort{display:flex;align-items:center;gap:8px}.sort__label{font-family:var(--mono);font-size:11px;color:var(--muted);letter-spacing:.02em}.sort__select{-webkit-appearance:none;-moz-appearance:none;appearance:none;background:var(--surface) url("data:image/svg+xml;utf8,<svg xmlns=%22http://www.w3.org/2000/svg%22 width=%2210%22 height=%226%22><path d=%22M1 1l4 4 4-4%22 stroke=%22%23999%22 fill=%22none%22 stroke-width=%221.4%22/></svg>") no-repeat right 12px center;border:1px solid #e0e0d9;border-radius:9px;padding:8px 30px 8px 12px;font-size:13px;color:#2a2a27;cursor:pointer}.btn-add{display:inline-flex;align-items:center;gap:7px;background:var(--ink);color:#fff;border:none;border-radius:9px;padding:9px 16px;font-size:13px;font-weight:600;cursor:pointer}.btn-add:hover{background:#000}.btn-add__plus{font-size:15px;line-height:1;margin-top:-1px}.btn-signout{background:transparent;border:none;color:var(--muted);font-size:13px;cursor:pointer;padding:8px}.btn-signout:hover{color:var(--ink)}.content{max-width:1120px;margin:0 auto;padding:28px 24px 80px}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(258px,1fr));gap:18px}.card{background:var(--surface);border:1px solid var(--border-soft);border-radius:14px;overflow:hidden;display:flex;flex-direction:column}.thumb-link{display:block;position:relative;aspect-ratio:16 / 9;background:#d9d4cc;text-decoration:none}.thumb{width:100%;height:100%;object-fit:cover;display:block}.thumb-play{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.thumb-play__circle{width:42px;height:42px;border-radius:50%;background:#ffffffd1;display:flex;align-items:center;justify-content:center;box-shadow:0 2px 10px #0000001f}.thumb-play__tri{width:0;height:0;border-style:solid;border-width:7px 0 7px 12px;border-color:transparent transparent transparent var(--ink);margin-left:2px}.thumb-dur{position:absolute;left:8px;bottom:8px;font-family:var(--mono);font-size:10px;color:#00000073;background:#ffffffb3;padding:2px 6px;border-radius:5px}.card-body{padding:13px 14px 14px;display:flex;flex-direction:column;gap:9px;flex:1}.title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;color:var(--ink);text-decoration:none;font-size:14px;font-weight:600;line-height:1.4}.channel{font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:4px}.comment{width:100%;min-height:42px;resize:none;overflow:hidden;background:var(--surface-soft);border:1px solid #eceae3;border-radius:9px;padding:9px 10px;font-size:12.5px;line-height:1.5;color:var(--ink-2);outline:none}.comment:focus{border-color:#c9c9bf;background:var(--surface)}.card-foot{display:flex;align-items:center;justify-content:space-between;margin-top:auto;padding-top:2px}.card-date{font-family:var(--mono);font-size:10.5px;color:var(--muted-2)}.card-actions{display:flex;gap:4px}.link-src{font-size:12px;color:#7a7a72;text-decoration:none;padding:5px 8px;border-radius:7px}.link-src:hover{background:#f2f2ec;color:var(--ink)}.btn-remove{font-size:12px;color:var(--muted-2);background:transparent;border:none;cursor:pointer;padding:5px 8px;border-radius:7px}.btn-remove:hover{background:#f6eeee;color:var(--danger)}.empty{text-align:center;padding:96px 20px;animation:sl-fade .4s ease}.empty__icon{width:56px;height:56px;margin:0 auto 18px;border-radius:14px;border:1.5px dashed #d2d2c8;display:flex;align-items:center;justify-content:center;color:#bdbdb3;font-size:24px}.empty__title{font-size:16px;font-weight:600;margin-bottom:6px}.empty__text{color:var(--muted);font-size:13.5px;line-height:1.6;max-width:320px;margin:0 auto 20px}.empty__btn{background:var(--ink);color:#fff;border:none;border-radius:9px;padding:10px 18px;font-size:13px;font-weight:600;cursor:pointer}.state{padding:56px 20px;text-align:center;color:var(--muted);font-size:13.5px}.state.error,.error{color:var(--danger)}.modal-overlay{position:fixed;top:0;right:0;bottom:0;left:0;z-index:50;background:#1b1b1952;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);display:flex;align-items:flex-end;justify-content:center;animation:sl-fade .2s ease}.modal{width:100%;max-width:860px;max-height:86vh;overflow-y:auto;background:var(--bg);border-radius:18px 18px 0 0;box-shadow:0 -8px 40px #0000002e;animation:sl-rise .28s ease;margin:0 auto}.modal__head{position:sticky;top:0;background:#f4f4f1eb;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);border-bottom:1px solid var(--border);padding:18px 22px;display:flex;align-items:center;gap:12px}.modal__title{font-size:15px;font-weight:700}.modal__sub{font-family:var(--mono);font-size:11px;color:var(--muted);margin-top:2px}.modal__close{width:32px;height:32px;border-radius:8px;border:1px solid #e0e0d9;background:var(--surface);color:#7a7a72;font-size:16px;cursor:pointer;line-height:1}.modal__close:hover{background:#ecece6}.modal__body{padding:18px 22px 28px;display:grid;grid-template-columns:repeat(auto-fill,minmax(220px,1fr));gap:14px}.modal__state{padding:60px 22px;grid-column:1 / -1;text-align:center;color:var(--muted);font-size:13px}.lcard{background:var(--surface);border:1px solid var(--border-soft);border-radius:12px;overflow:hidden;display:flex;flex-direction:column}.lcard__thumb{position:relative;aspect-ratio:16 / 9;background:#d9d4cc}.lcard__thumb img{width:100%;height:100%;object-fit:cover;display:block}.lcard__play{position:absolute;top:0;right:0;bottom:0;left:0;display:flex;align-items:center;justify-content:center}.lcard__play-circle{width:34px;height:34px;border-radius:50%;background:#fffc;display:flex;align-items:center;justify-content:center}.lcard__play-tri{width:0;height:0;border-style:solid;border-width:6px 0 6px 10px;border-color:transparent transparent transparent var(--ink);margin-left:2px}.lcard__body{padding:11px 12px 12px;display:flex;flex-direction:column;gap:8px;flex:1}.lcard__title{display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;font-size:13px;font-weight:600;line-height:1.38}.lcard__channel{font-family:var(--mono);font-size:10.5px;color:var(--muted)}.lcard__foot{margin-top:auto}.lcard__added{display:inline-flex;align-items:center;gap:5px;font-size:12px;color:#5b8a5b;font-weight:600}.lcard__add{width:100%;background:var(--surface);border:1px solid #d8d8cf;border-radius:8px;padding:7px;font-size:12.5px;font-weight:600;color:var(--ink);cursor:pointer}.lcard__add:hover{background:var(--ink);color:#fff;border-color:var(--ink)}.login{max-width:420px;margin:18vh auto;text-align:center;padding:0 20px}.login h1{font-size:26px;font-weight:700;letter-spacing:-.01em}.login p{color:var(--muted);line-height:1.6;font-size:14px}.login__btn{background:var(--ink);color:#fff;border:none;border-radius:9px;padding:11px 20px;font-size:14px;font-weight:600;cursor:pointer}.login__btn:hover{background:#000}