:root{--bg: #0f0f12;--surface: #1a1a20;--surface-hover: #24242c;--text: #f0f0f5;--muted: #a0a0b0;--accent: #ff4ecd;--accent-hover: #ff7bdc;--danger: #ff5a5a;--radius: 12px;--shadow: 0 8px 30px rgba(0, 0, 0, .4)}*{box-sizing:border-box}body{margin:0;font-family:system-ui,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,sans-serif;background:var(--bg);color:var(--text);min-height:100vh}.app{max-width:1200px;margin:0 auto;padding:32px 24px}.app__header{text-align:center;margin-bottom:32px}.app__header h1{margin:0 0 8px;font-size:2rem}.app__header p{margin:0;color:var(--muted)}.app__main{display:flex;flex-direction:column;gap:24px}.search-box{display:flex;gap:12px;max-width:640px;margin:0 auto;width:100%}.search-box input{flex:1;padding:14px 18px;border:1px solid #333;border-radius:var(--radius);background:var(--surface);color:var(--text);font-size:1rem;outline:none;transition:border-color .2s}.search-box input:focus{border-color:var(--accent)}.search-box button{padding:14px 24px;border:none;border-radius:var(--radius);background:var(--accent);color:#fff;font-weight:600;font-size:1rem;cursor:pointer;transition:background .2s}.search-box button:hover:not(:disabled){background:var(--accent-hover)}.search-box button:disabled{opacity:.6;cursor:not-allowed}.app__error{background:#ff5a5a1f;border:1px solid var(--danger);color:var(--danger);padding:14px 18px;border-radius:var(--radius);text-align:center}.app__results-info{color:var(--muted);text-align:center}.video-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:24px}.video-card{background:var(--surface);border-radius:var(--radius);overflow:hidden;box-shadow:var(--shadow);display:flex;flex-direction:column;transition:transform .15s,background .2s}.video-card:hover{transform:translateY(-4px);background:var(--surface-hover)}.video-card__thumbnail{width:100%;aspect-ratio:16 / 9;object-fit:cover;background:#111}.video-card__body{padding:16px;display:flex;flex-direction:column;gap:10px;flex:1}.video-card__title{margin:0;font-size:1rem;line-height:1.35;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.video-card__meta{margin:0;color:var(--muted);font-size:.85rem}.video-card__meta code{background:#ff4ecd26;color:var(--accent);padding:2px 6px;border-radius:4px}.video-card__actions{margin-top:auto;display:flex;flex-direction:column;gap:8px}.video-card__link,.video-card__play{text-align:center;padding:10px 14px;border-radius:8px;text-decoration:none;font-weight:500;font-size:.9rem;transition:background .2s,opacity .2s}.video-card__link{background:transparent;border:1px solid #444;color:var(--text)}.video-card__link:hover{background:#ffffff0f}.video-card__play{background:var(--accent);border:none;color:#fff;cursor:pointer}.video-card__play:hover{background:var(--accent-hover)}.dialog-backdrop{position:fixed;inset:0;background:#000000d9;display:flex;align-items:center;justify-content:center;padding:24px;z-index:1000;animation:fadeIn .2s ease}.dialog{background:var(--surface);border-radius:var(--radius);width:100%;max-width:900px;overflow:hidden;box-shadow:var(--shadow);animation:scaleIn .2s ease}.dialog__header{display:flex;align-items:center;justify-content:space-between;padding:16px 20px;border-bottom:1px solid #333}.dialog__title{margin:0;font-size:1.1rem;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-right:16px}.dialog__close{background:transparent;border:none;color:var(--muted);font-size:1.25rem;cursor:pointer;line-height:1}.dialog__close:hover{color:var(--text)}.dialog__embed{position:relative;padding-bottom:56.25%;background:#000}.dialog__embed iframe{position:absolute;inset:0;width:100%;height:100%;border:0}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes scaleIn{0%{transform:scale(.96);opacity:0}to{transform:scale(1);opacity:1}}@media(max-width:600px){.search-box{flex-direction:column}.video-grid{grid-template-columns:1fr}}