:root{--lightningcss-light: ;--lightningcss-dark:initial;color-scheme:dark;color:#e8eaef;--ease-out:cubic-bezier(.22, 1, .36, 1);--ease-spring:cubic-bezier(.34, 1.56, .64, 1);--shadow:0 8px 32px #00000073;--accent:#5b8cff;--accent-dim:#3a5fb8;--accent-glow:#5b8cff38;--surface:#12151c;--surface2:#181c27;--border:#2a3142;background:#0b0d12;font-family:system-ui,-apple-system,Segoe UI,Roboto,Ubuntu,Cantarell,Noto Sans,Arial,sans-serif;line-height:1.45}*{box-sizing:border-box}body{min-height:100vh;margin:0}button,input{font:inherit;transition:background .18s var(--ease-out), border-color .18s var(--ease-out), transform .14s var(--ease-out), box-shadow .2s var(--ease-out)}button:focus-visible,input:focus-visible{outline:2px solid var(--accent);outline-offset:2px}.page{flex-direction:column;min-height:100vh;display:flex}.center{text-align:center;padding:3rem 1rem}.top-bar{z-index:10;border-bottom:1px solid var(--border);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:linear-gradient(#0e1016f7 0%,#0e1016e0 100%);padding:.85rem 1rem 1rem;position:sticky;top:0;box-shadow:0 1px #ffffff0a}.top-bar--enter{animation:barDown .45s var(--ease-out) both}.top-inner{flex-direction:column;gap:.65rem;max-width:1100px;margin:0 auto;display:flex}.brand-line{flex-wrap:wrap;align-items:baseline;gap:.5rem 1rem;margin:0;display:flex}.brand-title{letter-spacing:.02em;font-size:1.05rem;font-weight:700}.brand-sub{font-size:.8rem}.search-form{flex-wrap:wrap;align-items:flex-start;gap:.5rem;width:100%;display:flex}.search-field{flex:280px;position:relative}.search-input{border:1px solid var(--border);background:var(--surface2);width:100%;color:inherit;border-radius:10px;padding:.65rem .75rem;box-shadow:inset 0 1px #ffffff0a}.search-input::placeholder{color:#6b7388}.btn-primary{background:linear-gradient(180deg, var(--accent) 0%, var(--accent-dim) 100%);color:#fff;cursor:pointer;box-shadow:0 2px 12px var(--accent-glow);border:1px solid #4a6fd4;border-radius:10px;padding:.6rem 1rem;font-weight:600}.btn-primary:hover:not(:disabled){box-shadow:0 4px 18px var(--accent-glow);transform:translateY(-1px)}.btn-primary:active:not(:disabled){transform:translateY(0)}.btn-primary:disabled{opacity:.55;cursor:not-allowed}.btn-primary--wide{width:100%}.btn-quiet{border-radius:10px;padding:.6rem .85rem}.search-form button.ghost{border-color:var(--border);color:#cbd3e2;background:0 0}.search-form button.ghost:hover:not(:disabled){background:#ffffff0f;border-color:#3d4558}.suggest-list{z-index:20;background:#12151c;border:1px solid #2b3140;border-radius:8px;max-height:280px;margin:0;padding:.25rem;list-style:none;position:absolute;top:calc(100% + 4px);left:0;right:0;overflow:auto}.suggest-list button{text-align:left;width:100%;color:inherit;cursor:pointer;background:0 0;border:none;border-radius:6px;padding:.35rem .45rem}.suggest-list button:hover{background:#1e2431}.main{flex:1;width:100%;max-width:1200px;margin:0 auto;padding:1rem}.pager{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.grid{grid-template-columns:repeat(auto-fill,minmax(160px,1fr));gap:.65rem;display:grid}.thumb{border:1px solid var(--border);background:var(--surface);cursor:pointer;aspect-ratio:1;transition:transform .2s var(--ease-out), box-shadow .2s var(--ease-out), border-color .2s var(--ease-out);border-radius:12px;padding:0;position:relative;overflow:hidden}.thumb img{object-fit:cover;width:100%;height:100%;display:block}.thumb-id{background:#0000008c;border-radius:6px;padding:2px 6px;font-size:.75rem;position:absolute;bottom:6px;left:6px}.muted{color:#9aa3b5}.error{color:#ffb4b4}.banner{background:#5a2b2b40;border:1px solid #5a2b2b;border-radius:8px;margin-bottom:1rem;padding:.5rem .75rem}.login-wrap{flex:1;place-items:center;padding:2rem 1rem;display:grid}.login-wrap--enter{animation:fadeIn .5s var(--ease-out) both}.login-card{border:1px solid var(--border);background:linear-gradient(165deg, var(--surface) 0%, #0e1018 100%);width:min(420px,100%);box-shadow:var(--shadow);border-radius:16px;flex-direction:column;gap:1rem;padding:1.75rem;display:flex}.login-card--enter{animation:popIn .5s var(--ease-spring) both}.login-intro{text-align:left}.login-title{margin:0;font-size:1.45rem;font-weight:700}.login-lead{margin:.35rem 0 0;font-size:.9rem;line-height:1.5}.field{flex-direction:column;gap:.4rem;font-size:.9rem;display:flex}.field-label{color:#b4bccf;font-weight:500}.field-input{border:1px solid var(--border);background:var(--surface2);color:inherit;border-radius:10px;padding:.65rem .7rem}.login-error{background:#5a2b2b40;border:1px solid #b4505059;border-radius:8px;margin:0;padding:.5rem .65rem}.modal-backdrop{z-index:50;animation:fadeIn .22s var(--ease-out) both;background:#000000b8;place-items:center;padding:1rem;display:grid;position:fixed;inset:0}.modal-backdrop--enter{animation:fadeIn .25s var(--ease-out) both}.modal-panel{border:1px solid var(--border);background:var(--surface);width:min(960px,100%);max-height:min(92vh,900px);box-shadow:var(--shadow);border-radius:16px;overflow:auto}.modal-panel--enter{animation:modalUp .32s var(--ease-spring) both}.modal-head{border-bottom:1px solid var(--border);justify-content:space-between;align-items:center;padding:.75rem 1rem;display:flex}.modal-id{font-size:.95rem;font-weight:600}.modal-close{border:1px solid var(--border);background:var(--surface2);color:inherit;cursor:pointer;border-radius:10px;padding:.45rem .75rem;font-weight:500}.modal-close:hover{background:#222836}.link-external{color:var(--accent);font-weight:500;text-decoration:none}.link-external:hover{text-decoration:underline}.meta-line{margin:.25rem 0}.hint{color:#8b95aa;margin:0 0 .5rem;font-size:.82rem}.tag-chip:hover{border-color:var(--accent);background:#5b8cff1f;transform:translateY(-1px)}.modal-body{gap:.85rem;padding:.85rem;display:grid}.modal-img{border-radius:10px;width:100%;height:auto;display:block}.modal-meta .tag-list{flex-wrap:wrap;gap:.35rem;display:flex}.tag-chip{color:#cbd3e2;cursor:pointer;background:#151821;border:1px solid #333846;border-radius:999px;padding:.25rem .55rem;font-size:.85rem}.video-shell{touch-action:manipulation;width:100%;max-height:min(70vh,720px);position:relative}.video-el{background:#000;border-radius:10px;width:100%;max-height:min(70vh,720px)}.video-zones{pointer-events:none;display:flex;position:absolute;inset:0}.video-zone{pointer-events:auto;cursor:pointer;background:0 0;border:none;flex:0 0 28%}.video-zone:hover{background:#ffffff0a}.video-zone-spacer{pointer-events:none;flex:auto}.toolbar{flex-wrap:wrap;align-items:center;gap:.75rem 1.25rem;padding-top:.15rem;display:flex}.toolbar-hint{margin:0;font-size:.85rem}.toggle-ai{border:1px solid var(--border);background:var(--surface2);color:#d2d8e8;cursor:pointer;border-radius:999px;align-items:center;gap:.5rem;padding:.45rem .85rem .45rem .55rem;font-size:.88rem;font-weight:600;display:inline-flex}.toggle-ai:hover{background:#1c2230;border-color:#4a556b}.toggle-ai--on{color:#b8d0ff;box-shadow:0 0 0 1px var(--accent-glow);background:#5b8cff1f;border-color:#3d5a9e}.toggle-ai__icon{background:#ffffff0f;border-radius:50%;place-items:center;width:1.5rem;height:1.5rem;font-size:.75rem;display:grid}.toggle-ai--on .toggle-ai__icon{background:var(--accent);color:#0b0d12}.pager-btn{border:1px solid var(--border);background:var(--surface2);color:inherit;cursor:pointer;border-radius:10px;padding:.45rem .85rem;font-weight:500}.pager-btn:hover:not(:disabled){background:#1c2230;border-color:#4a556b}.pager-btn:disabled{opacity:.45;cursor:not-allowed}.pager-status{font-size:.9rem}.pager-status strong{color:#f0f3fa}.main--loading .grid{opacity:.55;pointer-events:none;transition:opacity .25s var(--ease-out)}.grid{transition:opacity .25s var(--ease-out)}.thumb--enter{animation:thumbIn .4s var(--ease-out) both}.thumb:hover{border-color:#3d4d6e;transform:translateY(-3px)scale(1.02);box-shadow:0 10px 28px #00000073}.thumb img{transition:transform .35s var(--ease-out)}.thumb:hover img{transform:scale(1.04)}.thumb-badge{text-transform:uppercase;letter-spacing:.04em;color:#fff;background:linear-gradient(135deg,#5b8cff,#3d5cb8);border-radius:6px;padding:.2rem .45rem;font-size:.68rem;font-weight:700;position:absolute;top:6px;right:6px;box-shadow:0 2px 8px #00000059}.skeleton-thumb{aspect-ratio:1;border:1px solid var(--border);background:linear-gradient(110deg, var(--surface2) 0%, #252a3a 45%, var(--surface2) 90%);background-size:200% 100%;border-radius:12px;animation:1.2s ease-in-out infinite shimmer}.skeleton-thumb--enter{animation:thumbIn .35s var(--ease-out) both, shimmer 1.2s ease-in-out infinite}.empty-state{text-align:center;border:1px dashed var(--border);background:#ffffff05;border-radius:14px;margin-bottom:1rem;padding:2.5rem 1rem}.empty-state--enter{animation:fadeIn .45s var(--ease-out) both}.empty-title{margin:0 0 .35rem;font-size:1.1rem;font-weight:600}.banner--enter{animation:shakeIn .4s var(--ease-out) both}.suggest-list--enter{animation:fadeIn .18s var(--ease-out) both}.toast{z-index:80;color:#e8eaef;box-shadow:var(--shadow);animation:toastIn .35s var(--ease-spring) both;text-align:center;background:#1e2433;border:1px solid #3a4358;border-radius:999px;max-width:min(92vw,420px);padding:.65rem 1.1rem;font-size:.88rem;position:fixed;bottom:1.25rem;left:50%;transform:translate(-50%)}.page--boot{place-content:center}.boot-spinner{border:3px solid var(--border);border-top-color:var(--accent);border-radius:50%;width:2.25rem;height:2.25rem;margin:0 auto 1rem;animation:.75s linear infinite spin}.boot-text{margin:0}.page--app{animation:fadeIn .35s var(--ease-out) both}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes barDown{0%{opacity:0;transform:translateY(-8px)}to{opacity:1;transform:translateY(0)}}@keyframes popIn{0%{opacity:0;transform:scale(.94)translateY(8px)}to{opacity:1;transform:scale(1)translateY(0)}}@keyframes modalUp{0%{opacity:0;transform:translateY(16px)scale(.97)}to{opacity:1;transform:translateY(0)scale(1)}}@keyframes thumbIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}@keyframes shimmer{0%{background-position:100% 0}to{background-position:-100% 0}}@keyframes toastIn{0%{opacity:0;transform:translate(-50%,12px)}to{opacity:1;transform:translate(-50%)}}@keyframes shakeIn{0%{opacity:0;transform:translate(-6px)}50%{transform:translate(4px)}to{opacity:1;transform:translate(0)}}@keyframes spin{to{transform:rotate(360deg)}}@media (prefers-reduced-motion:reduce){*,:before,:after{transition-duration:.01ms!important;animation-duration:.01ms!important;animation-iteration-count:1!important}.skeleton-thumb,.skeleton-thumb--enter{background:var(--surface2);animation:none}.boot-spinner{border-color:var(--accent);animation:none}}